Connecting to unsecured network

This commit is contained in:
peteruithoven 2014-04-25 16:24:16 +02:00
parent d147ccceab
commit 7a008250c1
3 changed files with 138 additions and 23 deletions

View File

@ -0,0 +1,93 @@
/*
* This file is part of the Doodle3D project (http://doodle3d.com).
*
* Copyright (c) 2013, Doodle3D
* This software is licensed under the terms of the GNU GPL v2 or later.
* See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
*/
(function ConnectingToNetworkPage(w) {
var _page;
var _statusField;
var _actionField;
var _networkAPI = new NetworkAPI();
var _pageData = {};
var PAGE_ID = "#connecting_to_network";
var _self = this;
$.mobile.document.on( "pageinit", PAGE_ID, function( event, data ) {
console.log("Connecting to network page pageinit");
_page = $(this);
_statusField = _page.find("#status");
_actionField = _page.find("#action");
});
$.mobile.document.on( "pagebeforeshow", PAGE_ID, function( event, data ) {
console.log("Connecting to network page pagebeforeshow");
_pageData = d3d.util.getPageParams(PAGE_ID);
var boxURL = "http://"+_pageData.localip;
//console.log(" _boxData: ",_boxData);
_networkAPI.init(boxURL);
_networkAPI.refreshing = onRefreshing;
_networkAPI.updated = onStatusUpdated;
joinNetwork();
_networkAPI.startAutoRefresh();
});
$.mobile.document.on( "pagehide", PAGE_ID, function( event, data ) {
console.log("Connecting to network page pagehide");
_networkAPI.stopAutoRefresh();
});
function joinNetwork() {
console.log("joinNetwork");
console.log(" _pageData.password: ",_pageData.password);
_networkAPI.associate(_pageData.ssid,_pageData.password,true);
}
function onRefreshing() {
//console.log("ConnectingToNetworkPage:onRefreshing");
d3d.util.showLoader(true);
}
function onStatusUpdated(data) {
console.log("ConnectingToNetworkPage:onStatusUpdated");
console.log(" data: ",data);
data.status = parseInt(data.status,10);
console.log(" data.status: ",data.status);
// update texts
var statusText = "";
var actionText = "";
switch(data.status) {
case NetworkAPI.STATUS.CONNECTING:
statusText = "Connecting to network ";
actionText = "Please reconnect to <b>"+_pageData.ssid+"</b>. Once you are connected return to this page.";
_actionField.attr("class","info");
break;
case NetworkAPI.STATUS.CONNECTING_FAILED:
statusText = "Could not connect...";
actionText = "Please check password and try again";
_actionField.attr("class","error");
break;
case NetworkAPI.STATUS.CONNECTED:
statusText = "Connected";
actionText = "The WiFi-Box is connected to <b>"+_pageData.ssid+"</b>";
_actionField.attr("class","info");
break;
default:
actionText = "Something went wrong, please try again";
_actionField.attr("class","error");
break;
}
_statusField.html(statusText);
_actionField.html(actionText);
if(data.status == NetworkAPI.STATUS.CONNECTED) {
_networkAPI.stopAutoRefresh();
}
// ToDo: attempt to auto redirect to connected WiFi-Box
// attempt to retrieve connectAPI list, if same wifiboxid available (only works for version 0.10.2+), redirect to box page
}
})(window);
//new JoinNetworkPage();

View File

@ -23,6 +23,27 @@ text-align: center;
border-radius: 15px;
}
#action {
margin: 0 -1em;
padding: 1em;
color: #fff;
text-shadow: 0px 1px 0px #999;
}
#action.error {
background: #EB313C;
text-shadow: 0px 1px 0px #333;
}
#action.warning {
background: #E9A86E;
}
#action.notice {
background: #93CAF4;
}
#action.info {
background: #97DD8A;
}
@media only screen and (min-width: 768px) {
body {
padding-left: 20em;

View File

@ -280,33 +280,20 @@
</div><!-- /header -->
<div role="main" class="ui-content">
<p>Select your own network from the following list:</p>
<br/>
<ul data-role="listview">
<!-- <p>Select your own network from the following list:</p>
<br/> -->
<ul data-role="listview"
data-connecting-target="#connecting_to_network"
data-secured-target="#join_secured_network">
<!-- <li data-icon="lock"><a href="#join_secured_network">Baksteen</a></li>
<li><a href="#connecting_to_network">Thomson12445</a></li>
<li><a href="#connecting_to_network">H234SD53</a></li>
<li data-icon="edit"><a href="#join_other_network">Other...</a></li> -->
<li><a href="#connecting_to_network">H234SD53</a></li>-->
<li data-icon="edit" id="joinOther"><a href="#join_other_network">Other...</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="join_other_network">
<a href="#devices"><img id="logo" src="img/logo_full.png"></a>
<div data-role="header">
<a href="../toolbar/" data-rel="back" class="ui-btn ui-btn-left ui-alt-icon ui-nodisc-icon ui-corner-all ui-btn-icon-notext ui-icon-carat-l">Back</a>
<h1>Connect</h1>
</div><!-- /header -->
<div role="main" class="ui-content">
<h3>Join a hidden network</h3>
<input type="text" name="textinput-s" id="ssid" placeholder="Network name" value="" data-clear-btn="true">
<input type="password" name="textinput-s" id="textinput-s" placeholder="Password" value="" data-clear-btn="true">
<button class="ui-shadow ui-btn ui-corner-all">Connect</button>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="join_secured_network">
<a href="#devices"><img id="logo" src="img/logo_full.png"></a>
<div data-role="header">
@ -320,16 +307,30 @@
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="connecting_to_network">
<div data-role="page" id="join_other_network">
<a href="#devices"><img id="logo" src="img/logo_full.png"></a>
<div data-role="header">
<a href="../toolbar/" data-rel="back" class="ui-btn ui-btn-left ui-alt-icon ui-nodisc-icon ui-corner-all ui-btn-icon-notext ui-icon-carat-l">Back</a>
<h1>Connect</h1>
</div><!-- /header -->
<div role="main" class="ui-content">
<h3>Join a hidden network</h3>
<input type="text" name="textinput-s" id="ssid" placeholder="Network name" value="" data-clear-btn="true">
<input type="password" name="textinput-s" id="textinput-s" placeholder="Password" value="" data-clear-btn="true">
<button class="ui-shadow ui-btn ui-corner-all">Connect</button>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="connecting_to_network">
<a href="#devices"><img id="logo" src="img/logo_full.png"></a>
<div data-role="header">
<a href="../toolbar/" data-rel="back" class="ui-btn ui-btn-left ui-alt-icon ui-nodisc-icon ui-corner-all ui-btn-icon-notext ui-icon-carat-l">Back</a>
<h1>Connecting...</h1>
</div><!-- /header -->
<div role="main" class="ui-content">
<img id="logo" src="img/Connect to home.png">
<h3>Connecting to network...</h3>
<p>Your WiFi-Box is trying to connect to your local network. To use your WiFi-Box, reconnect to the network you directed the WiFi-Box to. Once you are connected return to this page.</p>
<h3 id="status"></h3>
<p id="action"></p>
<!-- redirect to connect.doodle3d.com when reconnected to internet -->
</div><!-- /content -->
</div><!-- /page -->