mirror of
https://repository.entgra.net/community/device-mgt-plugins.git
synced 2025-09-16 23:42:15 +00:00
Merge pull request #478 from DimalChandrasiri/release-3.0.x
Merging UI/UX improvements
This commit is contained in:
commit
cf2753832f
@ -147,15 +147,15 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
Connect Android device to network.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Start Android Sense app in your device.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
Fill login form with the credentials.
|
||||
<i>(Use server URL as [ https://<WSO2_IoT_SERVER_HOST>:<
|
||||
HTTPS_SERVER_PORT> ] and click on
|
||||
@ -169,7 +169,7 @@
|
||||
</li>
|
||||
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">04</span>
|
||||
<span class="badge">04</span>
|
||||
Once the device is enrolled, click on <strong>[+]</strong> button to
|
||||
select the sensors.
|
||||
<a href="{{@unit.publicUri}}/images/selectSensorView.png" target="_blank"
|
||||
@ -178,7 +178,7 @@
|
||||
</a>
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">05</span>
|
||||
<span class="badge">05</span>
|
||||
Click on <i>[Publish data]</i> button to publish sensor readings to
|
||||
IoT server.
|
||||
<a href="{{@unit.publicUri}}/images/publishDataView.png" target="_blank"
|
||||
@ -190,12 +190,14 @@
|
||||
<br>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 padding-double">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding-double">
|
||||
<div class="row">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 padding-double">
|
||||
<h3 class="uppercase">Try Out</h3>
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
@ -203,7 +205,7 @@
|
||||
<a href="{{@app.context}}/devices">[Device Management]</a> page.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
@ -211,7 +213,7 @@
|
||||
operations and Real-Time data monitoring.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span> For historical analytics of sensor data navigate to device
|
||||
@ -219,6 +221,8 @@
|
||||
</li>
|
||||
</ul>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 padding-double">
|
||||
<p class="grey margin-top">Click on the image to zoom</p>
|
||||
<center>
|
||||
<a href="{{@unit.publicUri}}/images/myDevices_analytics.png" target="_blank">
|
||||
@ -226,6 +230,8 @@
|
||||
</a>
|
||||
</center>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="qr-code-modal" data-enrollment-url="{{hostName}}{{@unit.publicUri}}/asset/androidsense.apk" class="hidden">
|
||||
<div class="modal-header">
|
||||
|
||||
@ -196,11 +196,11 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
Wifi-Shield mounted onto the Arduino-UNO board
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Connect LED bulb to arduino as follows
|
||||
<br/><br/>
|
||||
<a href="{{@unit.publicUri}}/images/schematicsGuide.png" target="_blank">
|
||||
@ -210,20 +210,20 @@
|
||||
</li>
|
||||
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
Download Arduino-Sketch from [Download Sketch] link above.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">04</span>
|
||||
<span class="badge">04</span>
|
||||
Unzip the downloaded Arduino Agent
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">05</span>
|
||||
<span class="badge">05</span>
|
||||
Create a folder called "ArduinoBoardSketch" and move all source files
|
||||
inside
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">06</span>
|
||||
<span class="badge">06</span>
|
||||
Open ArduinoBoardSketch.h and provide appropriate values for
|
||||
<i>[WLAN_SSID]</i>,
|
||||
<i>[WLAN_PASS]</i>,
|
||||
@ -233,19 +233,19 @@
|
||||
variables according to your network.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">07</span>
|
||||
<span class="badge">07</span>
|
||||
Burn the sketch onto your Arduino board and let the program run.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
Arduino will publish it's internal temperature to WSO2-IoT-Server
|
||||
<br/><br/>
|
||||
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
@ -256,22 +256,23 @@
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding-double">
|
||||
<div class="row">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 padding-double">
|
||||
<h3 class="uppercase">Try Out</h3>
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
You can view all your connected devices at
|
||||
<a href="{{@app.context}}/devices">[Device Management]</a> page.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Select one of connected devices and check for available control
|
||||
operations and monitor Real-Time data.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
You can also view analytics of the data published to IoT-Server by
|
||||
navigating to Device Analytics page.
|
||||
</li>
|
||||
@ -288,6 +289,7 @@
|
||||
</center>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#zone "topCss"}}
|
||||
{{css "css/styles.css"}}
|
||||
|
||||
@ -192,31 +192,31 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
Connect RaspberryPi, DHT11 Temperature sensor and LED as per the
|
||||
schematic below.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Ensure your RaspberryPi Board can connect to Internet.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
Download RaspberryPi Agent via [Download Agent] button above.
|
||||
(Alternatively you can use the "curl" command to directly download the Agent to your
|
||||
RaspberryPi.)
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">04</span>
|
||||
<span class="badge">04</span>
|
||||
Copy downloaded Agent into your RaspberryPi.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">05</span>
|
||||
<span class="badge">05</span>
|
||||
Unzip the downloaded Agent and start terminal to run below commands.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
@ -225,7 +225,7 @@
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
|
||||
<span class="fw-stack fw-lg margin-right">
|
||||
<span class="fw-stack margin-right">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-right-arrow fw-stack-1x"></i>
|
||||
</span>
|
||||
@ -251,17 +251,17 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
You can view all your connected devices at
|
||||
<a href="{{@app.context}}/devices">[Device Management]</a> page.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Select one of connected devices and check for available control
|
||||
operations and monitor Real-Time data.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
You can also view analytics of the data published to IoT-Server by
|
||||
navigating to Device Analytics page.
|
||||
</li>
|
||||
|
||||
@ -205,19 +205,15 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
Download your VirtualFireAlarm using [Download Agent] button above.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">01</span>
|
||||
Unzip the downloaded Agent.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">02</span>
|
||||
Move into the unzipped Agent folder in the terminal.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">04</span>
|
||||
<span class="badge">03</span>
|
||||
Unzip the downloaded Agent and start terminal to run this command: [sh
|
||||
start-device.sh]
|
||||
</li>
|
||||
@ -240,17 +236,17 @@
|
||||
<hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">01</span>
|
||||
<span class="badge">01</span>
|
||||
You can view all your connected devices at
|
||||
<a href="{{@app.context}}/devices">[Device Management]</a> page.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">02</span>
|
||||
<span class="badge">02</span>
|
||||
Select one of connected devices and check for available control
|
||||
operations and monitor Real-Time data.
|
||||
</li>
|
||||
<li class="padding-top-double">
|
||||
<span class="circle">03</span>
|
||||
<span class="badge">03</span>
|
||||
You can also view analytics of the data published to IoT-Server by
|
||||
navigating to Device Analytics page.
|
||||
</li>
|
||||
|
||||
@ -37,6 +37,26 @@
|
||||
<br/><br/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-12 padding-double grey-bg">
|
||||
<h3 class="uppercase">Prepare</h3><hr>
|
||||
<ul class="list-unstyled">
|
||||
<li class="padding-top-double"><span class="badge">01</span> Download Device Agent into your Android Mobile.</li>
|
||||
<li><span class="badge">02</span> Install Agent APK file.</li>
|
||||
<li><span class="badge">03</span> Configure Agent App</li>
|
||||
</ul>
|
||||
<br>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 padding-double">
|
||||
<p class="grey margin-top">Click on the image to zoom</p>
|
||||
<center>
|
||||
<a href="{{@unit.publicUri}}/images/android_device.png" target="_blank">
|
||||
<img src="{{@unit.publicUri}}/images/android_device.png" class="img-responsive">
|
||||
</a>
|
||||
</center>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
|
||||
{{#zone "topCss"}}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user