turcy
/
device-mgt-plugins
forked from community/device-mgt-plugins
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

cleanup markup on devices

Browse Source
Dakshika Jayathilaka 9 years ago
parent 6f73e6abc8
commit 7b55e128c9
1 changed files with 70 additions and 55 deletions
Show Stats Download Patch File Download Diff File

73
features/device-mgt-iot-digitaldisplay-feature/org.wso2.carbon.device.mgt.iot.digitaldisplay.feature/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.digital_display.type-view/type-view.hbs
Unescape View File

@ -4,27 +4,33 @@
<p class="margin-bottom-double light-grey ">Connect your Digital Display <p class="margin-bottom-double light-grey ">Connect your Digital Display
to the WSO2 device cloud.</p> to the WSO2 device cloud.</p>
</div> </div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 padding-top"> <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 padding-top">
<img src="{{@unit.publicUri}}/images/display-icon.png" class="img-responsive"> <img src="{{@unit.publicUri}}/images/display-icon.png" class="img-responsive">
</div> </div>
<div class="col-xs-12 col-sm-6 col-md-8 col-lg-8 padding-top"> <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
<h3 class="uppercase">Ingredients</h3> <h3 class="uppercase">Ingredients</h3>
<hr> <hr>
<p class="grey margin-top">Hardware Requirements </p> <p class="grey margin-top">Hardware Requirements </p>
<br> <br>
<ul> <ul class="list-unstyled">
<span class="fw-stack fw-lg margin-right"> <li>
<span class="fw-stack margin-right">
<i class="fw fw-ring fw-stack-2x"> </i> <i class="fw fw-ring fw-stack-2x"> </i>
<i class="fw fw-right-arrow fw-stack-1x"></i> <i class="fw fw-right-arrow fw-stack-1x"></i>
</span> Raspberry Pi <br/> </span> Raspberry Pi
<span class="fw-stack fw-lg margin-right"> </li>
<li>
<span class="fw-stack margin-right">
<i class="fw fw-ring fw-stack-2x"> </i> <i class="fw fw-ring fw-stack-2x"> </i>
<i class="fw fw-right-arrow fw-stack-1x"></i> <i class="fw fw-right-arrow fw-stack-1x"></i>
</span> WIFI Shield<br/> </span> WIFI Shield
<span class="fw-stack fw-lg margin-right"> </li>
<li>
<span class="fw-stack margin-right">
<i class="fw fw-ring fw-stack-2x"> </i> <i class="fw fw-ring fw-stack-2x"> </i>
<i class="fw fw-right-arrow fw-stack-1x"></i> <i class="fw fw-right-arrow fw-stack-1x"></i>
</span> Digital Display with HDMI Cable<br/> </span> Digital Display with HDMI Cable
</li>
</ul> </ul>
<br> <br>
@ -56,9 +62,9 @@
Now</a> Now</a>
&nbsp;&nbsp; &nbsp;&nbsp;
<a href="#" id="download-device-download-link" class="blue-button"> <a href="#" id="download-device-download-link" class="blue-button">
&nbsp;&nbsp;&nbsp;&nbsp;Copy Link&nbsp;&nbsp;&nbsp;&nbsp; Copy Link
</a> </a>
&nbsp;&nbsp;
</div> </div>
</form> </form>
</div> </div>
@ -90,7 +96,7 @@
<div class="buttons"> <div class="buttons">
<a href="#" id="device-400-link" class="btn-operations"> <a href="#" id="device-400-link" class="btn-operations">
&nbsp;&nbsp;&nbsp;&nbsp;OK&nbsp;&nbsp;&nbsp;&nbsp; OK
</a> </a>
</div> </div>
</div> </div>
@ -106,10 +112,10 @@
<div class="buttons"> <div class="buttons">
<a href="#" id="device-401-link" class="blue-button"> <a href="#" id="device-401-link" class="blue-button">
&nbsp;&nbsp;&nbsp;&nbsp;Goto Login Page&nbsp;&nbsp;&nbsp;&nbsp; Goto Login Page
</a>&nbsp;&nbsp; </a>&nbsp;&nbsp;
<a href="#" onclick="hidePopup();" class="btn-operations"> <a href="#" onclick="hidePopup();" class="btn-operations">
&nbsp;&nbsp;&nbsp;&nbsp;Cancel&nbsp;&nbsp;&nbsp;&nbsp; Cancel
</a> </a>
</div> </div>
</div> </div>
@ -125,7 +131,7 @@
<div class="buttons"> <div class="buttons">
<a href="#" id="device-403-link" class="btn-operations"> <a href="#" id="device-403-link" class="btn-operations">
&nbsp;&nbsp;&nbsp;&nbsp;OK&nbsp;&nbsp;&nbsp;&nbsp; OK
</a> </a>
</div> </div>
</div> </div>
@ -141,7 +147,7 @@
<div class="buttons"> <div class="buttons">
<a href="#" id="device-409-link" class="btn-operations"> <a href="#" id="device-409-link" class="btn-operations">
&nbsp;&nbsp;&nbsp;&nbsp;OK&nbsp;&nbsp;&nbsp;&nbsp; OK
</a> </a>
</div> </div>
</div> </div>
@ -157,7 +163,7 @@
<div class="buttons"> <div class="buttons">
<a href="#" id="device-unexpected-error-link" class="btn-operations"> <a href="#" id="device-unexpected-error-link" class="btn-operations">
&nbsp;&nbsp;&nbsp;&nbsp;OK&nbsp;&nbsp;&nbsp;&nbsp; OK
</a> </a>
</div> </div>
</div> </div>
@ -168,37 +174,46 @@
<br/><br/> <br/><br/>
</div> </div>
<div class="col-xs-12 col-sm-6 col-md-3 col-lg-12 padding-double grey-bg "> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding-double grey-bg">
<h3 class="uppercase">Prepare</h3><hr> <h3 class="uppercase">Prepare</h3><hr>
<p class="grey margin-top">Get your device ready</p> <p class="grey margin-top">Get your device ready</p>
<br/> <br/>
<ul> <ul class="list-unstyled">
<p class="padding-top-double"><span class="circle">01</span> Set up your RaspberryPi device as shown in the schematic below and get the Digital Display setup.</p> <li class="padding-top-double"><span class="circle">01</span> Set up your RaspberryPi device as shown in
<p class="padding-top-double"><span class="circle">02</span> Connect a monitor to your RaspberryPi via the HDMI cable to get a UI view of the device.</p> the schematic below and get the Digital Display setup.</li>
<p class="padding-top-double"><span class="circle">03</span> Get the RaspberryPi to connect to the internet (via Ethernet or Wifi) and note its IP_ADDRESS</p> <li class="padding-top-double"><span class="circle">02</span> Connect a monitor to your RaspberryPi via the
HDMI cable to get a UI view of the device.</li>
<li class="padding-top-double"><span class="circle">03</span> Get the RaspberryPi to connect to the internet
(via Ethernet or Wifi) and note its IP_ADDRESS</li>
</ul> </ul>
<br> <br>
</div> </div>
<div class="col-xs-12 col-sm-6 col-md-3 col-lg-12 padding-double"> <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 padding-double">
<h3 class="uppercase">Schematic Diagram</h3><hr> <h3 class="uppercase">Schematic Diagram</h3><hr>
<p class="grey margin-top">Click on the image to zoom</p> <p class="grey margin-top">Click on the image to zoom</p>
<center> <center>
<a href="{{@unit.publicUri}}/images/schematicsGuide.png" target="_blank"> <a href="{{@unit.publicUri}}/images/schematicsGuide.png" target="_blank">
<img src="{{@unit.publicUri}}/images/schematicsGuide.png" class="img-responsive" style="max-width: 500px; max-height: 500px"> <img src="{{@unit.publicUri}}/images/schematicsGuide.png" class="img-responsive">
</a> </a>
</center> </center>
<br/> <br/>
</div> </div>
<div class="col-xs-12 col-sm-6 col-md-3 col-lg-12 padding-double"> <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 padding-double">
<h3 class="uppercase">Connect (Quick Start)</h3><hr> <h3 class="uppercase">Connect (Quick Start)</h3><hr>
<p class="grey margin-top">Internet of Things Foundation Quickstart connection</p> <p class="grey margin-top">Internet of Things Foundation Quickstart connection</p>
<br/> <br/>
<ul> <ul class="list-unstyled">
<p class="padding-top-double"><span class="circle">01</span> <b>Click on the <i>'Create DEB'</i> button above to get the download link for the Digital Display setup files</b></p> <li class="padding-top-double"><span class="circle">01</span>
<p class="padding-top-double"><span class="circle">02</span> <i>(The following commands can be issued by directly typing into the terminal of the device or by an <b>'ssh'</b> login from a remote PC)</i></p> Click on the <i>'Create DEB'</i> button above to get the download link for the Digital Display setup
<p class="padding-top-double"><span class="circle">03</span> <b>Download the Digital Display setup files using the following command: 'curl -k < url_link_received_from_the_above_step >> Agent.zip'</b><br/><i>This will download a zip file named 'Agent.zip'</i></p> files</li>
<li class="padding-top-double"><span class="circle">02</span> <i>(The following commands can be issued by
directly typing into the terminal of the device or by an <b>'ssh'</b> login from a remote PC)</i></li>
<li class="padding-top-double"><span class="circle">03</span> Download the Digital Display setup files
using the following command: 'curl -k < url_link_received_from_the_above_step >> Agent.zip'
This will download a zip file named 'Agent.zip'
</li>
</ul> </ul>
<br> <br>
</div> </div>

Write Preview
Loading…
Cancel
Save