24d3e25126
This patch resolves #295 by making the Download Settings fieldset collapsed by default and moving the examples of URIs in textarea into the placeholder of textarea itself. It also allows form submission when textarea is focused by pressing Ctrl+Enter.
1242 lines
53 KiB
HTML
Executable File
1242 lines
53 KiB
HTML
Executable File
<!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">
|
|
|
|
<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/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/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>
|
|
</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-arrow-circle-o-down"> </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-wrench"> </span> {{ 'Connection Settings' | translate }}</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a
|
|
ng-click="changeGSettings()"
|
|
href="#"><span class="fa fa-fw fa-wrench"> </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>
|
|
</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" 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" type="text" class="form-control input-large" ng-model="prop.val"/>
|
|
</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 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-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={{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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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" class="input-xlarge" 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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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" class="input-xlarge" 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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xxlarge modal-form-input-verylarge" ng-model="set.val"/>
|
|
</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 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">
|
|
<div ng-repeat="file in selectFiles.files">
|
|
<label class="control-label">{{ 'Select to download' | translate }}</label>
|
|
|
|
<div class="controls">
|
|
<label class="checkbox">
|
|
<input type="checkbox" ng-model="file.selected"/>{{file.relpath}}
|
|
</label>
|
|
</div>
|
|
<br /><br />
|
|
</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()">{{ '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">
|
|
<form class="form-horizontal">
|
|
<fieldset>
|
|
<div class="form-group" ng-repeat="(name, set) in settings.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" ng-options="opt for opt in set.options" ng-model="set.val">
|
|
</select>
|
|
<input ng-show="!set.options.length" type="text" class="form-control input-xlarge" ng-model="set.val"/>
|
|
<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">http://github.com/ziahamza/webui-aria2</a>
|
|
<br /><br />
|
|
{{ 'Or you can open the latest version in the browser through' | translate }}:<br />
|
|
<a href="http://ziahamza.github.io/webui-aria2">http://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>
|