mirror of
https://gitee.com/kennylee/docker.git
synced 2024-12-02 03:48:15 +08:00
1317 lines
57 KiB
HTML
1317 lines
57 KiB
HTML
<!doctype html>
|
|
<html>
|
|
|
|
<!-- {{{ head -->
|
|
<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">
|
|
<meta name="theme-color" content="#0A8476">
|
|
|
|
<title ng-bind="$root.pageTitle">Aria2 WebUI</title>
|
|
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="css/font-awesome.min.css">
|
|
<link rel="stylesheet" href="css/flag-icon.min.css">
|
|
|
|
<link rel="stylesheet" href="css/style.css">
|
|
<link rel="stylesheet" href="css/download.css">
|
|
<link rel="stylesheet" href="css/modals.css">
|
|
|
|
<!-- external javascript dependencies -->
|
|
<script src="js/libs/jquery-2.2.4.min.js"></script>
|
|
<script src="js/libs/lodash-4.17.3.min.js"></script>
|
|
|
|
<script src="js/libs/angular.min.js"></script>
|
|
|
|
<script src="js/libs/angularui-bootstrap-tpls.min.js"></script>
|
|
<script src="js/libs/bootstrap-filestyle.js"></script>
|
|
|
|
<script src="js/libs/jquery.flot.min.js"></script>
|
|
<script src="js/libs/jquery.flot.time.min.js"></script>
|
|
|
|
<!-- We do manual resize currently
|
|
<script src="js/libs/jquery.flot.resize.js"></script>
|
|
-->
|
|
|
|
<!-- webui core -->
|
|
<script src="js/init.js"></script>
|
|
<script src="configuration.js"></script>
|
|
|
|
<script src="js/directives/chunkbar.js"></script>
|
|
<script src="js/directives/dgraph.js"></script>
|
|
<script src="js/directives/fileselect.js"></script>
|
|
<script src="js/directives/fselect.js"></script>
|
|
<script src="js/directives/textarea.js"></script>
|
|
|
|
<script src="js/filters/bytes.js"></script>
|
|
<script src="js/filters/url.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/modals.js"></script>
|
|
<script src="js/services/alerts.js"></script>
|
|
|
|
<script src="js/services/errors.js"></script>
|
|
|
|
<script src="js/services/settings/settings.js"></script>
|
|
<script src="js/services/settings/filters.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/services/rpc/helpers.js"></script>
|
|
|
|
<script src="js/ctrls/main.js"></script>
|
|
<script src="js/ctrls/modal.js"></script>
|
|
<script src="js/ctrls/nav.js"></script>
|
|
<script src="js/ctrls/alert.js"></script>
|
|
<script src="js/ctrls/props.js"></script>
|
|
|
|
<!-- translate -->
|
|
<script src="js/libs/angular-translate.min.js"></script>
|
|
<script src="js/translate/nl_NL.js"></script>
|
|
<script src="js/translate/en_US.js"></script>
|
|
<script src="js/translate/th_TH.js"></script>
|
|
<script src="js/translate/zh_CN.js"></script>
|
|
<script src="js/translate/zh_TW.js"></script>
|
|
<script src="js/translate/pl_PL.js"></script>
|
|
<script src="js/translate/fr_FR.js"></script>
|
|
<script src="js/translate/de_DE.js"></script>
|
|
<script src="js/translate/es_ES.js"></script>
|
|
<script src="js/translate/ru_RU.js"></script>
|
|
<script src="js/translate/it_IT.js"></script>
|
|
<script src="js/translate/tr_TR.js"></script>
|
|
<script src="js/translate/cs_CZ.js"></script>
|
|
<script src="js/translate/fa_IR.js"></script>
|
|
<script src="js/translate/id_ID.js"></script>
|
|
</head>
|
|
<!-- }}} -->
|
|
|
|
<body ng-controller="MainCtrl" ng-cloak>
|
|
|
|
<!-- {{{ header -->
|
|
<div class="navbar main-navbar navbar-static-top" ng-controller="NavCtrl">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle collapsed" ng-click="collapsed = !collapsed">
|
|
<span class="sr-only">{{ 'Toggle navigation' | translate }}</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a class="navbar-brand"><span class="fa fa-fw fa-arrow-circle-down"></span> {{ name }}</a>
|
|
</div>
|
|
|
|
<form class="navbar-form navbar-right" role="search">
|
|
<div class="form-group">
|
|
<input class="form-control" type="text" placeholder="{{ 'Search' | translate }}" ng-model="downloadFilter" autocomplete="off" ng-change="onDownloadFilter()" />
|
|
</div>
|
|
</form>
|
|
|
|
<!-- {{{ Nav menu -->
|
|
<div class="collapse navbar-collapse" collapse="collapsed">
|
|
<ul class="nav navbar-nav">
|
|
<li class="dropdown" dropdown>
|
|
<a class="dropdown-toggle" href="#" dropdown-toggle>
|
|
{{ 'Add' | translate }} <span class="caret"></span>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a href="#" ng-click="addUris()">
|
|
<span class="fa fa-fw fa-link"> </span> {{ 'By URIs' | translate }}
|
|
</a>
|
|
</li>
|
|
<li ng-show="isFeatureEnabled('BitTorrent') && enable.torrent">
|
|
<a href="#" ng-click="addTorrents()">
|
|
<span class="fa fa-fw fa-cloud-download"> </span> {{ 'By Torrents' | translate }}
|
|
</a>
|
|
</li>
|
|
<li ng-show="isFeatureEnabled('Metalink') && enable.metalink">
|
|
<a href="#" ng-click="addMetalinks()">
|
|
<span class="fa fa-fw fa-file-text-o"> </span> {{ 'By Metalinks' | translate }}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="dropdown" dropdown>
|
|
<a class="dropdown-toggle" href="#" dropdown-toggle> {{ 'Manage' | translate }} <span class="caret"></span></a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a
|
|
href="#"
|
|
ng-click="forcePauseAll()"><span class="fa fa-fw fa-pause"> </span> {{ 'Pause All' | translate }}</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="#"
|
|
ng-click="unpauseAll()"><span class="fa fa-fw fa-play"> </span> {{ 'Resume Paused' | translate }}</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="#"
|
|
ng-click="purgeDownloadResult()"><span class="fa fa-fw fa-times-circle"> </span> {{ 'Purge Completed' | translate }}</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="#"
|
|
ng-click="shutDownServer()"><span class="fa fa-fw fa-power-off"> </span> {{ 'Shutdown Server' | translate }}</a>
|
|
</li>
|
|
<!-- not adding remove all as requires many rpc syscalls to finish
|
|
<li>
|
|
<a
|
|
href="#"
|
|
ng-click="removeAll()"><span class="fa fa-fw fa-fire"> </span> Remove All</a>
|
|
</li>
|
|
-->
|
|
</ul>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
<ul class="nav navbar-nav">
|
|
<li class="dropdown" dropdown>
|
|
<a
|
|
href="#"
|
|
class="dropdown-toggle" dropdown-toggle>{{ 'Settings' | translate }} <span class="caret"></span></a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a
|
|
ng-click="changeCSettings()"
|
|
href="#"><span class="fa fa-fw fa-cog"> </span> {{ 'Connection Settings' | translate }}</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a
|
|
ng-click="changeGSettings()"
|
|
href="#"><span class="fa fa-fw fa-cogs"> </span> {{ 'Global Settings' | translate }}</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a
|
|
ng-click="showServerInfo()"
|
|
href="#"><span class="fa fa-fw fa-info-circle"> </span> {{ 'Server info' | translate }}</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a
|
|
ng-click="showAbout()"
|
|
href="#"><span class="fa fa-fw fa-question-circle"> </span> {{ 'About and contribute' | translate }}</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
|
|
<ul class="nav navbar-nav pull-right" ng-show="false">
|
|
<li class="dropdown" dropdown>
|
|
<a
|
|
class="dropdown-toggle" dropdown-toggle
|
|
href="#">{{ 'Miscellaneous' | translate }} <span class="caret"></span></a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a href="#"><span class="fa fa-fw fa-list-alt"> </span> {{ 'Global Statistics' | translate }}</a>
|
|
</li>
|
|
<li>
|
|
<a href="#"><span class="fa fa-fw fa-info-circle"> </span> {{ 'About' | translate }}</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
|
|
|
|
<ul class="nav navbar-nav">
|
|
<li class="dropdown" dropdown>
|
|
<a
|
|
href="#"
|
|
class="dropdown-toggle" dropdown-toggle>{{ 'Language' | translate }} <span class="caret"></span></a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('en_US')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-us"> </span> English</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('th_TH')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-th"> </span> ไทย</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('nl_NL')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-nl"> </span> Nederlands</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('zh_CN')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-cn"> </span> 简体中文</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('zh_TW')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-tw"> </span> 繁體中文</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('pl_PL')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-pl"> </span> Polish</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('fr_FR')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-fr"> </span> Français</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('de_DE')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-de"> </span> Deutsch</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('es_ES')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-es"> </span> Español</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('ru_RU')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-ru"> </span> Русский</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('it_IT')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-it"> </span> Italiano</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('tr_TR')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-tr"> </span> Turkish</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('cs_CZ')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-cz"> </span> Czech</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('fa_IR')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-ir"> </span> Farsi</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
ng-click="changeLanguage('id_ID')"
|
|
href="#"><span class="fa fa-fw flag-icon flag-icon-id"> </span> Indonesian</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
</div><!--/.nav-collapse -->
|
|
</div>
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ body -->
|
|
<div role="main" class="container-fluid">
|
|
|
|
<!-- {{{ alerts -->
|
|
<div ng-controller="AlertCtrl" class="row-fluid alerts">
|
|
<div class="alert alert-{{alert.type == 'error' ? 'danger' : alert.type}}" ng-repeat="alert in pendingAlerts">
|
|
<button type="button" class="close" ng-click="removeAlert($index)">x</button>
|
|
<span ng-bind-html="alert.msg"></span>
|
|
</div>
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
<div class="row-fluid">
|
|
<div ng-class="{'col-md-3': enable.sidebar.show}" ng-show="enable.sidebar.show">
|
|
<!-- {{{ nav side bar -->
|
|
<div class="sidebar-nav">
|
|
|
|
<!-- {{{ global statistics -->
|
|
<ul class="nav nav-list" ng-if="enable.sidebar.stats">
|
|
<li class="nav-header" ng-show="totalAria2Downloads()">{{ 'Global Statistics' | translate }}</li>
|
|
<li>
|
|
<div
|
|
id="global-graph"
|
|
yticks="3"
|
|
xticks="1"
|
|
dspeed="gstats.downloadSpeed"
|
|
uspeed="gstats.uploadSpeed"
|
|
dgraph ng-show="totalAria2Downloads()"
|
|
nolabel="true"
|
|
draw="true">
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<span title="Upload Speed"><span class="fa fa-fw fa-arrow-circle-o-up"> </span>{{gstats.uploadSpeed | bspeed}}</span><br />
|
|
<span title="Download Speed"><span class="fa fa-fw fa-arrow-circle-o-down"> </span>{{gstats.downloadSpeed | bspeed}}</span>
|
|
</li>
|
|
</ul>
|
|
<!-- }}} -->
|
|
|
|
<br />
|
|
|
|
<!-- {{{ download filters -->
|
|
<ul id="filters" class="clearfix nav nav-list" ng-show="enable.sidebar.filters">
|
|
<li class="nav-header">{{ 'Download Filters' | translate }}</li>
|
|
<li class="checkbox">
|
|
<label for="filter-speed">
|
|
<input type="checkbox" ng-model="filterSpeed" ng-change="persistFilters()" id="filter-speed">
|
|
{{ 'Running' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="active checkbox">
|
|
<label for="filter-active">
|
|
<input type="checkbox" ng-model="filterActive" ng-change="persistFilters()" id="filter-active">
|
|
{{ 'Active' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label for="filter-waiting">
|
|
<input type="checkbox" ng-model="filterWaiting" ng-change="persistFilters()" id="filter-waiting">
|
|
{{ 'Waiting' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label for="filter-complete">
|
|
<input type="checkbox" ng-model="filterComplete" ng-change="persistFilters()" id="filter-complete">
|
|
{{ 'Complete' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label for="filter-error">
|
|
<input type="checkbox" ng-model="filterError" ng-change="persistFilters()" id="filter-error">
|
|
{{ 'Error' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label for="filter-paused">
|
|
<input type="checkbox" ng-model="filterPaused" ng-change="persistFilters()" id="filter-paused">
|
|
{{ 'Paused' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label for="filter-removed">
|
|
<input type="checkbox" ng-model="filterRemoved" ng-change="persistFilters()" id="filter-removed">
|
|
{{ 'Removed' | translate }}
|
|
</label>
|
|
</li>
|
|
<li class="checkbox">
|
|
<label>
|
|
<input type="checkbox" ng-model="hideLinkedMetadata" id="hide-linked-metadata">
|
|
{{ 'Hide linked meta-data' | translate }}
|
|
</label>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
{{ 'Displaying' | translate }} <strong>{{totalDownloads}}</strong> {{ 'of' | translate }} <em>{{totalAria2Downloads()}} </em> {{ 'downloads' | translate }}
|
|
</p>
|
|
<p>
|
|
<button ng-click="toggleStateFilters()" class="btn btn-default btn-xs">{{ 'Toggle' | translate }}</button>
|
|
<button ng-click="resetFilters()" class="btn btn-default btn-xs">{{ 'Reset filters' | translate }}</button>
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
<!-- }}} -->
|
|
|
|
<br />
|
|
|
|
|
|
<!-- {{{ starred properties -->
|
|
<ul class="clearfix nav nav-list" ng-controller="StarredPropsCtrl" ng-show="properties.length && enable.sidebar.starredProps">
|
|
<li class="nav-header">{{ 'Quick Access Settings' | translate }}</li>
|
|
<li ng-repeat="prop in properties" class="form-group">
|
|
<label title="{{prop.desc}}" style="width: 100%;">{{prop.name}}</label>
|
|
<div class="form-group">
|
|
<select style="width: 100%;" ng-show="prop.options.length && !prop.multiline" class="form-control" ng-options="opt for opt in prop.options" ng-model="prop.val"></select>
|
|
<input style="width: 100%;" ng-show="!prop.options.length && !prop.multiline" type="text" class="form-control input-large" ng-model="prop.val"/>
|
|
<textarea style="width: 100%;" ng-show="prop.multiline" ng-model="prop.val"></textarea>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<button ng-disabled="!enabled()" ng-click="save()" class="btn btn-default btn-sm">{{ 'Save settings' | translate }}</button>
|
|
</li>
|
|
</ul>
|
|
<!-- }}} -->
|
|
|
|
|
|
</div>
|
|
<!-- }}} -->
|
|
</div>
|
|
|
|
<div ng-class="{'col-md-9': enable.sidebar.show, 'col-md-12': !enable.sidebar.show }">
|
|
<!-- {{{ downloads -->
|
|
<!-- Bug?? <div ng-show="!totalAria2Downloads() && totalAria2Downloads() > getDownloads()" class="hero-unit">-->
|
|
<div ng-show="!totalAria2Downloads()" class="jumbotron">
|
|
{{ 'Currently no download in line to display, use the' | translate }} <strong>{{ 'Add' | translate }}</strong> {{ 'download button to start downloading files!' | translate }}
|
|
</div>
|
|
|
|
|
|
<!-- {{{ download template -->
|
|
|
|
<div
|
|
ng-repeat="download in getDownloads()"
|
|
class="row-fluid download" data-gid="{{download.gid}}"
|
|
ng-click="toggleCollapsed(download)">
|
|
<div class="download-name download-item download-controls clearfix">
|
|
<!-- {{{ download control buttons -->
|
|
<div class="btn-group" role="group" ng-click="$event.stopPropagation()">
|
|
<button
|
|
ng-if="hasStatus(download, ['active', 'waiting'])"
|
|
class="btn btn-default"
|
|
ng-click="pause(download)">
|
|
<span class="fa fa-fw fa-pause"></span>
|
|
</button>
|
|
|
|
<button
|
|
ng-if="hasStatus(download, 'paused')"
|
|
class="btn btn-default"
|
|
ng-click="resume(download)">
|
|
<span class="fa fa-fw fa-play"></span>
|
|
</button>
|
|
|
|
<button
|
|
ng-if="canRestart(download)"
|
|
class="btn btn-default"
|
|
ng-click="restart(download)">
|
|
<span class="fa fa-fw fa-repeat"></span>
|
|
</button>
|
|
|
|
<button
|
|
class="btn btn-default hidden-phone"
|
|
ng-click="remove(download)">
|
|
<span class="fa fa-fw fa-stop"></span>
|
|
</button>
|
|
|
|
<button
|
|
ng-if="hasStatus(download, 'paused')"
|
|
class="btn btn-default"
|
|
ng-click="selectFiles(download)">
|
|
<span class="fa fa-fw fa-list"></span>
|
|
</button>
|
|
|
|
<button
|
|
class="btn btn-default hidden-phone"
|
|
ng-if="['waiting', 'active'].indexOf( getType(download) )!= -1"
|
|
ng-click="showSettings(download)">
|
|
<span class="fa fa-fw fa-cog"></span>
|
|
</button>
|
|
<button
|
|
ng-if="hasStatus(download, 'waiting')"
|
|
class="btn btn-default hidden-phone"
|
|
ng-click="moveDown(download)">
|
|
<span class="fa fa-fw fa-arrow-circle-o-down"></span>
|
|
</button>
|
|
<button
|
|
ng-if="hasStatus(download, 'waiting')"
|
|
class="btn btn-default hidden-phone"
|
|
ng-click="moveUp(download)">
|
|
<span class="fa fa-fw fa-arrow-circle-o-up"></span>
|
|
</button>
|
|
<div class="btn-group" dropdown>
|
|
<button class="btn btn-default dropdown-toggle" dropdown-toggle>
|
|
<span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu pull-right">
|
|
|
|
<li class="visible-phone">
|
|
<a
|
|
ng-click="showSettings(download)"
|
|
ng-show="['waiting', 'active'].indexOf( getType(download) )!= -1"
|
|
href="#"><span class="fa fa-fw fa-cog"> </span> {{ 'Settings' | translate }}</a>
|
|
</li>
|
|
|
|
<li ng-show="download.bittorrent && false">
|
|
<a href="#"><span class="fa fa-fw fa-list-alt"> </span> {{ 'Peers' | translate }}</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a ng-click="toggleCollapsed(download)"
|
|
href="#"><span class="fa fa-fw fa-info-circle"> </span> {{ 'More Info' | translate }}</a>
|
|
</li>
|
|
|
|
<li class="visible-phone">
|
|
<a ng-click="remove(download)"
|
|
href="#"><span class="fa fa-fw fa-times"> </span> {{ 'Remove' | translate }}</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
<div class="title">
|
|
<span class="fa fa-fw fa-magnet" style="color: red;" ng-show="download.metadata"></span>
|
|
{{download.name}}
|
|
</div>
|
|
</div>
|
|
<div class="download-overview download-item clearfix" ng-switch="download.status">
|
|
<!-- {{{ statistics -->
|
|
<ul class="stats pull-left" ng-switch-when="active">
|
|
<!-- {{{ active download statistics -->
|
|
<li class="label label-active hidden-phone hidden-tablet">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-play"> </span> {{ 'Active' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-default" ng-class="{'label-active': download.downloadSpeed > 2048, 'label-warning': download.downloadSpeed <= 2048}">
|
|
<span title="{{ 'Download Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.downloadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li ng-show="download.bittorrent" class="label label-default hidden-phone" ng-class="{'label-info': download.uploadSpeed > 2048}">
|
|
<span title="{{ 'Upload Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-up"> </span> {{download.uploadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active">
|
|
<span title="{{ 'Estimated time' | translate }}"><span class="fa fa-fw fa-clock-o"> </span> {{getEta(download) | time}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Downloaded' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.fmtCompletedLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Uploaded' | translate }}"><span class="fa fa-fw fa-upload"> </span> {{download.fmtUploadLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Ratio' | translate }}">{{ 'Ratio' | translate }} {{getRatio(download)}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone hidden-tablet">
|
|
<span title="{{ 'Progress' | translate }}"><span class="fa fa-fw fa-chevron-right"> </span> {{getProgress(download)}}%</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="verifing">
|
|
<!-- {{{ active download statistics -->
|
|
<li class="label label-warning hidden-phone hidden-tablet">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-play"> </span> {{ 'Verifing' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-default" ng-class="{'label-active': download.downloadSpeed > 2048, 'label-warning': download.downloadSpeed <= 2048}">
|
|
<span title="{{ 'Download Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.downloadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li ng-show="download.bittorrent" class="label label-default hidden-phone" ng-class="{'label-info': download.uploadSpeed > 2048}">
|
|
<span title="{{ 'Upload Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-up"> </span> {{download.uploadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active">
|
|
<span title="{{ 'Estimated time' | translate }}"><span class="fa fa-fw fa-clock-o"> </span> {{getEta(download) | time}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Downloaded' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.fmtCompletedLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone hidden-tablet">
|
|
<span title="{{ 'Progress' | translate }}"><span class="fa fa-fw fa-chevron-right"> </span> {{getProgress(download)}}%</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="verifyPending">
|
|
<!-- {{{ active download statistics -->
|
|
<li class="label label-warning hidden-phone hidden-tablet">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-play"> </span> {{ 'Verify Pending' | translate}}</span>
|
|
</li>
|
|
|
|
<li class="label label-default" ng-class="{'label-active': download.downloadSpeed > 2048, 'label-warning': download.downloadSpeed <= 2048}">
|
|
<span title="{{ 'Download Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.downloadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li ng-show="download.bittorrent" class="label label-default hidden-phone" ng-class="{'label-info': download.uploadSpeed > 2048}">
|
|
<span title="{{ 'Upload Speed' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-up"> </span> {{download.uploadSpeed | bspeed}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active">
|
|
<span title="{{ 'Estimated time' | translate }}"><span class="fa fa-fw fa-clock-o"> </span> {{getEta(download) | time}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Downloaded' | translate }}"><span class="fa fa-fw fa-arrow-circle-o-down"> </span> {{download.fmtCompletedLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone hidden-tablet">
|
|
<span title="{{ 'Progress' | translate }}"><span class="fa fa-fw fa-chevron-right"> </span> {{getProgress(download)}}%</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="paused">
|
|
<!-- {{{ paused download statistics -->
|
|
<li class="label label-info">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-pause"> </span> {{ 'Paused' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-info">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-info hidden-phone">
|
|
<span title="{{ 'Downloaded' | translate }}"><span class="fa fa-fw fa-download"> </span> {{download.fmtCompletedLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-info hidden-phone">
|
|
<span title="{{ 'Download Path' | translate }}"><span class="fa fa-fw fa-folder-open"> </span> {{download.dir}}</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="waiting">
|
|
<!-- {{{ paused download statistics -->
|
|
<li class="label label-default">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-caret-right"> </span> {{ 'Waiting' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-default">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-default hidden-phone">
|
|
<span title="{{ 'Downloaded' | translate }}"><span class="fa fa-fw fa-download"> </span> {{download.fmtCompletedLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-default hidden-phone">
|
|
<span title="{{ 'Download Path' | translate }}"><span class="fa fa-fw fa-folder-open"> </span> {{download.dir}}</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="complete">
|
|
<!-- {{{ complete download statistics -->
|
|
|
|
<li class="label label-success">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-check-square-o"> </span> {{ 'Complete' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-success">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Uploaded' | translate }}"><span class="fa fa-fw fa-upload"> </span> {{download.fmtUploadLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-active hidden-phone">
|
|
<span title="{{ 'Ratio' | translate }}">{{ 'Ratio' | translate }} {{getRatio(download)}}</span>
|
|
</li>
|
|
|
|
<li class="label label-success hidden-phone">
|
|
<span title="{{ 'Download Path' | translate }}"><span class="fa fa-fw fa-folder-open"> </span> {{download.dir}}</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="removed">
|
|
<!-- {{{ removed download statistics -->
|
|
<li class="label label-warning">
|
|
<span title="{{ 'Download status' | translate }}"><span class="fa fa-fw fa-times"> </span> {{ 'Removed' | translate }}</span>
|
|
</li>
|
|
|
|
<li class="label label-warning">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-warning hidden-phone">
|
|
<span title="{{ 'Download Path' | translate }}"><span class="fa fa-fw fa-folder-open"> </span> {{download.dir}}</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<ul class="stats pull-left" ng-switch-when="error">
|
|
|
|
<!-- {{{ error download statistics -->
|
|
<li class="label label-danger">
|
|
<span title="{{ 'Error ' | translate }}"><span class="fa fa-fw fa-times-circle"> </span> {{getErrorStatus(download.errorCode)}}</span>
|
|
</li>
|
|
|
|
<li class="label label-default">
|
|
<span title="{{ 'Download Size' | translate }}"><span class="fa fa-fw fa-cloud-download"> </span> {{download.fmtTotalLength}}</span>
|
|
</li>
|
|
|
|
<li class="label label-default hidden-phone">
|
|
<span title="{{ 'Download Path' | translate }}"><span class="fa fa-fw fa-folder-open"> </span> {{download.dir}}</span>
|
|
</li>
|
|
|
|
<!-- }}} -->
|
|
</ul>
|
|
|
|
<!-- }}} -->
|
|
</div>
|
|
<div class="download-progress download-item">
|
|
<div class="progress">
|
|
<div ng-class="'progress-bar progress-bar-striped ' + getProgressClass(download)" style="width: {{getProgress(download)}}%;"></div>
|
|
</div>
|
|
</div>
|
|
<div ng-switch="download.collapsed">
|
|
<div ng-switch-when="false" collapse="download.animCollapsed">
|
|
<div class="download-item" ng-show="download.numPieces > 1">
|
|
<canvas bitfield="download.bitfield" draw="!download.collapsed" pieces="download.numPieces" class="progress chunk-canvas" width="1400" chunkbar></canvas>
|
|
</div>
|
|
<ul class="stats download-item">
|
|
<li class="label label-default" title="{{ 'Estimated time' | translate }}"><i class="fa fa-fw fa-clock-o"> </i> <span class="download-eta">{{getEta(download) | time}}</span></li>
|
|
<li class="label label-default" title="{{ 'Download Size' | translate }}"><i class="fa fa-fw fa-cloud-download"> </i> <span class="download-totalLength">{{download.fmtTotalLength}}</span></li>
|
|
<li class="label label-default" title="{{ 'Downloaded' | translate }}"><i class="fa fa-fw fa-download"> </i> <span class="download-completedLength">{{download.fmtCompletedLength}}</span></li>
|
|
<li class="label label-default" title="{{ 'Download Speed' | translate }}"><i class="fa fa-fw fa-arrow-circle-o-down"> </i> <span class="download-downloadSpeed">{{download.fmtDownloadSpeed}}</span></li>
|
|
|
|
<li class="label label-default" title="{{ 'Upload Speed' | translate }}" ng-show="download.bittorrent"><i class="fa fa-fw fa-arrow-circle-o-up"> </i> <span class="download-uploadSpeed">{{download.fmtUploadSpeed}}</span></li>
|
|
<li class="label label-default" title="{{ 'Uploaded' | translate }}" ng-show="download.bittorrent"><i class="fa fa-fw fa-upload"> </i> <span class="download-uploadLength">{{download.fmtUploadLength}}</span></li>
|
|
<li class="label label-default" title="{{ 'Ratio' | translate }}" ng-show="download.bittorrent"><span title="{{ 'Ratio' | translate }}">{{ 'Ratio' | translate }} {{getRatio(download)}}</span></li>
|
|
|
|
<li class="label label-default" title={{download.connectionsTitle}}><i class="fa fa-fw fa-link"> </i> <span class="download-connections">{{download.connections}}{{download.numSeeders}}</span></li>
|
|
|
|
<li class="label label-default" title="{{ 'Download GID' | translate }}"><i class="fa fa-fw fa-bars"> </i> <span class="download-gid">{{download.gid}}</span></li>
|
|
<li class="label label-default" title="{{ 'Number of Pieces' | translate }}">{{ '# of' | translate }} <i class="fa fa-fw fa-puzzle-piece"> </i> <span class="download-numPieces">{{download.numPieces}}</span></li>
|
|
<li class="label label-default" title="{{ 'Piece Length' | translate }}"><i class="fa fa-fw fa-puzzle-piece"></i> {{ 'Length' | translate }} <span class="download-pieceLength">{{download.fmtPieceLength}}</span></li>
|
|
<li class="label label-default" title="{{ 'Download Path' | translate }}"><i class="fa fa-fw fa-folder-open"> </i> <span class="download-dir">{{download.dir}}</span></li>
|
|
</ul>
|
|
<ul class="download-files hidden-phone download-item">
|
|
<li class="label label-default" ng-repeat="file in download.files" ng-class="{'label-success': file.selected}">
|
|
<a ng-if="hasDirectURL()" ng-click="$event.stopPropagation()" ng-href="{{getDirectURL()}}{{file.relpath | encodeURI}}" target="download">{{file.relpath}} ({{file.fmtLength}})</a>
|
|
<span ng-if="!hasDirectURL()">{{file.relpath}} ({{file.fmtLength}})</span>
|
|
</li>
|
|
</ul>
|
|
<div ng-show="hasStatus(download, 'active')" class="download-item hidden-phone">
|
|
<div class="download-graph" dspeed="download.downloadSpeed" uspeed="download.uploadSpeed" xticks="7" yticks="7" dgraph draw="!download.collapsed"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
<!-- }}} -->
|
|
</div>
|
|
|
|
<!-- {{{ download pagination -->
|
|
<div class="col-md-offset-3 col-md-9" ng-show="totalDownloads > pageSize">
|
|
<div class="pagination pull-right">
|
|
<pagination
|
|
total-items="totalDownloads"
|
|
items-per-page="pageSize"
|
|
max-size="11"
|
|
ng-model="currentPage"
|
|
boundary-links="true"
|
|
previous-text="‹"
|
|
next-text="›"
|
|
first-text="«"
|
|
last-text="»"
|
|
>
|
|
</pagination>
|
|
</div>
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ modals -->
|
|
<div ng-controller="ModalCtrl">
|
|
|
|
<!--{{{ add uri modal -->
|
|
<script type="text/ng-template" id="getUris.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">×</button>
|
|
<h4>{{ 'Add Downloads By URIs' | translate }}</h4>
|
|
</div>
|
|
<form class="modal-body">
|
|
<fieldset>
|
|
<p class="help-block">
|
|
{{ '- You can add multiple downloads (files) at the same time by putting URIs for each file on a separate line.' | translate }}<br />
|
|
{{ '- You can also add multiple URIs (mirrors) for the *same* file. To do this, separate the URIs by a space.' | translate }}<br />
|
|
{{ '- A URI can be HTTP(S)/FTP/BitTorrent-Magnet.' | translate }}</br>
|
|
</p>
|
|
<textarea rows="4" style="width: 100%" ng-model="getUris.uris" autofocus placeholder="http://mirror1.com/f1.jpg http://mirror2.com/f1.jpg\nhttp://mirror1.com/f2.mp4 http://mirror2.com/f2.mp4 --out=file2.mp4"></textarea>
|
|
<br /><br />
|
|
|
|
<div>
|
|
<div ng-click="getUris.downloadSettingsCollapsed = !getUris.downloadSettingsCollapsed" class="modal-advanced-title">
|
|
{{ 'Download settings' | translate }}
|
|
<i ng-hide="!getUris.downloadSettingsCollapsed" class="fa fa-fw fa-caret-right"></i>
|
|
<i ng-hide="getUris.downloadSettingsCollapsed" class="fa fa-fw fa-caret-down"></i>
|
|
</div>
|
|
<div collapse="getUris.downloadSettingsCollapsed" class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getUris.settings">
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<br />
|
|
<div ng-click="getUris.advancedSettingsCollapsed = !getUris.advancedSettingsCollapsed" class="modal-advanced-title">
|
|
{{ 'Advanced settings' | translate }}
|
|
<i ng-hide="!getUris.advancedSettingsCollapsed" class="fa fa-fw fa-caret-right"></i>
|
|
<i ng-hide="getUris.advancedSettingsCollapsed" class="fa fa-fw fa-caret-down"></i>
|
|
</div>
|
|
<div collapse="getUris.advancedSettingsCollapsed" class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getUris.fsettings">
|
|
<p class="col-sm-offset-3 col-sm-9 help-block controls">{{set.desc}}</p>
|
|
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button class="btn btn-default btn-primary" ng-click="$close()">{{ 'Start' | translate }}</button>
|
|
</div>
|
|
</form>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ add torrent modal -->
|
|
<script type="text/ng-template" id="getTorrents.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'Add Downloads By Torrents' | translate }}</h4>
|
|
</div>
|
|
<form class="modal-body">
|
|
<fieldset>
|
|
<legend>{{ 'Select Torrents' | translate }}</legend>
|
|
<p class="help-block">
|
|
{{ '- Select the torrent from the local filesystem to start the download.' | translate }}<br />
|
|
{{ '- You can select multiple torrents to start multiple downloads.' | translate }}<br />
|
|
{{ '- To add a BitTorrent-Magnet URL, use the Add By URI option and add it there.' | translate }}
|
|
</p>
|
|
<div class="form-horizontal form-group">
|
|
<label class="control-label" style="text-align: left;"><b>{{ 'Select a Torrent' | translate }}:</b></label>
|
|
<div class="controls">
|
|
<input type="file" fselect="getTorrents.files" multiple />
|
|
</div>
|
|
</div>
|
|
<br />
|
|
|
|
<div>
|
|
<div class="modal-advanced-title">
|
|
{{ 'Download settings' | translate }}
|
|
</div>
|
|
<div class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getTorrents.settings">
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<br />
|
|
<div ng-click="getTorrents.collapsed = !getTorrents.collapsed" class="modal-advanced-title">
|
|
{{ 'Advanced settings' | translate }}
|
|
<i ng-hide="!getTorrents.collapsed" class="fa fa-fw fa-caret-right"></i>
|
|
<i ng-hide="getTorrents.collapsed" class="fa fa-fw fa-caret-down"></i>
|
|
</div>
|
|
<div collapse="getTorrents.collapsed" class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getTorrents.fsettings">
|
|
<p class="col-sm-offset-3 col-sm-9 help-block controls">{{set.desc}}</p>
|
|
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button class="btn btn-default btn-primary" ng-click="$close()">{{ 'Start' | translate }}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ add metalink modal -->
|
|
<script type="text/ng-template" id="getMetalinks.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'Add Downloads By Metalinks' | translate }}</h4>
|
|
</div>
|
|
<form class="modal-body">
|
|
<fieldset>
|
|
<legend>{{ 'Select Metalinks' | translate }}</legend>
|
|
<p class="help-block">
|
|
{{ '- Select the Metalink from the local filesystem to start the download.' | translate }}<br />
|
|
{{ '- You can select multiple Metalinks to start multiple downloads.' | translate }}
|
|
</p>
|
|
<div class="form-horizontal form-group">
|
|
<label class="control-label" style="text-align: left;"><b>{{ 'Select a Metalink' | translate }}:</b></label>
|
|
<div class="controls">
|
|
<input type="file" fselect="getMetalinks.files" multiple />
|
|
</div>
|
|
</div>
|
|
<br />
|
|
|
|
<div>
|
|
<div class="modal-advanced-title">
|
|
{{ 'Download settings' | translate }}
|
|
</div>
|
|
<div class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getMetalinks.settings">
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
|
|
<br />
|
|
<div ng-click="getMetalinks.collapsed = !getMetalinks.collapsed" class="modal-advanced-title">
|
|
{{ 'Advanced settings' | translate }}
|
|
<i ng-hide="!getMetalinks.collapsed" class="fa fa-fw fa-caret-right"></i>
|
|
<i ng-hide="getMetalinks.collapsed" class="fa fa-fw fa-caret-down"></i>
|
|
</div>
|
|
<div collapse="getMetalinks.collapsed" class="form-horizontal modal-advanced-options">
|
|
<div class="form-group" ng-repeat="(name, set) in getMetalinks.fsettings">
|
|
<p class="col-sm-offset-3 col-sm-9 help-block controls">{{set.desc}}</p>
|
|
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
</div>
|
|
<br />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button class="btn btn-default btn-primary" ng-click="$close()">{{ 'Start' | translate }}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ select files checkbox modal -->
|
|
<script type="text/ng-template" id="selectFilesCheckBox.html">
|
|
<div ng-repeat="(folderName,folder) in files.dirs">
|
|
<!--recursive folder-->
|
|
|
|
<div class="controls">
|
|
<!--click to toggle show the subfolders and files-->
|
|
<div class="checkbox" data-ng-click="folder.show=!folder.show">
|
|
<!-- The value of indeterminate="" can be bound to any angular expression -->
|
|
<input type="checkbox" data-ng-model="folder.selected" data-ng-click="$event.stopPropagation()" indeterminate/>{{folderName}}
|
|
<span ng-show="!folder.show" class="control-label">{{ 'click the text to expand the folder' | translate }}</span>
|
|
<span ng-show="folder.show" class="control-label">{{ 'click the text to collapse the folder' | translate }}</span>
|
|
</div>
|
|
<div ng-show="folder.show" class="form-group selectFiles recursivedir" ng-include="'selectFilesCheckBox.html'" ng-init="files=folder">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-repeat="file in files.files">
|
|
<!--files-->
|
|
<label class="control-label">{{ 'Select to download' | translate }}</label>
|
|
|
|
<div class="controls">
|
|
<label class="checkbox">
|
|
<input type="checkbox" data-ng-model="file.selected" indeterminate="false"/>{{file.relpath}}
|
|
</label>
|
|
</div>
|
|
<br/>
|
|
<br/>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ select file modal -->
|
|
<script type="text/ng-template" id="selectFiles.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'Choose files to start download for' | translate }}</h4>
|
|
</div>
|
|
|
|
<form class="form-horizontal modal-body">
|
|
<fieldset>
|
|
<div class="form-group selectFiles" ng-include="'selectFilesCheckBox.html'" ng-init="files=selectFiles.groupedFiles">
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button class="btn btn-default btn-primary" ng-click="$close()">{{ 'Choose' | translate }}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ settings modal -->
|
|
<script type="text/ng-template" id="settings.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{settings.title}}</h4>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-md-12 form-group filter-input-group">
|
|
<input type="text" class="form-control input-xlarge" ng-model="propFilter" placeholder="{{ 'Filter' | translate }}"/>
|
|
<span class="clear-button" ng-show="propFilter" ng-click="propFilter = ''">X</span>
|
|
</div>
|
|
</div>
|
|
<form class="form-horizontal">
|
|
<fieldset>
|
|
<div class="form-group" ng-repeat="(name, set) in settings.settings | objFilter:propFilter">
|
|
<label class="col-sm-3 control-label">{{name}}</label>
|
|
|
|
<div class="col-sm-9 controls">
|
|
<select class="form-control" ng-show="set.options.length && !set.multiline" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length && !set.multiline" type="text" class="form-control input-xlarge" ng-model="set.val"/>
|
|
<textarea ng-show="set.multiline" ng-model="set.val"></textarea>
|
|
<div class="checkbox" ng-show="set.starred != undefined">
|
|
<label>
|
|
<input type="checkbox" ng-model="set.starred"/>
|
|
{{ 'Quick Access (shown on the main page)' | translate }}
|
|
</label>
|
|
</div>
|
|
<p class="help-block">{{set.desc}}</p>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button class="btn btn-default btn-primary" ng-click="$close()">{{settings.actionText}}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!--{{{ connection modal -->
|
|
<script type="text/ng-template" id="connection.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'Connection Settings' | translate }}</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form class="form-horizontal">
|
|
<fieldset>
|
|
<legend>{{ 'Aria2 RPC host and port' | translate }}</legend>
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the host' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<div class="input-group">
|
|
<span class="input-group-addon">http(s)://</span>
|
|
<input type="text" class="form-control input-xlarge"
|
|
ng-model="connection.conf.host"/>
|
|
</div>
|
|
<p class="help-block">
|
|
{{ 'Enter the IP or DNS name of the server on which the RPC for Aria2 is running (default: localhost)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the port' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<input type="text" class="form-control input-xlarge modal-form-input-number"
|
|
ng-model="connection.conf.port"/>
|
|
<p class="help-block">
|
|
{{ 'Enter the port of the server on which the RPC for Aria2 is running (default: 6800)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the RPC path' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<div class="input-group">
|
|
<span class="input-group-addon">http(s)://{{connection.conf.host + ':' + connection.conf.port}}</span>
|
|
<input type="text" class="form-control input-xlarge"
|
|
ng-model="connection.conf.path"/>
|
|
</div>
|
|
<p class="help-block">
|
|
{{ 'Enter the path for the Aria2 RPC endpoint (default: /jsonrpc)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'SSL/TLS encryption' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<div class="checkbox">
|
|
<label>
|
|
<input type="checkbox" ng-model="connection.conf.encrypt"/>
|
|
{{ 'Enable SSL/TLS encryption' | translate }}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the secret token (optional)' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<label>
|
|
<input type="password" class="form-control input-xlarge" ng-model="connection.conf.auth.token"/>
|
|
<p class="help-block">
|
|
{{ 'Enter the Aria2 RPC secret token (leave empty if authentication is not enabled)' | translate }}
|
|
</p>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the username (optional)' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<input type="text" class="form-control input-xlarge"
|
|
ng-model="connection.conf.auth.user"/>
|
|
<p class="help-block">
|
|
{{ 'Enter the Aria2 RPC username (empty if authentication not enabled)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter the password (optional)' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<input type="password" class="form-control input-xlarge"
|
|
ng-model="connection.conf.auth.pass"/>
|
|
<p class="help-block">
|
|
{{ 'Enter the Aria2 RPC password (empty if authentication not enabled)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend>{{ 'Direct Download' | translate }}</legend>
|
|
<div class="form-group">
|
|
<label class="col-sm-3 control-label">{{ 'Enter base URL (optional)' | translate }}:</label>
|
|
<div class="col-sm-9 controls">
|
|
<input type="text" class="form-control input-xlarge"
|
|
ng-model="connection.conf.directURL"/>
|
|
<p class="help-block">
|
|
{{ 'If supplied, links will be created to enable direct download from the Aria2 server.' | translate }}<br />
|
|
{{ '(Requires appropriate webserver to be configured.)' | translate }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button href="#" class="btn btn-default" ng-click="$dismiss()">{{ 'Cancel' | translate }}</button>
|
|
<button href="#" class="btn btn-default btn-primary" ng-click="$close()">
|
|
{{ 'Save Connection configuration' | translate }}
|
|
</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
|
|
<!-- {{{ server info modal -->
|
|
<script type="text/ng-template" id="server_info.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'Aria2 server info' | translate }}</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<b>{{ 'Aria2 Version' | translate }} {{miscellaneous.version}}</b>
|
|
<br /><br />
|
|
<b>{{ 'Features Enabled' | translate }}</b>
|
|
<ul>
|
|
<li
|
|
ng-repeat="feature in miscellaneous.enabledFeatures">
|
|
<span>{{feature}}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Close' | translate }}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
<!-- {{{ about modal -->
|
|
<script type="text/ng-template" id="about.html">
|
|
<div class="modal-header">
|
|
<button class="close" ng-click="$dismiss()">x</button>
|
|
<h4>{{ 'About and contribute' | translate }}</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>
|
|
{{ 'To download the latest version of the project, add issues or to contribute back, head on to' | translate }}:<br />
|
|
<a href="https://github.com/ziahamza/webui-aria2" target="_blank">https://github.com/ziahamza/webui-aria2</a>
|
|
<br /><br />
|
|
{{ 'Or you can open the latest version in the browser through' | translate }}:<br />
|
|
<a href="https://ziahamza.github.io/webui-aria2" target="_blank">https://ziahamza.github.io/webui-aria2</a>
|
|
</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-default" ng-click="$dismiss()">{{ 'Close' | translate }}</button>
|
|
</div>
|
|
</script>
|
|
<!-- }}} -->
|
|
|
|
|
|
</div>
|
|
<!-- }}} -->
|
|
|
|
</body>
|
|
</html>
|