Initial core the new overhauled ui in angular.html with fixes for ui in the old index.html
This commit is contained in:
hamza zia
parent
e7c9e4d0cc
commit
571eaf8257
|
|
@ -12,13 +12,11 @@ Then download the webui, you can either do that by downloading this repository a
|
||||||
|
|
||||||
Status
|
Status
|
||||||
===========
|
===========
|
||||||
Usable but some bugs here and there. A lot more to features to come so stay tuned.
|
Usable but some bugs here and there. A complete overhaul is underway in the angular.html but its completely broken currently and once it is completed then it would replace the old index.html
|
||||||
|
|
||||||
TODO
|
TODO
|
||||||
-----------
|
-----------
|
||||||
* More advance options for new download
|
* Implement all features of the old version into the new architecture in angular.html
|
||||||
* More specialized info for special download types like bit torrent and metalink
|
|
||||||
* Adding URIs to existing downloads
|
|
||||||
|
|
||||||
|
|
||||||
Dependencies
|
Dependencies
|
||||||
|
|
|
||||||
208
angular.html
Normal file
208
angular.html
Normal file
|
|
@ -0,0 +1,208 @@
|
||||||
|
<!doctype>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<link rel="icon" href="favicon.ico" />
|
||||||
|
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
<title>aria2 web client</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="css/bootstrap.css">
|
||||||
|
<link rel="stylesheet" href="css/font-awesome.css">
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- external javascript dependencies -->
|
||||||
|
<script src="js/libs/jquery-1.8.3.js"></script>
|
||||||
|
<script src="js/libs/underscore.js"></script>
|
||||||
|
|
||||||
|
<script src="js/libs/bootstrap.js"></script>
|
||||||
|
|
||||||
|
<script src="js/libs/angular.js"></script>
|
||||||
|
|
||||||
|
<script src="js/libs/jquery.flot.js"></script>
|
||||||
|
<script src="js/libs/jquery.flot.resize.js"></script>
|
||||||
|
|
||||||
|
<!-- webui core -->
|
||||||
|
<script src="js/app.js"></script>
|
||||||
|
|
||||||
|
<script src="js/services/deps.js"></script>
|
||||||
|
<script src="js/services/base64.js"></script>
|
||||||
|
<script src="js/services/utils.js"></script>
|
||||||
|
|
||||||
|
<script src="js/services/rpc/jsoncall.js"></script>
|
||||||
|
<script src="js/services/rpc/sockcall.js"></script>
|
||||||
|
<script src="js/services/rpc/syscall.js"></script>
|
||||||
|
<script src="js/services/rpc/rpc.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="js/ctrls/nav.js"></script>
|
||||||
|
<script src="js/ctrls/modal.js"></script>
|
||||||
|
<script src="js/ctrls/download.js"></script>
|
||||||
|
|
||||||
|
<script src="js/init.js"></script>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="navbar navbar-inverse navbar-fixed-top" ng-controller="NavCtrl">
|
||||||
|
<div class="navbar-inner">
|
||||||
|
<div class="container">
|
||||||
|
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
|
||||||
|
<a class="btn btn-navbar"
|
||||||
|
data-toggle="collapse"
|
||||||
|
data-target=".nav-collapse">
|
||||||
|
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
<span class="icon-bar"></span>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a class="brand">{{ name }}</a>
|
||||||
|
|
||||||
|
<div class="nav-collapse">
|
||||||
|
<ul class="nav">
|
||||||
|
<li class="dropdown">
|
||||||
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
||||||
|
Add <b class="caret"></b>
|
||||||
|
</a>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li>
|
||||||
|
<a href="#"><i class="icon-download"></i> Add Download URL</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"><i class="icon-file"></i> Add Metalink</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#"><i class="icon-file"></i> Add Torrent</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dropdown" id="stop_downloads">
|
||||||
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
||||||
|
Manage <b class="caret"></b>
|
||||||
|
</a>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li><a href="#"><i class="icon-pause"></i> Pause All</a></li>
|
||||||
|
<li><a href="#"><i class="icon-play"></i> Resume Paused</a></li>
|
||||||
|
<li><a href="#"><i class="icon-remove"></i> Purge Completed</a></li>
|
||||||
|
<li><a href="#"><i class="icon-fire"></i> Remove All</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul class="nav">
|
||||||
|
<li class="dropdown">
|
||||||
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||||
|
Settings <b class="caret"></b>
|
||||||
|
</a>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li><a href="#">
|
||||||
|
<i class="icon-wrench"></i> Connection Settings</a>
|
||||||
|
</li>
|
||||||
|
<li><a href="#">
|
||||||
|
<i class="icon-wrench"></i> Global Settings</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul class="nav pull-right">
|
||||||
|
<li class="dropdown">
|
||||||
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||||||
|
About <b class="caret"></b>
|
||||||
|
</a>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li><a href="#">
|
||||||
|
<i class="icon-list-alt"></i> Global Statistics</a></li>
|
||||||
|
<li><a href="#">
|
||||||
|
<i class="icon-info-sign"></i> About</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div><!--/.nav-collapse -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div role="main" class="container" ng-controller="DownloadCtrl">
|
||||||
|
|
||||||
|
<div id="active_downloads">
|
||||||
|
<table class="active-download" ng-repeat="download in getDownloads()">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td data-toggle="collapse" data-target=".download-detail .collapse" class="download-overview">
|
||||||
|
<b class="download-name">{{name}}</b>
|
||||||
|
|
||||||
|
<ul class="stats hidden-phone pull-right">
|
||||||
|
<li class="label label-success">Time left: <span class="download-eta">{{eta}}</span></li>
|
||||||
|
<li class="label label-success">Download Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
|
<li class="label label-success">Progress: <span class="download-down_speed">{{percentage}}%</span></li>
|
||||||
|
</ul>
|
||||||
|
<div class="progress full-progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
|
||||||
|
<div class="bar" style="width: 90%;"></div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="download-controls">
|
||||||
|
<div class="btn-group">
|
||||||
|
<button class="btn btn-mini download_pause"><i class="icon-pause"></i></button>
|
||||||
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||||
|
<span class="caret"></span>
|
||||||
|
</button>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
|
||||||
|
<li><a><i class="icon-cog"></i> Settings</a></li>
|
||||||
|
<li><a><i class="icon-list-alt"></i> Peers</a></li>
|
||||||
|
<li><a data-toggle="collapse" data-target=".download-detail .collapse"><i class="icon-info-sign"></i> More Info</a></li>
|
||||||
|
<li><a href="#"><i class="icon-remove"></i> Remove</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr data-toggle="collapse" data-target=".download-detail .collapse" class="download-detail">
|
||||||
|
<td colspan="2">
|
||||||
|
<div class="collapse more_info">
|
||||||
|
<canvas class="progress chunk-canvas" width="1400" style="width: 100%;"></canvas>
|
||||||
|
<ul class="stats">
|
||||||
|
<li class="label">Status: <span class="download-status">{{status}}</span></li>
|
||||||
|
<li class="label">GID: <span class="download-gid">{{gid}}</span></li>
|
||||||
|
<li class="label">Dir: <span class="download-dir">{{dir}}</span></li>
|
||||||
|
<li class="label">Size: <span class="download-size">{{size}}</span></li>
|
||||||
|
<li class="label">Downloaded: <span class="download-downloaded">{{downloaded}}</span></li>
|
||||||
|
<li class="label">Num of Pieces: <span class="download-numPieces">{{numPieces}}</span></li>
|
||||||
|
<li class="label">Piece Length: <span class="download-pieceLength">{{pieceLength}}</span></li>
|
||||||
|
<li class="label">ETA: <span class="download-eta">{{eta}}</span></li>
|
||||||
|
<li class="label">Down Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
|
<li class="label">Upload Speed: <span class="download-upload_speed">{{upload_speed}}</span></li>
|
||||||
|
<li class="label">Upload Length: <span class="download-uploadLength">{{uploadLength}}</span></li>
|
||||||
|
<li class="label">Connections: <span class="download-connections">{{connections}}</span></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h4 class="hidden-phone">Download Files</h4>
|
||||||
|
<ul class="download-files hidden-phone">
|
||||||
|
<li class="label">{{path}} ({{size}})</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="download-graph"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="waiting_downloads"></div>
|
||||||
|
|
||||||
|
<div id="stopped_downloads"></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
87
css/style.css
Normal file
87
css/style.css
Normal file
|
|
@ -0,0 +1,87 @@
|
||||||
|
.download-name {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.active-download {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background-color: rgb(245, 245, 245);
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.05);
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
.waiting-download {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background-color: rgb(245, 245, 245);
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.05);
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
.stopped-download {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background-color: rgb(245, 245, 245);
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.05);
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
.stats {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.stats li {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.download-controls {
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
.download-controls .btn-group {
|
||||||
|
height: 70px;
|
||||||
|
width: 100%;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.download-controls .btn-group .btn:nth-child(1) {
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
.download-controls .btn-group .btn:nth-child(2) {
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.download-controls .btn-group .btn {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.download-controls .btn-group .btn i {
|
||||||
|
height: 100%;
|
||||||
|
font-size: 28px;
|
||||||
|
color: gray;
|
||||||
|
}
|
||||||
|
.download-overview {
|
||||||
|
padding: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.download-detail {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.download-detail .stats li {
|
||||||
|
width: 150px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
.download-detail h4 {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.download-files {
|
||||||
|
width: 90%;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
.download-files li {
|
||||||
|
padding: 5px;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
@media all and (min-width: 980px) {
|
||||||
|
body {
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
449
index.html
449
index.html
|
|
@ -12,13 +12,14 @@
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/bootstrap.css">
|
<link rel="stylesheet" href="css/bootstrap.css">
|
||||||
<link rel="stylesheet" href="css/font-awesome.css">
|
<link rel="stylesheet" href="css/font-awesome.css">
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
|
||||||
|
|
||||||
<!-- external javascript dependencies -->
|
<!-- external javascript dependencies -->
|
||||||
<script src="js/libs/jquery-1.8.3.js"></script>
|
<script src="js/libs/jquery-1.8.3.js"></script>
|
||||||
<script src="js/libs/jquery.flot.js"></script>
|
<script src="js/libs/jquery.flot.js"></script>
|
||||||
<script src="js/libs/jquery.flot.resize.js"></script>
|
<script src="js/libs/jquery.flot.resize.js"></script>
|
||||||
<script src="js/libs/lodash.underscore.min.js"></script>
|
<script src="js/libs/underscore.js"></script>
|
||||||
<script src="js/libs/bootstrap.js"></script>
|
<script src="js/libs/bootstrap.js"></script>
|
||||||
<script src="js/libs/mustache.js"></script>
|
<script src="js/libs/mustache.js"></script>
|
||||||
<script src="js/libs/piecon.js"></script>
|
<script src="js/libs/piecon.js"></script>
|
||||||
|
|
@ -66,229 +67,197 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
.active-download {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
background-color: rgb(245, 245, 245);
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.05);
|
|
||||||
border-radius: 4px 4px 4px 4px;
|
|
||||||
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
|
||||||
.stats {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.stats li {
|
|
||||||
width: 145px;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.download-controls {
|
|
||||||
width: 60px;
|
|
||||||
}
|
|
||||||
.download-controls .btn-group {
|
|
||||||
height: 70px;
|
|
||||||
width: 100%;
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.download-controls .btn-group .btn:nth-child(1) {
|
|
||||||
width: 70%;
|
|
||||||
}
|
|
||||||
.download-controls .btn-group .btn:nth-child(2) {
|
|
||||||
width: 30%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.download-controls .btn-group .btn {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.download-controls .btn-group .btn i {
|
|
||||||
height: 100%;
|
|
||||||
font-size: 28px;
|
|
||||||
color: gray;
|
|
||||||
}
|
|
||||||
.download-overview {
|
|
||||||
padding: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.download-detail {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.download-detail .stats li {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
.download-detail h4 {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
.download-files {
|
|
||||||
width: 90%;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
.download-files li {
|
|
||||||
padding: 5px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
@media all and (min-width: 980px) {
|
|
||||||
body {
|
|
||||||
padding-top: 60px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<!-- }}} -->
|
<!-- }}} -->
|
||||||
|
|
||||||
<!--{{{ active downloads template -->
|
<!--{{{ active downloads template -->
|
||||||
<script type="text/mustache" id="download_active_template">
|
<script type="text/mustache" id="download_active_template">
|
||||||
<div class="row download_item download_active_item" data-gid="{{gid}}" data-settingsName={{sett_name}}>
|
<table class="active-download" data-gid="{{gid}}" data-settingsName={{sett_name}}>
|
||||||
<div class="span2 download_name">
|
<tbody>
|
||||||
<b style="font-size: 12px;" class="tmp_name">{{name}}</b>
|
<tr>
|
||||||
</div>
|
<td data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-overview">
|
||||||
<div class="span6">
|
<b class="download-name">{{name}}</b>
|
||||||
<div class="pull-right">
|
|
||||||
<span class="label label-success">Remaining: <span class="tmp_remaining">{{remaining}}</span></span> |
|
<ul class="stats hidden-phone pull-right">
|
||||||
<span class="label label-success">Progress: <span class="tmp_percentage">{{percentage}}</span>%</span> |
|
<li class="label label-success">Time left: <span class="download-eta">{{eta}}</span></li>
|
||||||
<span class="label label-success">Speed: <span class="tmp_down_speed">{{down_speed}}</span></span> |
|
<li class="label label-success">Download Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
<span class="label label-success">Time left: <span class="tmp_eta">{{eta}}</span></span>
|
<li class="label label-success">Progress: <span class="download-down_speed">{{percentage}}%</span></li>
|
||||||
</div>
|
</ul>
|
||||||
</div>
|
<div class="progress full-progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
|
||||||
<div class="span3">
|
<div class="bar" style="width: {{percentage}}%;"></div>
|
||||||
<div class="button_set">
|
</div>
|
||||||
<button class="btn btn-mini download_pause"><i class="icon-pause"></i>Pause</button>
|
</td>
|
||||||
<button class="btn btn-mini btn-info" data-toggle="collapse" data-target="[data-gid={{gid}}] .more_info" onclick="$(this).button('toggle');"><i class="icon-info-sign"></i> More Info</button>
|
<td class="download-controls">
|
||||||
<button class="btn btn-mini btn-danger download_remove"><i class="icon-remove"></i> Remove</button>
|
<div class="btn-group">
|
||||||
</div>
|
<button class="btn btn-mini download_pause"><i class="icon-pause"></i></button>
|
||||||
</div>
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||||
<br>
|
<span class="caret"></span>
|
||||||
<div class="span11 progress full-progress progress-striped active">
|
</button>
|
||||||
<div class="bar" style="width: {{percentage}}%;"></div>
|
<ul class="dropdown-menu">
|
||||||
</div>
|
|
||||||
<div class="span11 more_info collapse">
|
<li><a href="#" class="download_settings"><i class="icon-cog"></i> Settings</a></li>
|
||||||
<canvas class="span10 progress chunk-canvas" width="1400"></canvas>
|
{{#bittorrent}}
|
||||||
<b class="span2 label active_settings">Status: <span class="tmp_status">{{status}}</span></b>
|
<li><a href="#" class="torrent_info"><i class="icon-list-alt"></i> Peers</a></li>
|
||||||
<b class="span2 label active_settings">GID: <span class="tmp_gid">{{gid}}</span></b>
|
{{/bittorrent}}
|
||||||
<b class="span2 label active_settings">Dir: <span class="tmp_dir">{{dir}}</span></b>
|
<li><a href="#" data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse"><i class="icon-info-sign"></i> More Info</a></li>
|
||||||
<b class="span2 label active_settings">Size: <span class="tmp_size">{{size}}</span></b>
|
<li><a href="#" class="download_remove"><i class="icon-remove"></i> Remove</a></li>
|
||||||
<b class="span2 label active_settings">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></b>
|
</ul>
|
||||||
<b class="span2 label active_settings">Num of Pieces: <span class="tmp_numPieces">{{numPieces}}</span></b>
|
</div>
|
||||||
<b class="span2 label active_settings">Piece Length: <span class="tmp_pieceLength">{{pieceLength}}</span></b>
|
</td>
|
||||||
<b class="span2 label active_settings">ETA: <span class="tmp_eta">{{eta}}</span></b>
|
</tr>
|
||||||
<b class="span2 label active_settings">Down Speed: <span class="tmp_down_speed">{{down_speed}}</span></b>
|
<tr data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-detail">
|
||||||
<b class="span2 label active_settings">Upload Speed: <span class="tmp_upload_speed">{{upload_speed}}</span></b>
|
<td colspan="2">
|
||||||
<b class="span2 label active_settings">Upload Length: <span class="tmp_uploadLength">{{uploadLength}}</span></b>
|
<div class="collapse more_info">
|
||||||
<b class="span2 label active_settings">Connections: <span class="tmp_connections">{{connections}}</span></b>
|
<canvas class="progress chunk-canvas" width="1400" style="width: 100%;"></canvas>
|
||||||
<div class="span12">
|
<ul class="stats">
|
||||||
<h3>Files</h3>
|
<li class="label">Status: <span class="download-status">{{status}}</span></li>
|
||||||
<ul>
|
<li class="label">GID: <span class="download-gid">{{gid}}</span></li>
|
||||||
{{#files}}
|
<li class="label">Dir: <span class="download-dir">{{dir}}</span></li>
|
||||||
<li><b>{{path}} <span class="label">{{size}}</span></b></li>
|
<li class="label">Size: <span class="download-size">{{size}}</span></li>
|
||||||
{{/files}}
|
<li class="label">Downloaded: <span class="download-downloaded">{{downloaded}}</span></li>
|
||||||
</ul>
|
<li class="label">Num of Pieces: <span class="download-numPieces">{{numPieces}}</span></li>
|
||||||
</div>
|
<li class="label">Piece Length: <span class="download-pieceLength">{{pieceLength}}</span></li>
|
||||||
<div class="pull-right" style="margin-right: 5px;">
|
<li class="label">ETA: <span class="download-eta">{{eta}}</span></li>
|
||||||
<button class="btn btn-mini download_settings"><i class="icon-cog"></i> Download Settings for {{sett_name}}</button>{{#bittorrent}}<button class="btn btn-mini torrent_info"><i class="icon-list-alt"></i> Peers</button>{{/bittorrent}}
|
<li class="label">Down Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
</div>
|
<li class="label">Upload Speed: <span class="download-upload_speed">{{upload_speed}}</span></li>
|
||||||
<div class="span11">
|
<li class="label">Upload Length: <span class="download-uploadLength">{{uploadLength}}</span></li>
|
||||||
<div class="active_graph"></div>
|
<li class="label">Connections: <span class="download-connections">{{connections}}</span></li>
|
||||||
</div>
|
</ul>
|
||||||
</div>
|
|
||||||
</div>
|
<h4 class="hidden-phone">Download Files</h4>
|
||||||
|
<ul class="download-files hidden-phone">
|
||||||
|
{{#files}}
|
||||||
|
<li class="label">{{path}} ({{size}})</li>
|
||||||
|
{{/files}}
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div class="active_graph"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
</script>
|
</script>
|
||||||
<!-- active downloads template end }}}-->
|
<!-- active downloads template end }}}-->
|
||||||
|
|
||||||
<!--{{{ waiting downloads template-->
|
<!--{{{ waiting downloads template-->
|
||||||
<script type="text/mustache" id="download_waiting_template">
|
<script type="text/mustache" id="download_waiting_template">
|
||||||
<div class="row download_item download_waiting_item" data-gid="{{gid}}" data-settingsName={{sett_name}}>
|
<table class="waiting-download" data-gid="{{gid}}" data-settingsName={{sett_name}}>
|
||||||
<div class="span2 download_name">
|
<tbody>
|
||||||
<b style="font-size: 12px;" class="tmp_name">{{name}}</b>
|
<tr>
|
||||||
</div>
|
<td data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-overview">
|
||||||
<div class="span6">
|
<b class="download-name">{{name}}</b>
|
||||||
<span class="badge badge-warning">Status: <span class="tmp_status">{{status}}</span></span>
|
|
||||||
<div class="pull-right">
|
<ul class="stats hidden-phone pull-right">
|
||||||
<span class="label label-warning">Size: <span class="tmp_size">{{size}}</span></span> |
|
<li class="label label-success">Size: <span class="download-size">{{size}}</span></li>
|
||||||
<span class="label label-warning">Remaining: <span class="tmp_remaining">{{remaining}}</span></span> |
|
<li class="label label-success">Downloaded: <span class="download-downloaded">{{downloaded}}</span></li>
|
||||||
<span class="label label-warning">Progress: <span class="tmp_percentage">{{percentage}}</span>%</span>
|
<li class="label label-success">Path: <span class="download-dir">{{dir}}</span></li>
|
||||||
</div>
|
</ul>
|
||||||
</div>
|
<div class="progress full-progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
|
||||||
<div class="span3">
|
<div class="bar" style="width: {{percentage}}%;"></div>
|
||||||
<div class="button_set">
|
</div>
|
||||||
<button class="btn btn-mini download_play"><i class="icon-play"></i> Resume</button>
|
</td>
|
||||||
<button class="btn btn-mini btn-info" data-toggle="collapse" data-target="[data-gid={{gid}}] .more_info" onclick="$(this).button('toggle');"><i class="icon-info-sign"></i> More Info</button>
|
<td class="download-controls">
|
||||||
<button class="btn btn-mini btn-danger download_remove"><i class="icon-fire"></i> Purge</button>
|
<div class="btn-group">
|
||||||
</div>
|
<button class="btn btn-mini download_play"><i class="icon-play"></i></button>
|
||||||
</div>
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||||
<br>
|
<span class="caret"></span>
|
||||||
<div class="span11 full-progress progress progress-striped">
|
</button>
|
||||||
<div class="bar" style="width: {{percentage}}%; background-color:#FBB450"></div>
|
<ul class="dropdown-menu">
|
||||||
</div>
|
|
||||||
<div class="span12 more_info collapse">
|
<li><a href="#" class="download_settings"><i class="icon-cog"></i> Settings</a></li>
|
||||||
<b class="span2 label active_settings">Status: <span class="tmp_status">{{status}}</span></b>
|
<li><a href="#" data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse"><i class="icon-info-sign"></i> More Info</a></li>
|
||||||
<b class="span2 label active_settings">GID: <span class="tmp_gid">{{gid}}</span></b>
|
<li><a href="#" class="download_remove"><i class="icon-remove"></i> Remove</a></li>
|
||||||
<b class="span2 label active_settings">Dir: <span class="tmp_dir">{{dir}}</span></b>
|
</ul>
|
||||||
<b class="span2 label active_settings">Size: <span class="tmp_size">{{size}}</span></b>
|
</div>
|
||||||
<b class="span2 label active_settings">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></b>
|
</td>
|
||||||
<b class="span2 label active_settings">Num of Pieces: <span class="tmp_numPieces">{{numPieces}}</span></b>
|
</tr>
|
||||||
<b class="span2 label active_settings">Piece Length: <span class="tmp_pieceLength">{{pieceLength}}</span></b>
|
<tr data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-detail">
|
||||||
<b class="span2 label active_settings">Upload Length: <span class="tmp_uploadLength">{{uploadLength}}</span></b>
|
<td colspan="2">
|
||||||
<div class="pull-right" style="margin-right: 5px;">
|
<div class="collapse more_info">
|
||||||
<button class="btn btn-mini download_settings"><i class="icon-cog"></i> Download Settings for {{sett_name}}</button>
|
<ul class="stats">
|
||||||
</div>
|
<li class="label">Status: <span class="download-status">{{status}}</span></li>
|
||||||
</div>
|
<li class="label">GID: <span class="download-gid">{{gid}}</span></li>
|
||||||
</div>
|
<li class="label">Dir: <span class="download-dir">{{dir}}</span></li>
|
||||||
|
<li class="label">Size: <span class="download-size">{{size}}</span></li>
|
||||||
|
<li class="label">Downloaded: <span class="download-downloaded">{{downloaded}}</span></li>
|
||||||
|
<li class="label">Num of Pieces: <span class="download-numPieces">{{numPieces}}</span></li>
|
||||||
|
<li class="label">Piece Length: <span class="download-pieceLength">{{pieceLength}}</span></li>
|
||||||
|
<li class="label">ETA: <span class="download-eta">{{eta}}</span></li>
|
||||||
|
<li class="label">Down Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
|
<li class="label">Upload Speed: <span class="download-upload_speed">{{upload_speed}}</span></li>
|
||||||
|
<li class="label">Upload Length: <span class="download-uploadLength">{{uploadLength}}</span></li>
|
||||||
|
<li class="label">Connections: <span class="download-connections">{{connections}}</span></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h4 class="hidden-phone">Download Files</h4>
|
||||||
|
<ul class="download-files hidden-phone">
|
||||||
|
{{#files}}
|
||||||
|
<li class="label">{{path}} ({{size}})</li>
|
||||||
|
{{/files}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
</script>
|
</script>
|
||||||
<!-- waiting downloads template end }}}-->
|
<!-- waiting downloads template end }}}-->
|
||||||
|
|
||||||
<!--{{{ stopped downloads template-->
|
<!--{{{ stopped downloads template-->
|
||||||
<script type="text/mustache" id="download_stopped_template">
|
<script type="text/mustache" id="download_stopped_template">
|
||||||
<div class="row download_item download_stopped_item" data-gid="{{gid}}">
|
<table class="stopped-download" data-gid="{{gid}}">
|
||||||
<div class="span2 download_name">
|
<tbody>
|
||||||
<b style="font-size: 12px;" class="tmp_name">{{name}}</b>
|
<tr>
|
||||||
</div>
|
<td data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-overview">
|
||||||
<div class="span6">
|
<b class="download-name">{{name}}</b>
|
||||||
{{#booleans.is_error}}
|
|
||||||
<span class="badge badge-important">Status: <span class="tmp_status">{{status}}</span></span>
|
<ul class="stats hidden-phone pull-right">
|
||||||
<div class="pull-right">
|
<li class="label label-success">Path: <span class="download-dir">{{dir}}</span></li>
|
||||||
<span class="label label-important">Size: <span class="tmp_size">{{size}}</span></span> |
|
</ul>
|
||||||
<span class="label label-important">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></span> |
|
<div class="progress full-progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
|
||||||
<span class="label label-important">Progress: <span class="tmp_percentage">{{percentage}}</span>%</span>
|
<div class="bar" style="width: {{percentage}}%;"></div>
|
||||||
</div>
|
</div>
|
||||||
{{/booleans.is_error}}
|
</td>
|
||||||
{{^booleans.is_error}}
|
<td class="download-controls">
|
||||||
<span class="badge badge-info">Status: <span class="tmp_status">{{status}}</span></span>
|
<div class="btn-group">
|
||||||
<div class="pull-right">
|
<button class="btn btn-mini download_restart"><i class="icon-repeat"></i></button>
|
||||||
<span class="label label-info">Size: <span class="tmp_size">{{size}}</span></span> |
|
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||||
<span class="label label-info">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></span> |
|
<span class="caret"></span>
|
||||||
<span class="label label-info">Progress: <span class="tmp_percentage">{{percentage}}</span>%</span>
|
</button>
|
||||||
</div>
|
<ul class="dropdown-menu">
|
||||||
{{/booleans.is_error}}
|
|
||||||
</div>
|
<li><a href="#" data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse"><i class="icon-info-sign"></i> More Info</a></li>
|
||||||
<div class="span3">
|
<li><a href="#" class="download_remove"><i class="icon-remove"></i> Remove</a></li>
|
||||||
<div class="button_set">
|
</ul>
|
||||||
<button class="btn btn-mini download_restart"><i class="icon-repeat"></i> Restart</button>
|
</div>
|
||||||
<button class="btn btn-mini btn-info" data-toggle="collapse" data-target="[data-gid={{gid}}] .more_info" onclick="$(this).button('toggle');"><i class="icon-info-sign"></i> More Info</button>
|
</td>
|
||||||
<button class="btn btn-mini btn-danger download_remove"><i class="icon-fire"></i> Purge</button>
|
</tr>
|
||||||
</div>
|
<tr data-toggle="collapse" data-target="[data-gid={{gid}}] .download-detail .collapse" class="download-detail">
|
||||||
</div>
|
<td colspan="2">
|
||||||
<br>
|
<div class="collapse more_info">
|
||||||
<div class="span11 full-progress progress progress-striped">
|
<ul class="stats">
|
||||||
{{#booleans.is_error}}
|
<li class="label">Status: <span class="download-status">{{status}}</span></li>
|
||||||
<div class="bar" style="width: {{percentage}}%; background-color:rgb(185, 74, 72)"></div>
|
<li class="label">GID: <span class="download-gid">{{gid}}</span></li>
|
||||||
{{/booleans.is_error}}
|
<li class="label">Dir: <span class="download-dir">{{dir}}</span></li>
|
||||||
{{^booleans.is_error}}
|
<li class="label">Size: <span class="download-size">{{size}}</span></li>
|
||||||
<div class="bar" style="width: {{percentage}}%; background-color:#3A87AD"></div>
|
<li class="label">Downloaded: <span class="download-downloaded">{{downloaded}}</span></li>
|
||||||
{{/booleans.is_error}}
|
<li class="label">Num of Pieces: <span class="download-numPieces">{{numPieces}}</span></li>
|
||||||
</div>
|
<li class="label">Piece Length: <span class="download-pieceLength">{{pieceLength}}</span></li>
|
||||||
<div class="span12 more_info collapse">
|
<li class="label">ETA: <span class="download-eta">{{eta}}</span></li>
|
||||||
<b class="span2 label active_settings">Status: <span class="tmp_status">{{status}}</span></b>
|
<li class="label">Down Speed: <span class="download-down_speed">{{down_speed}}</span></li>
|
||||||
<b class="span2 label active_settings">GID: <span class="tmp_gid">{{gid}}</span></b>
|
<li class="label">Upload Speed: <span class="download-upload_speed">{{upload_speed}}</span></li>
|
||||||
<b class="span2 label active_settings">Dir: <span class="tmp_dir">{{dir}}</span></b>
|
<li class="label">Upload Length: <span class="download-uploadLength">{{uploadLength}}</span></li>
|
||||||
<b class="span2 label active_settings">Size: <span class="tmp_size">{{size}}</span></b>
|
<li class="label">Connections: <span class="download-connections">{{connections}}</span></li>
|
||||||
<b class="span2 label active_settings">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></b>
|
</ul>
|
||||||
<b class="span2 label active_settings">Num of Pieces: <span class="tmp_numPieces">{{numPieces}}</span></b>
|
</div>
|
||||||
<b class="span2 label active_settings">Piece Length: <span class="tmp_pieceLength">{{pieceLength}}</span></b>
|
</td>
|
||||||
<b class="span2 label active_settings">Upload Length: <span class="tmp_uploadLength">{{uploadLength}}</span></b>
|
</tr>
|
||||||
</div>
|
</tbody>
|
||||||
</div>
|
</table>
|
||||||
</script>
|
</script>
|
||||||
<!-- stopped downloads template end }}}-->
|
<!-- stopped downloads template end }}}-->
|
||||||
|
|
||||||
|
|
@ -388,7 +357,7 @@
|
||||||
</script>
|
</script>
|
||||||
<!-- }}} -->
|
<!-- }}} -->
|
||||||
|
|
||||||
<!--{{{ download settings template start -->
|
<!--{{{ download settings template -->
|
||||||
<script type="text/mustache" id="download_settings_template">
|
<script type="text/mustache" id="download_settings_template">
|
||||||
|
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
|
|
@ -456,7 +425,7 @@
|
||||||
<button id="save_download_settings" class="btn btn-success">Save</button>
|
<button id="save_download_settings" class="btn btn-success">Save</button>
|
||||||
</div>
|
</div>
|
||||||
</script>
|
</script>
|
||||||
<!-- download settings template end }}}-->
|
<!-- download settings template }}}-->
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
@ -535,66 +504,6 @@
|
||||||
|
|
||||||
<div role="main" class="container">
|
<div role="main" class="container">
|
||||||
<!-- Download items here -->
|
<!-- Download items here -->
|
||||||
<table class="active-download">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td data-toggle="collapse" data-target=".download-detail .collapse" class="download-overview">
|
|
||||||
<b style="font-size: 12px;" class="tmp_name">Sample</b>
|
|
||||||
|
|
||||||
<ul class="stats pull-right">
|
|
||||||
<li class="label label-success">Time left: <span class="tmp_eta">{{eta}}</span></li>
|
|
||||||
</ul>
|
|
||||||
<div class="progress full-progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
|
|
||||||
<div class="bar" style="width: 100%;"></div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td class="download-controls">
|
|
||||||
<div class="btn-group">
|
|
||||||
<button class="btn btn-mini"><i class="icon-pause"></i></button>
|
|
||||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
|
||||||
<span class="caret"></span>
|
|
||||||
</button>
|
|
||||||
<ul class="dropdown-menu">
|
|
||||||
<li><a href="#">Remove</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr data-toggle="collapse" data-target=".download-detail .collapse" class="download-detail">
|
|
||||||
<td colspan="2">
|
|
||||||
<div class="collapse">
|
|
||||||
<canvas class="progress chunk-canvas" width="1400" class="width: 100%;"></canvas>
|
|
||||||
<ul class="stats">
|
|
||||||
<li class="label">Status: <span class="tmp_status">{{status}}</span></li>
|
|
||||||
<li class="label">GID: <span class="tmp_gid">{{gid}}</span></li>
|
|
||||||
<li class="label">Dir: <span class="tmp_dir">{{dir}}</span></li>
|
|
||||||
<li class="label">Size: <span class="tmp_size">{{size}}</span></li>
|
|
||||||
<li class="label">Downloaded: <span class="tmp_downloaded">{{downloaded}}</span></li>
|
|
||||||
<li class="label">Num of Pieces: <span class="tmp_numPieces">{{numPieces}}</span></li>
|
|
||||||
<li class="label">Piece Length: <span class="tmp_pieceLength">{{pieceLength}}</span></li>
|
|
||||||
<li class="label">ETA: <span class="tmp_eta">{{eta}}</span></li>
|
|
||||||
<li class="label">Down Speed: <span class="tmp_down_speed">{{down_speed}}</span></li>
|
|
||||||
<li class="label">Upload Speed: <span class="tmp_upload_speed">{{upload_speed}}</span></li>
|
|
||||||
<li class="label">Upload Length: <span class="tmp_uploadLength">{{uploadLength}}</span></li>
|
|
||||||
<li class="label">Connections: <span class="tmp_connections">{{connections}}</span></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<h4>Download Files</h4>
|
|
||||||
<ul class="download-files">
|
|
||||||
<li class="label">sample file (200 MB)</li>
|
|
||||||
<li class="label">sample file (200 MB)</li>
|
|
||||||
<li class="label">sample file (200 MB)</li>
|
|
||||||
<li class="label">sample file (200 MB)</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div style="background: black; width: 100%;">
|
|
||||||
<div class="active_graph">h</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div id="active_downloads"></div>
|
<div id="active_downloads"></div>
|
||||||
|
|
||||||
|
|
|
||||||
40
js/ctrls/download.js
Normal file
40
js/ctrls/download.js
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
app.controller('DownloadCtrl', [ '$scope', '$rpc',
|
||||||
|
function(scope, rpc) {
|
||||||
|
rpc.configure({
|
||||||
|
host: 'localhost',
|
||||||
|
port: 6800
|
||||||
|
});
|
||||||
|
|
||||||
|
scope.active = scope.waiting = scope.stopped = [];
|
||||||
|
|
||||||
|
|
||||||
|
rpc.subscribe('tellActive', [], function(data) {
|
||||||
|
scope.$apply(function() {
|
||||||
|
scope.active = data[0];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
rpc.subscribe('tellWaiting', [0, 100], function(data) {
|
||||||
|
scope.$apply(function() {
|
||||||
|
scope.waiting = data[0];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
rpc.subscribe('tellStopped', [0, 100], function(data) {
|
||||||
|
scope.$apply(function() {
|
||||||
|
scope.stopped = data[0];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
scope.getDownloads = function() {
|
||||||
|
var rets = scope.active
|
||||||
|
.concat(scope.waiting).concat(scope.stopped);
|
||||||
|
return rets;
|
||||||
|
}
|
||||||
|
|
||||||
|
scope.normalize = function(d) {
|
||||||
|
return "hello";
|
||||||
|
}
|
||||||
|
|
||||||
|
}]);
|
||||||
3
js/ctrls/modal.js
Normal file
3
js/ctrls/modal.js
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
app.controller('ModalCtrl', ['$scope', function(scope) {
|
||||||
|
|
||||||
|
}]);
|
||||||
4
js/ctrls/nav.js
Normal file
4
js/ctrls/nav.js
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
|
||||||
|
app.controller('NavCtrl', ['$scope', '$name', function(scope, name) {
|
||||||
|
scope.name = name;
|
||||||
|
}]);
|
||||||
3
js/init.js
Normal file
3
js/init.js
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
$(function() {
|
||||||
|
angular.bootstrap(document, ['app'])
|
||||||
|
});
|
||||||
14531
js/libs/angular.js
vendored
Executable file
14531
js/libs/angular.js
vendored
Executable file
File diff suppressed because it is too large
Load Diff
60
js/script.js
60
js/script.js
|
|
@ -398,10 +398,24 @@ function getTemplateCtx(data) {
|
||||||
}
|
}
|
||||||
function updateDownloadTemplates(elem, ctx) {
|
function updateDownloadTemplates(elem, ctx) {
|
||||||
elem = $(elem);
|
elem = $(elem);
|
||||||
|
|
||||||
|
// update spans
|
||||||
for(var i in ctx) {
|
for(var i in ctx) {
|
||||||
elem.find('.tmp_' + i).text(ctx[i]);
|
elem.find('.download-' + i).text(ctx[i]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// update files
|
||||||
|
var html = '';
|
||||||
|
for (var i = 0; i < ctx.files.length; i++) {
|
||||||
|
html += '<li class="label">' + ctx.files[i].path + ' (' + ctx.files[i].size + ')</li>';
|
||||||
|
}
|
||||||
|
elem.find('.download-files').html(html);
|
||||||
|
console.log(html);
|
||||||
|
|
||||||
|
// update progress bar
|
||||||
elem.find('.full-progress .bar').css('width', ctx.percentage + '%');
|
elem.find('.full-progress .bar').css('width', ctx.percentage + '%');
|
||||||
|
|
||||||
|
// update the chunks bar
|
||||||
var chunks = ctx.chunks;
|
var chunks = ctx.chunks;
|
||||||
if (!chunks || !chunks.length) {
|
if (!chunks || !chunks.length) {
|
||||||
return;
|
return;
|
||||||
|
|
@ -457,7 +471,7 @@ function refreshDownloadTemplates(top_elem, data) {
|
||||||
deleteDownloadTemplates($top_elem, data);
|
deleteDownloadTemplates($top_elem, data);
|
||||||
for(var i = 0; i < data.length; i++) {
|
for(var i = 0; i < data.length; i++) {
|
||||||
var ctx = getTemplateCtx(data[i]);
|
var ctx = getTemplateCtx(data[i]);
|
||||||
var elem = $top_elem.find('div.download_item[data-gid=' + ctx.gid + ']');
|
var elem = $top_elem.find('[data-gid=' + ctx.gid + ']');
|
||||||
if(elem.length) {
|
if(elem.length) {
|
||||||
updateDownloadTemplates(elem, ctx);
|
updateDownloadTemplates(elem, ctx);
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -635,9 +649,9 @@ function updateActiveDownloads(data) {
|
||||||
refreshDownloadTemplates('active', data);
|
refreshDownloadTemplates('active', data);
|
||||||
updateGraphData(data);
|
updateGraphData(data);
|
||||||
empty_download_set('#active_downloads');
|
empty_download_set('#active_downloads');
|
||||||
$('.download_active_item .download_settings').unbind('click').click(function() {
|
$('.active-download .download_settings').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_active_item').attr('data-gid');
|
var gid = $(this).parents('.active-download').attr('data-gid');
|
||||||
var settings_name = $(this).parents('.download_active_item').attr('data-settingsName');
|
var settings_name = $(this).parents('.active-download').attr('data-settingsName');
|
||||||
var gen = function(name) {
|
var gen = function(name) {
|
||||||
return { name: name, values: [] };
|
return { name: name, values: [] };
|
||||||
};
|
};
|
||||||
|
|
@ -694,8 +708,8 @@ function updateActiveDownloads(data) {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_active_item .download_pause').unbind('click').click(function() {
|
$('.active-download .download_pause').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_active_item').attr('data-gid');
|
var gid = $(this).parents('.active-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'forcePause',
|
func: 'forcePause',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -708,9 +722,9 @@ function updateActiveDownloads(data) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_active_item .torrent_info').unbind('click').click(function() {
|
$('.active-download .torrent_info').unbind('click').click(function() {
|
||||||
var info_name = $(this).parents('.download_active_item').attr('data-settingsName');
|
var info_name = $(this).parents('.active-download').attr('data-settingsName');
|
||||||
var gid = $(this).parents('.download_active_item').attr('data-gid');
|
var gid = $(this).parents('.active-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'getPeers',
|
func: 'getPeers',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -740,8 +754,8 @@ function updateActiveDownloads(data) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_active_item .download_remove').unbind('click').click(function() {
|
$('.active-download .download_remove').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_active_item').attr('data-gid');
|
var gid = $(this).parents('.active-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'remove',
|
func: 'remove',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -757,9 +771,9 @@ function updateActiveDownloads(data) {
|
||||||
}
|
}
|
||||||
function updateWaitingDownloads(data) {
|
function updateWaitingDownloads(data) {
|
||||||
refreshDownloadTemplates('waiting', data);
|
refreshDownloadTemplates('waiting', data);
|
||||||
$('.download_waiting_item .download_settings').unbind('click').click(function() {
|
$('.waiting-download .download_settings').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_waiting_item').attr('data-gid');
|
var gid = $(this).parents('.waiting-download').attr('data-gid');
|
||||||
var settings_name = $(this).parents('.download_waiting_item').attr('data-settingsName');
|
var settings_name = $(this).parents('.waiting-download').attr('data-settingsName');
|
||||||
var gen = function(name) {
|
var gen = function(name) {
|
||||||
return { name: name, values: [] };
|
return { name: name, values: [] };
|
||||||
};
|
};
|
||||||
|
|
@ -830,8 +844,8 @@ function updateWaitingDownloads(data) {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_waiting_item .download_play').unbind('click').click(function() {
|
$('.waiting-download .download_play').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_waiting_item').attr('data-gid');
|
var gid = $(this).parents('.waiting-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'unpause',
|
func: 'unpause',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -844,8 +858,8 @@ function updateWaitingDownloads(data) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_waiting_item .download_remove').unbind('click').click(function() {
|
$('.waiting-download .download_remove').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_waiting_item').attr('data-gid');
|
var gid = $(this).parents('.waiting-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'remove',
|
func: 'remove',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -862,8 +876,8 @@ function updateWaitingDownloads(data) {
|
||||||
|
|
||||||
function updateStoppedDownloads(data) {
|
function updateStoppedDownloads(data) {
|
||||||
refreshDownloadTemplates('stopped', data);
|
refreshDownloadTemplates('stopped', data);
|
||||||
$('.download_stopped_item .download_remove').unbind('click').click(function() {
|
$('.stopped-download .download_remove').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_stopped_item').attr('data-gid');
|
var gid = $(this).parents('.stopped-download').attr('data-gid');
|
||||||
aria_syscall({
|
aria_syscall({
|
||||||
func: 'removeDownloadResult',
|
func: 'removeDownloadResult',
|
||||||
params: [gid],
|
params: [gid],
|
||||||
|
|
@ -876,8 +890,8 @@ function updateStoppedDownloads(data) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('.download_stopped_item .download_restart').unbind('click').click(function() {
|
$('.stopped-download .download_restart').unbind('click').click(function() {
|
||||||
var gid = $(this).parents('.download_stopped_item').attr('data-gid');
|
var gid = $(this).parents('.stopped-download').attr('data-gid');
|
||||||
var files;
|
var files;
|
||||||
var uris = [];
|
var uris = [];
|
||||||
for(var i = 0; i < d_files.stopped.length; i++) {
|
for(var i = 0; i < d_files.stopped.length; i++) {
|
||||||
|
|
|
||||||
56
js/services/base64.js
Normal file
56
js/services/base64.js
Normal file
|
|
@ -0,0 +1,56 @@
|
||||||
|
app.factory('$base64', [function() {
|
||||||
|
var obj = {};
|
||||||
|
var a64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/',
|
||||||
|
a256 = {
|
||||||
|
indexOf: function (c) {
|
||||||
|
return c.charCodeAt(0);
|
||||||
|
},
|
||||||
|
charAt: String.fromCharCode
|
||||||
|
};
|
||||||
|
|
||||||
|
function code(s, discard, alpha, beta, w1, w2) {
|
||||||
|
s = String(s);
|
||||||
|
var b = 0, x = '', i, c, bs = 1, sb = 1, length = s.length, tmp;
|
||||||
|
for (i = 0; i < length || (!discard && sb > 1); i += 1) {
|
||||||
|
b *= w1;
|
||||||
|
bs *= w1;
|
||||||
|
if (i < length) {
|
||||||
|
c = alpha.indexOf(s.charAt(i));
|
||||||
|
if (c <= -1 || c >= w1) {
|
||||||
|
throw new RangeError();
|
||||||
|
}
|
||||||
|
sb *= w1;
|
||||||
|
b += c;
|
||||||
|
}
|
||||||
|
while (bs >= w2) {
|
||||||
|
bs /= w2;
|
||||||
|
if (sb > 1) {
|
||||||
|
tmp = b;
|
||||||
|
b %= bs;
|
||||||
|
x += beta.charAt((tmp - b) / bs);
|
||||||
|
sb /= w2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return x;
|
||||||
|
}
|
||||||
|
|
||||||
|
obj.btoa = function (s) {
|
||||||
|
s = code(s, false, a256, a64, 256, 64);
|
||||||
|
return s + '===='.slice((s.length % 4) || 4);
|
||||||
|
};
|
||||||
|
|
||||||
|
obj.atob = function (s) {
|
||||||
|
var i;
|
||||||
|
s = String(s).split('=');
|
||||||
|
for (i = s.length - 1; i >= 0; i -= 1) {
|
||||||
|
if (s[i].length % 4 === 1) {
|
||||||
|
throw new RangeError();
|
||||||
|
}
|
||||||
|
s[i] = code(s[i], true, a64, a256, 64, 256);
|
||||||
|
}
|
||||||
|
return s.join('');
|
||||||
|
};
|
||||||
|
|
||||||
|
return obj;
|
||||||
|
}]);
|
||||||
6
js/services/deps.js
Normal file
6
js/services/deps.js
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
app.constant('$name', 'webui-aria2');
|
||||||
|
app.constant('$globalTimeout', 1000);
|
||||||
|
|
||||||
|
app.value('$', $);
|
||||||
|
app.value('$_', _);
|
||||||
|
app.value('$json', JSON);
|
||||||
73
js/services/rpc/jsoncall.js
Normal file
73
js/services/rpc/jsoncall.js
Normal file
|
|
@ -0,0 +1,73 @@
|
||||||
|
app.factory('$jsoncall', ['$', '$json', '$base64', function($, JSON, base64) {
|
||||||
|
return {
|
||||||
|
init: function(conf) {
|
||||||
|
this.avgTimeout = 2000;
|
||||||
|
this.serverConf = conf;
|
||||||
|
},
|
||||||
|
encode: function(obj) {
|
||||||
|
return base64.btoa( JSON.stringify(obj) );
|
||||||
|
},
|
||||||
|
ariaRequest: function(url, funcName, params, success, error) {
|
||||||
|
var startTime = new Date();
|
||||||
|
var conn = this;
|
||||||
|
$.ajax({
|
||||||
|
url: url,
|
||||||
|
timeout: this.avgTimeout,
|
||||||
|
data: {
|
||||||
|
jsonrpc: 2.0,
|
||||||
|
id: 'webui',
|
||||||
|
method: funcName,
|
||||||
|
params: params && params.length ? this.encode(params) : undefined
|
||||||
|
},
|
||||||
|
success: function(data) {
|
||||||
|
conn.avgTimeout = 3 * (new Date() - startTime);
|
||||||
|
return success(data)
|
||||||
|
},
|
||||||
|
error: error,
|
||||||
|
dataType: 'jsonp',
|
||||||
|
jsonp: 'jsoncallback'
|
||||||
|
});
|
||||||
|
},
|
||||||
|
invoke: function(opts) {
|
||||||
|
var rpc = this;
|
||||||
|
var scheme = rpc.serverConf.encryption ? 'https' : 'http';
|
||||||
|
rpc.ariaRequest(
|
||||||
|
scheme + '://' + rpc.serverConf.host + ':' + rpc.serverConf.port + '/jsonrpc',
|
||||||
|
opts.name,
|
||||||
|
opts.params,
|
||||||
|
opts.success,
|
||||||
|
function() {
|
||||||
|
// check if authentication details are given, if yes then use a hack to support
|
||||||
|
// http authentication otherwise emit error
|
||||||
|
if (!rpc.serverConf.auth) {
|
||||||
|
console.log("no user name and still error!!!");
|
||||||
|
return opts.error();
|
||||||
|
}
|
||||||
|
|
||||||
|
var authUrl = scheme + '://' +
|
||||||
|
rpc.serverConf.auth.user + ":" +
|
||||||
|
rpc.serverConf.auth.pass + "@" +
|
||||||
|
rpc.serverConf.host + ':' +
|
||||||
|
rpc.serverConf.port + '/jsonrpc';
|
||||||
|
|
||||||
|
// hack is to basically inject an image with same uri as the aria2 rpc url,
|
||||||
|
// most browsers will then cache the authentication details and we dont have
|
||||||
|
// to give them next time we make a request
|
||||||
|
var img = $('<img/>').attr("src", authUrl);
|
||||||
|
$('body').append(img);
|
||||||
|
img.remove();
|
||||||
|
|
||||||
|
// timeout to let the image load and then make a request,
|
||||||
|
setTimeout(function() {
|
||||||
|
rpc.ariaRequest(
|
||||||
|
authUrl,
|
||||||
|
opts.params,
|
||||||
|
opts.success,
|
||||||
|
opts.error
|
||||||
|
);
|
||||||
|
}, rpc.avgTimeout);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}]);
|
||||||
111
js/services/rpc/rpc.js
Normal file
111
js/services/rpc/rpc.js
Normal file
|
|
@ -0,0 +1,111 @@
|
||||||
|
app.factory('$rpc', ['$syscall', '$globalTimeout', function(syscall, time) {
|
||||||
|
var subscriptions = [],
|
||||||
|
timeout = null,
|
||||||
|
forceNextUpdate = false;
|
||||||
|
|
||||||
|
syscall.init({
|
||||||
|
host: 'localhost',
|
||||||
|
port: 6800
|
||||||
|
});
|
||||||
|
|
||||||
|
// update is implemented such that
|
||||||
|
// only one syscall at max is ongoing
|
||||||
|
// (i.e. serially) so should be private
|
||||||
|
// to maintain that invariant
|
||||||
|
var update = function() {
|
||||||
|
if (!subscriptions.length) return;
|
||||||
|
|
||||||
|
subscriptions = _.filter(subscriptions, function(e) { return !!e });
|
||||||
|
var params = _.map(subscriptions, function(s) {
|
||||||
|
return {
|
||||||
|
methodName: s.name,
|
||||||
|
params: s.params && s.params.length ? s.params : undefined
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
syscall.invoke({
|
||||||
|
name: 'system.multicall',
|
||||||
|
params: [params],
|
||||||
|
success: function(data) {
|
||||||
|
_.each(data.result, function(d, i) {
|
||||||
|
var handle = subscriptions[i];
|
||||||
|
if (handle) {
|
||||||
|
handle.cb(d);
|
||||||
|
if (handle.once) {
|
||||||
|
subscriptions[i] = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (forceNextUpdate) {
|
||||||
|
forceNextUpdate = false;
|
||||||
|
return update();
|
||||||
|
}
|
||||||
|
timeout = setTimeout(update, time);
|
||||||
|
},
|
||||||
|
error: function() {
|
||||||
|
// TODO: implement a retry error handler
|
||||||
|
// which would also look for other suitable
|
||||||
|
// connection configurations for the connection
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
// change the connection configuration,
|
||||||
|
// for all options read rpc/syscall.js
|
||||||
|
configure: function(conf) {
|
||||||
|
syscall.init(conf);
|
||||||
|
},
|
||||||
|
// syscall is done only once
|
||||||
|
once: function(name, params, cb) {
|
||||||
|
subscriptions.push({
|
||||||
|
once: true,
|
||||||
|
name: 'aria2.' + name,
|
||||||
|
params: params,
|
||||||
|
cb: cb
|
||||||
|
});
|
||||||
|
|
||||||
|
this.forceUpdate();
|
||||||
|
},
|
||||||
|
|
||||||
|
// callback is called each time with updated syscall data
|
||||||
|
// after the global timeout
|
||||||
|
subscribe: function(name, params, cb) {
|
||||||
|
var handle = {
|
||||||
|
once: false,
|
||||||
|
name: 'aria2.' + name,
|
||||||
|
params: params,
|
||||||
|
cb: cb
|
||||||
|
};
|
||||||
|
subscriptions.push(handle);
|
||||||
|
|
||||||
|
this.forceUpdate();
|
||||||
|
|
||||||
|
return handle;
|
||||||
|
},
|
||||||
|
|
||||||
|
// remove the subscribed callback by passing
|
||||||
|
// the returned handle bysubscribe
|
||||||
|
unsubscribe: function(handle) {
|
||||||
|
var ind = subscriptions.indexOf(handle);
|
||||||
|
subscriptions[ind] = null;
|
||||||
|
},
|
||||||
|
|
||||||
|
// force the global syscall update
|
||||||
|
forceUpdate: function() {
|
||||||
|
if (timeout) {
|
||||||
|
clearTimeout(timeout);
|
||||||
|
timeout = null;
|
||||||
|
update();
|
||||||
|
}
|
||||||
|
else if (subscriptions.length) {
|
||||||
|
update();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// a batch call is already in progress,
|
||||||
|
// wait till it returns and force the next one
|
||||||
|
forceNextUpdate = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}]);
|
||||||
88
js/services/rpc/sockcall.js
Normal file
88
js/services/rpc/sockcall.js
Normal file
|
|
@ -0,0 +1,88 @@
|
||||||
|
app.factory('$sockcall', ['$_', '$json', '$name', '$utils', function(_, JSON, name, utils) {
|
||||||
|
return {
|
||||||
|
// true when sockrpc is ready to be used,
|
||||||
|
// false when either initializing
|
||||||
|
// or no support for web sockets
|
||||||
|
initialized: false,
|
||||||
|
|
||||||
|
// ongoing connection handles containing connection id and callbacks
|
||||||
|
handles: [],
|
||||||
|
|
||||||
|
// websocket connection socket used for all connections
|
||||||
|
sock: null,
|
||||||
|
|
||||||
|
// connection configuration
|
||||||
|
conf: null,
|
||||||
|
|
||||||
|
// socket connection scheme, default to unencrypted connection
|
||||||
|
scheme: 'ws',
|
||||||
|
|
||||||
|
// called when a connection error occurs
|
||||||
|
onerror: function() {
|
||||||
|
_.each(this.handles, function(h) { h.error() });
|
||||||
|
this.handles = [];
|
||||||
|
},
|
||||||
|
|
||||||
|
// when connection opens
|
||||||
|
onopen: function() {
|
||||||
|
this.initialized = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
// when message is recieved
|
||||||
|
onmessage: function(message) {
|
||||||
|
var data = JSON.parse(message.data);
|
||||||
|
|
||||||
|
// reverse loop because we are deleting elements
|
||||||
|
// while looping over the old items
|
||||||
|
for (var i = this.handles.length - 1; i >= 0; i--) {
|
||||||
|
if (this.handles[i].id === data.id) {
|
||||||
|
this.handles[i].success(data);
|
||||||
|
this.handles.splice(i, 1);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// call to use the rpc
|
||||||
|
invoke: function(opts) {
|
||||||
|
var data = {
|
||||||
|
jsonrpc: 2.0,
|
||||||
|
id: name + '_' + utils.randStr(),
|
||||||
|
method: opts.func,
|
||||||
|
params: opts.params && opts.params.length ? opts.params : undefined
|
||||||
|
};
|
||||||
|
|
||||||
|
if (data.params && !data.params.length) data.params = undefined;
|
||||||
|
|
||||||
|
this.handles.push({
|
||||||
|
success: opts.success || angular.noop,
|
||||||
|
error: opts.error || angular.noop,
|
||||||
|
id: data.id
|
||||||
|
});
|
||||||
|
this.sock.send( JSON.stringify(data) );
|
||||||
|
},
|
||||||
|
|
||||||
|
// should be called initially to start using the sock rpc
|
||||||
|
init: function(conf) {
|
||||||
|
if (typeof WebSocket == "undefined") {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.conf = conf || this.conf;
|
||||||
|
this.initialized = false;
|
||||||
|
|
||||||
|
this.scheme = this.conf.encryption ? 'wss' : 'ws';
|
||||||
|
|
||||||
|
if (this.sock) {
|
||||||
|
this.onopen = this.sock.onmessage = this.sock.onerror = this.sock.onclose = null;
|
||||||
|
this.onerror();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.sock = new WebSocket(this.scheme + '://' + conf.host + ':' + conf.port + '/jsonrpc');
|
||||||
|
this.sock.onopen = this.onopen;
|
||||||
|
this.sock.onclose = this.sock.onerror = this.onerror;
|
||||||
|
this.sock.onmessage = this.onmessage;
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}]);
|
||||||
|
|
||||||
43
js/services/rpc/syscall.js
Normal file
43
js/services/rpc/syscall.js
Normal file
|
|
@ -0,0 +1,43 @@
|
||||||
|
app.factory('$syscall', ['$log', '$jsoncall', '$sockcall', function(log, jsonRPC, sockRPC) {
|
||||||
|
return {
|
||||||
|
// called to initialize the rpc interface, call everytime configuration changes
|
||||||
|
// conf has the following structure:
|
||||||
|
// {
|
||||||
|
// host (string): host for the aria2 server
|
||||||
|
// port (number): port number for the aria2 server
|
||||||
|
// encryption (boolean, optional): true if encryption is enabled in the aria2 server
|
||||||
|
// auth (optional): {
|
||||||
|
// user (string): username for http authentication if enabled
|
||||||
|
// pass (string): password for the http authentication if enabled
|
||||||
|
// }
|
||||||
|
init: function(conf) {
|
||||||
|
conf = conf || {
|
||||||
|
host: 'localhost',
|
||||||
|
port: 6800
|
||||||
|
};
|
||||||
|
conf.encryption = conf.encryption || false;
|
||||||
|
|
||||||
|
jsonRPC.init(conf);
|
||||||
|
sockRPC.init(conf);
|
||||||
|
},
|
||||||
|
|
||||||
|
// call this to start an rpc call, opts has the following structure:
|
||||||
|
// {
|
||||||
|
// name (string): name of the actual aria2 syscall
|
||||||
|
// success (function): callback called with (parsed) data if rpc is successfull
|
||||||
|
// error (function): callback called when an error occurs
|
||||||
|
// params (array, optional): the params for some syscall (like multicall) and is optional for others
|
||||||
|
// }
|
||||||
|
invoke: function(opts) {
|
||||||
|
opts.success = opts.success || angular.noop;
|
||||||
|
opts.error = opts.error || angular.noop;
|
||||||
|
|
||||||
|
if (sockRPC.initialized)
|
||||||
|
return sockRPC.invoke(opts);
|
||||||
|
else
|
||||||
|
return jsonRPC.invoke(opts);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}]);
|
||||||
|
|
||||||
|
|
||||||
20
js/services/utils.js
Normal file
20
js/services/utils.js
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
app.factory('$utils', function() {
|
||||||
|
return {
|
||||||
|
randStr: function() {
|
||||||
|
var str = [];
|
||||||
|
var hexDigits = "0123456789abcdef";
|
||||||
|
for (var i = 0; i < 36; i++) {
|
||||||
|
str[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
|
||||||
|
}
|
||||||
|
return str.join("");
|
||||||
|
},
|
||||||
|
mixin: function(fromObj, toObj) {
|
||||||
|
for (var key in toObj) {
|
||||||
|
if (toObj.hasOwnProperty(key) && fromObj[key]) {
|
||||||
|
toObj[key] = fromObj[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return toObj;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
Loading…
Reference in New Issue
Block a user