206 lines
12 KiB
HTML
206 lines
12 KiB
HTML
|
<div class="row">
|
||
|
|
<div class="col-md-7" ng-controller="USBController">
|
||
|
|
<div class="panel panel-default">
|
||
|
|
<div class="panel-heading">
|
||
|
|
<h3 class="panel-title">USB & TTY
|
||
|
|
<span class="pull-right" data-toggle="modal" data-target="#USBInfo">
|
||
|
|
ℹ
|
||
|
|
</span>
|
||
|
|
</h3>
|
||
|
|
</div>
|
||
|
|
<div class="panel-body">
|
||
|
|
<div class="center-block" ng-hide="lsusb">
|
||
|
|
<img class="center-block" src="img/throbber.gif">
|
||
|
|
</div>
|
||
|
|
<pre class="scrollable-pre" ng-show="lsusb">{{ lsusb }}</pre>
|
||
|
|
|
||
|
|
<div class="center-block" ng-hide="availableTTYs">
|
||
|
|
<img class="center-block" src="img/throbber.gif">
|
||
|
|
</div>
|
||
|
|
<pre class="scrollable-pre" ng-show="availableTTYs">{{ availableTTYs }}</pre>
|
||
|
|
<div>
|
||
|
|
<span class="pull-right">
|
||
|
|
<button type="button" class="btn btn-default" style="padding: 0px 5px;" ng-click="installDepends();" ng-hide="installed">
|
||
|
|
Install Dependencies
|
||
|
|
</button>
|
||
|
|
<button type="button" class="btn btn-default" style="padding: 0px 5px;" ng-click="removeDepends();" ng-show="installed">Remove Dependencies
|
||
|
|
</button>
|
||
|
|
<button type="button" class="btn btn-default" style="padding: 0px 5px;" ng-click="refresh();">
|
||
|
|
Refresh
|
||
|
|
</button>
|
||
|
|
<img src="/img/throbber.gif" ng-show="installing">
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-5" ng-controller="ConnectionController">
|
||
|
|
<div class="panel panel-default">
|
||
|
|
<div class="panel-heading">
|
||
|
|
<h3 class="panel-title">Mobile Connection</h3>
|
||
|
|
</div>
|
||
|
|
<div class="panel-body">
|
||
|
|
<span class="label label-success" ng-show="connected">Connected</span>
|
||
|
|
<span class="label label-warning" ng-show="connecting">Connecting</span>
|
||
|
|
<span class="label label-default" ng-show="disconnected">Not Connected</span>
|
||
|
|
<button class="btn btn-default btn-fixed-width pull-right" style="padding: 0px 5px;" ng-show="!connected" ng-click="setConnection();">Connect</button>
|
||
|
|
<button class="btn btn-danger btn-fixed-width pull-right" style="padding: 0px 5px;" ng-show="connected" ng-click="unsetConnection();">Disconnect</button>
|
||
|
|
<div ng-show="connected">
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-md-7">
|
||
|
|
<div class="panel panel-default" ng-controller="ModemController">
|
||
|
|
<div class="panel-heading">
|
||
|
|
<h3 class="panel-title">Modem Configuration
|
||
|
|
<span class="pull-right" data-toggle="modal" data-target="#ModemInfo">
|
||
|
|
ℹ
|
||
|
|
</span>
|
||
|
|
</h3>
|
||
|
|
</div>
|
||
|
|
<div class="panel-body">
|
||
|
|
<div class="well well-sm alert-danger" ng-show="loadConfigurationError">{{ loadConfigurationError }}</div>
|
||
|
|
<div class="well well-sm alert-danger" ng-show="saveConfigurationError">{{ saveConfigurationError }}</div>
|
||
|
|
<div class="well well-sm alert-danger" ng-show="resetConfigurationError">{{ resetConfigurationError }}</div>
|
||
|
|
<div class="well well-sm alert-success" ng-show="savedConfiguration">Configuration saved. You may need to reboot for changes to take place.</div>
|
||
|
|
<div class="well well-sm alert-success" ng-show="resetConfigurationSuccess">Configuration reset.</div>
|
||
|
|
|
||
|
|
<div class="form-horizontal">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="interfaceName" class="col-sm-2 control-label">Interface Name</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="interfaceName" placeholder="ppp0" ng-model="interface">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="protocol" class="col-sm-2 control-label">Protocol</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<select class="form-control" ng-model="protocol">
|
||
|
|
<option value="3g">3G/4G</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="service" class="col-sm-2 control-label">Service</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<select class="form-control" ng-model="service">
|
||
|
|
<option value="cdma">CDMA</option>
|
||
|
|
<option value="evdo">EVDO</option>
|
||
|
|
<option value="umts">UMTS</option>
|
||
|
|
<option value="gprs">GPRS</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="vendorid" class="col-sm-2 control-label">VID:PID</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<div class="input-group">
|
||
|
|
<input type="text" class="form-control" id="vendorid" placeholder="VID" ng-model="vendorid">
|
||
|
|
<span class="input-group-addon">:</span>
|
||
|
|
<input type="text" class="form-control" id="productid" placeholder="PID" ng-model="productid">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="device" class="col-sm-2 control-label">Device</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="device" placeholder="/dev/ttyUSB0" ng-model="device">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="apn" class="col-sm-2 control-label">APN</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="apn" placeholder="apn.vodafone.co.uk" ng-model="apn">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="username" class="col-sm-2 control-label">Username</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="username" placeholder="Username" ng-model="username">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="password" class="col-sm-2 control-label">Password</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="password" class="form-control" id="password" placeholder="Password" ng-model="password">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="DNS" class="col-sm-2 control-label">DNS</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="DNS" placeholder="8.8.8.8" ng-model="dns">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="pppdOptions" class="col-sm-2 control-label">PPPd Options</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<input type="textbox" class="form-control" id="pppdOptions" placeholder="" ng-model="pppdoptions">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-sm-2 control-label">Other Options</label>
|
||
|
|
<div class="col-sm-10">
|
||
|
|
<label class="checkbox-inline"><input type="checkbox" ng-model="peerdns">Peer DNS</label>
|
||
|
|
<label class="checkbox-inline"><input type="checkbox" ng-model="pppredial">PPP Redial</label>
|
||
|
|
<label class="checkbox-inline"><input type="checkbox" ng-model="defaultroute">Default Route</label>
|
||
|
|
<label class="checkbox-inline"><input type="checkbox" ng-model="keepalive">Keep Alive</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="col-sm-offset-2 col-sm-10">
|
||
|
|
<span class="pull-right">
|
||
|
|
<button class="btn btn-danger" ng-click="resetConfiguration();">Reset</button>
|
||
|
|
<button class="btn btn-default" ng-click="saveConfiguration();">Save</button>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="modal fade" id="USBInfo" tabindex="-1" role="dialog" aria-labelledby="USBInfoModal">
|
||
|
|
<div class="modal-dialog" role="document">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||
|
|
<h4 class="modal-title" id="myModalLabel">USB & TTY Information</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<h3>USB</h3>
|
||
|
|
<p>The USB information is displayed at the top. It will show the bus, device, <b>VID:PID</b> and its name.
|
||
|
|
The important information is usually the <b>V</b>endor<b>ID</b> and <b>P</b>roduct<b>ID</b>. This Information
|
||
|
|
is used to identify the USB device once inserted.</p>
|
||
|
|
<h3>TTYs</h3>
|
||
|
|
<p>Modems will produce one or more TTYs in the form of <b>ttyUSBX</b>, where X is a number from 0. These TTYs are used
|
||
|
|
to communicate with the modem when dialing.</p>
|
||
|
|
<p>You may not need the information in this section, but it is supplied just incase.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="ModemInfo" tabindex="-1" role="dialog" aria-labelledby="ModemInfoModal">
|
||
|
|
<div class="modal-dialog" role="document">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||
|
|
<h4 class="modal-title" id="myModalLabel">Modem Information</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<p>This help dialog provides enough information to configure your 3G/4G Modem and initiate a connection. For more information
|
||
|
|
about 3G/4G devices and the WiFi Pineapple, please visit the <a href="https://wiki.wifipineapple.com/legacy/compatible_modems.md">WiFi Pineapple Wiki</a>
|
||
|
|
and the <a href="https://wiki.openwrt.org/doc/recipes/3gdongle">OpenWRT article on modems</a>.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|