forked from community/product-iots
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
214 lines
12 KiB
214 lines
12 KiB
{{#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 IoT server. </p>
|
|
</div>
|
|
<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 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 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 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 fw-stack-1x"></i>
|
|
</span>Buzzer(3v)<br><br>
|
|
<a href="#" class="download-link btn-operations" data-devicetype="virtual_firealarm" data-sketchtype="virtual_firealarm"><i class="fw fw-download"></i> 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: "curl -k <url_link_received_from_the_above_step> > Agent.zip"</b></span><br>
|
|
<i> This will download a zip file named "Agent.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>
|
|
<b> cd <PATH_WHERE_THE_DOWNLOADED_"Agent.zip"_FILE_IS> </b> <br>
|
|
<b>unzip Agent.zip -d Agent</b> <br>
|
|
<b>cd Agent</b> <br>
|
|
<b>sudo chmod 755 startservice.sh</b> <br>
|
|
<b>sudo ./startservice.sh</b> <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">Follow the installation instructions and complete installation. Upon completion the Agent would have started automatically</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}}
|