forked from community/product-iots
commit
9a49bd4786
@ -1,213 +0,0 @@
|
|||||||
{{#zone "main"}}
|
|
||||||
<div class="container container-bg white-bg">
|
|
||||||
<div class=" margin-top-double">
|
|
||||||
<div class="row row padding-top-double padding-bottom-double margin-bottom-double">
|
|
||||||
<div class="col-lg-12 margin-top-double">
|
|
||||||
<h1 class="grey ">Fire Alarm</h1>
|
|
||||||
<hr>
|
|
||||||
<p class="margin-bottom-double light-grey ">Connect your Fire Alarm device
|
|
||||||
to the WSO2 device cloud. </p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row margin-bottom-double">
|
|
||||||
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 padding-top">
|
|
||||||
<img src="{{self.publicURL}}/images/firealarm.png" class="img-responsive">
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-6 col-md-8 col-lg-8 padding-top">
|
|
||||||
<h2 class="uppercase">Ingredients</h2>
|
|
||||||
<hr>
|
|
||||||
<p class="grey margin-top">Hardware Requirements </p>
|
|
||||||
<br>
|
|
||||||
<span class="fw-stack fw-lg margin-right">
|
|
||||||
<i class="fw fw-ring fw-stack-2x"> </i>
|
|
||||||
<i class="fw fw-right-arrow-2 fw-stack-1x"></i>
|
|
||||||
</span>Raspberry Pi (Internet Enabled)
|
|
||||||
 
|
|
||||||
<span class="fw-stack fw-lg margin-right">
|
|
||||||
<i class="fw fw-ring fw-stack-2x"> </i>
|
|
||||||
<i class="fw fw-right-arrow-2 fw-stack-1x"></i>
|
|
||||||
</span>DHT11 Temperature Sensor<br/><br/>
|
|
||||||
<span class="fw-stack fw-lg margin-right">
|
|
||||||
<i class="fw fw-ring fw-stack-2x"> </i>
|
|
||||||
<i class="fw fw-right-arrow-2 fw-stack-1x"></i>
|
|
||||||
</span>LED
|
|
||||||
       
|
|
||||||
       
|
|
||||||
|
|
||||||
<span class="fw-stack fw-lg margin-right">
|
|
||||||
<i class="fw fw-ring fw-stack-2x"> </i>
|
|
||||||
<i class="fw fw-right-arrow-2 fw-stack-1x"></i>
|
|
||||||
</span>Buzzer(3v)<br><br>
|
|
||||||
<a href="#" class="download-link btn-operations" data-devicetype="firealarm" data-sketchtype="firealarm">Download</a>
|
|
||||||
<!--form method="POST" class="form-login-box float-left"
|
|
||||||
action="{{sketchPath}}">
|
|
||||||
<input type="hidden" name="deviceType" value="firealarm" />
|
|
||||||
<input type="hidden" name="sketchType" value="firealarm" />
|
|
||||||
<button class="wr-btn margin-right" type="submit">Create
|
|
||||||
Sketch
|
|
||||||
for Ethernet</button>
|
|
||||||
</form-->
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class ="col-xs-12 col-sm-6 col-md-3 col-lg-12 padding-double grey-bg ">
|
|
||||||
<h2 class="uppercase">Prepare</h2><hr>
|
|
||||||
<p class="grey margin-top"><b>Get your device ready</b></p>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">01 </span> <span class="padding-left"><b>Set up your RaspberryPi device as shown in the schematic below and get the FireAlarm setup.</b></span>
|
|
||||||
</div>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom">
|
|
||||||
<span class="circle">02 </span> <span class="padding-left"><b>Connect a monitor to your RaspberryPi via the HDMI cable to get a UI view of the device.</b></span>
|
|
||||||
</div>
|
|
||||||
<div class="margin-doubles padding-top-double margin-bottom-double light-grey margin-left-double margin-bottom">
|
|
||||||
<span class="circle">03 </span> <span class="padding-left"><b>Get the RaspberryPi to connect to the internet (via Ethernet or Wifi) and note its IP_ADDRESS</b></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class ="col-xs-12 col-sm-6 col-md-3 col-lg-12 padding-double grey-bg ">
|
|
||||||
<h2 class="uppercase">Schematic Diagram</h2><hr>
|
|
||||||
<p class="grey margin-top">Click on the image to zoom</p>
|
|
||||||
<center>
|
|
||||||
<a href="{{self.publicURL}}/images/schematicsGuide.png" target="_blank">
|
|
||||||
<img src="{{self.publicURL}}/images/schematicsGuide.png" class="img-responsive" style="max-width: 500px; max-height: 500px" />
|
|
||||||
</a>
|
|
||||||
</center>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row row padding-top-double padding-bottom-double margin-bottom-double ">
|
|
||||||
<div class="col-lg-12 margin-top-double">
|
|
||||||
<h2 class="uppercase ">Connect (Quickstart)</h2>
|
|
||||||
<hr>
|
|
||||||
<p class="margin-bottom-double light-grey ">Internet of Things Foundation Quickstart connection </p>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">01 </span> <span class="padding-left"><b>Click on the <i>"Create DEB"</i> button above to get the download link for the FireAlarm setup files</b></span><br>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
<div>
|
|
||||||
<span class="padding-left"><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></span>
|
|
||||||
</div>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">02 </span> <span class="padding-left"><b>Download the FireAlarm setup files using the following command: "wget <url_link_received_from_the_above_step>"</b></span><br>
|
|
||||||
<i> This will download a zip file named "FireAlarmAgent.zip"</i>
|
|
||||||
</div>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">03 </span> <span class="padding-left"><b>Run the following commands to successfuly install the package and get the service running:</b></span><br>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">04 </span> <span class="padding-left">Use the Sketch program to open the samples code samples/quickstart/quickstart.ino</span><br>
|
|
||||||
</div>
|
|
||||||
<div class="margin-doubles padding-top-double light-grey margin-left-double margin-bottom ">
|
|
||||||
<span class="circle">05 </span> <span class="padding-left">View the lower part of the Sketch pad window to check that the COM connection is shown as active</span><br>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="download-device-modal-content" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Please download the file from following link.</h3>
|
|
||||||
<br/>
|
|
||||||
<div class="buttons">
|
|
||||||
<form method="POST" action="{{sketchPath}}">
|
|
||||||
<input type="hidden" name="deviceType" value="firealarm" />
|
|
||||||
<input type="hidden" name="sketchType" value="firealarm" />
|
|
||||||
<button class="btn-operations" type="submit" style="font-size: 13px;border:none; padding: 10px 10px; display: inline-block; margin-right: 2px; text-decoration: none;">Download Now</button>
|
|
||||||
|
|
||||||
<a href="#" id="download-device-download-link" class="btn-operations">
|
|
||||||
Copy Link
|
|
||||||
</a>
|
|
||||||
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="download-device-modal-content-links" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Please download the file from following link(Press CTRL+C).</h3>
|
|
||||||
<br/>
|
|
||||||
<div>
|
|
||||||
<input id="download-device-url" style="color:#3f3f3f;padding:5px" type="text" value="" placeholder="Type here" size="60">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="device-400-content" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Exception at backend. Try Later.</h3>
|
|
||||||
<div class="buttons">
|
|
||||||
<a href="#" id="device-400-link" class="btn-operations">
|
|
||||||
Ok
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="device-403-content" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Action not permitted.</h3>
|
|
||||||
<div class="buttons">
|
|
||||||
<a href="#" id="device-403-link" class="btn-operations">
|
|
||||||
Ok
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="device-409-content" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Device Sketch does not exist.</h3>
|
|
||||||
<div class="buttons">
|
|
||||||
<a href="#" id="device-409-link" class="btn-operations">
|
|
||||||
Ok
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="device-unexpected-error-content" class="hide">
|
|
||||||
<div class="content">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-6 col-centered">
|
|
||||||
<h3>Unexpected error.</h3>
|
|
||||||
<div class="buttons">
|
|
||||||
<a href="#" id="device-unexpected-error-link" class="btn-operations">
|
|
||||||
Ok
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{{/zone}}
|
|
||||||
{{#zone "topCss"}}
|
|
||||||
<link href="{{self.publicURL}}/css/fontwso2.css" rel="stylesheet">
|
|
||||||
<link href="{{self.publicURL}}/css/fontwso2-extend.css" rel="stylesheet">
|
|
||||||
{{/zone}}
|
|
||||||
{{#zone "bottomJs"}}
|
|
||||||
<script src="{{self.publicURL}}/js/firealarm.js"></script>
|
|
||||||
{{/zone}}
|
|
Loading…
Reference in new issue