364 lines
		
	
	
		
			13 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			364 lines
		
	
	
		
			13 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <script type="text/javascript">
 | |
|     var JQapp_BASE_PATH = '/__static/js/app';
 | |
| </script>
 | |
| <link rel="stylesheet" href="/__static-modules/jquery-ui/dist/themes/smoothness/jquery-ui.css">
 | |
| 
 | |
| <script type="text/javascript" src="/socket.io/socket.io.js"></script>
 | |
| <script src='/__static-modules/mustache/mustache.min.js'></script>
 | |
| <script src="/__static/lib/js/jq-repeat.js"></script>
 | |
| <script src="/__static-modules/moment/min/moment-with-locales.min.js"></script>
 | |
| <script src="/__static-modules/jquery-ui/dist/jquery-ui.min.js"></script>
 | |
| <script src="/__static/js/app.js"></script>
 | |
| <script>
 | |
|     console.log("here", app)
 | |
|     app.include('/torrent.js');
 | |
| </script>
 | |
| 
 | |
| <style type="text/css">
 | |
|     .ui-dialog .ui-dialog-title{
 | |
|         width: unset;
 | |
|     }
 | |
| 
 | |
|     #tbp_proxy_header {
 | |
|         position: fixed;
 | |
|         top: 0;
 | |
|         width: 100%;
 | |
|         z-index: 95;
 | |
|         background: lightblue;
 | |
|         height: 3em;
 | |
|         text-align: initial;
 | |
|         padding-top: .5em;
 | |
|         padding-right: 1em;
 | |
|     }
 | |
| 
 | |
|     #tbp_proxy_header_right{
 | |
|         margin-right: 2em;
 | |
|         float: right;
 | |
| 
 | |
|         display: flex;
 | |
|         align-items:center;
 | |
|     }
 | |
| 
 | |
|     #tbp_proxy_torrent_dialog_opener{
 | |
|         border-radius: 25px;
 | |
|         background: lightseagreen;
 | |
|         display: flex;
 | |
|         align-items:center;
 | |
| 
 | |
|         padding: 1em;
 | |
|         padding-top: .3em;
 | |
|         padding-bottom: .3em;
 | |
| 
 | |
|         margin-right: .5em;
 | |
|     }
 | |
| 
 | |
|     #header {
 | |
|         padding-top: 3.5em;
 | |
|     }
 | |
| </style>
 | |
| 
 | |
| <!-- 
 | |
|     Dialog boxes to be displayed
 | |
|  -->
 | |
| 
 | |
| <div id="tbp_proxy_login_dialog" title="SSO Login">
 | |
|   <div class="shadow-lg card">
 | |
|     <div class="card-header shadow actionMessage" style="display:none"></div>
 | |
|     <div class="card-body">
 | |
|         <form action="auth/login" onsubmit="formAJAX(this)" evalAJAX="
 | |
|             app.auth.setToken(data.token);
 | |
|             app.auth.logInRedirect();
 | |
|         ">
 | |
|             <input type="hidden" name="redirect" value="<%= redirect %>">
 | |
| 
 | |
|             <div class="form-group">
 | |
|                 <label class="control-label">User name</label>
 | |
|                 <div class="input-group mb-3 shadow">
 | |
|                   <div class="input-group-prepend">
 | |
|                     <span class="input-group-text" ><i class="fa-solid fa-user-tie"></i></span>
 | |
|                   </div>
 | |
|                     <input type="text" name="uid" class="form-control" placeholder="jsmith" />
 | |
|                 </div>
 | |
|             </div>
 | |
| 
 | |
|             <div class="form-group">
 | |
|                 <label class="control-label">Password</label>
 | |
|                 <div class="input-group mb-3 shadow">
 | |
|                   <div class="input-group-prepend">
 | |
|                     <span class="input-group-text" ><i class="fa-solid fa-key"></i></span>
 | |
|                   </div>
 | |
|                     <input type="password" name="password" class="form-control" placeholder="hunter123!"/>
 | |
|                 </div>
 | |
|             </div>
 | |
| 
 | |
|             <button type="submit" class="btn btn-outline-dark"><i class="fa-solid fa-right-to-bracket"></i> Log in</button>
 | |
|         </form>
 | |
|     </div>
 | |
|   </div>
 | |
| </div>
 | |
| 
 | |
| 
 | |
| <!-- 
 | |
|     Torrent List Dialog
 | |
|  -->
 | |
| 
 | |
| <style type="text/css">
 | |
|     #tbp_proxy_torrent_dialog{
 | |
|         padding: 0;
 | |
|     }
 | |
|     #tbp_proxy_torrent_dialog progress{
 | |
|         width: 100%;
 | |
|         height: 2em;
 | |
|     }
 | |
|     #tbp_proxy_torrent_dialog ul{
 | |
|         max-height: 400px;
 | |
|         overflow-y: scroll;
 | |
|         list-style-type: none;
 | |
|         padding-left: 0;
 | |
|         margin-bottom: 0;
 | |
|     }
 | |
|     #tbp_proxy_torrent_dialog li{
 | |
|         padding-left: 1em;
 | |
|         padding-right: 1em;
 | |
|     }
 | |
| </style>
 | |
| 
 | |
| <div id="tbp_proxy_torrent_dialog" title="Torrents">
 | |
|     <ul>
 | |
|         <li jq-repeat="tbp_proxy_torrent_dialog_torrents">{{name}}
 | |
|             <br />
 | |
|             {{^isFinished}}
 | |
|                 <progress id="file" max="100" value="{{percentDone}}">{{percentDone}}%</progress>
 | |
|                 <br />
 | |
|                 <b>{{statusText}}</b> @ <b>{{rateDownload}}</b> finishing <b>{{eta}}</b>
 | |
|                 <br />
 | |
|                 {{^isActive}}
 | |
|                 <button class="ui-button ui-widget ui-corner-all" onclick="app.torrent.start({{id}})">
 | |
|                   <span class="ui-icon ui-icon-play"></span> Start
 | |
|                 </button>
 | |
|                 {{/isActive}}
 | |
| 
 | |
|                 {{#isActive}}
 | |
|                 <button class="ui-button ui-widget ui-corner-all" onclick="app.torrent.stop({{id}})">
 | |
|                   <span class="ui-icon ui-icon-pause"></span>Pause
 | |
|                 </button>
 | |
|                 {{/isActive}}
 | |
| 
 | |
|                 <button class="ui-button ui-widget ui-corner-all" onclick="
 | |
|                     app.torrent.destroy({{id}}, function(error, data){
 | |
|                         $.scope.tbp_proxy_torrent_dialog_torrents.splice({{__id}}, 1);
 | |
|                     });
 | |
|                 ">
 | |
|                   <span class="ui-icon ui-icon-closethick"></span>Delete
 | |
|                 </button>
 | |
| 
 | |
|             {{/isFinished}}
 | |
| 
 | |
|             {{#isFinished}}
 | |
|                 <br /> Done! <a href="https://stuff.718it.biz/torrents/{{name}}" target="_blank"> HTTP Link</a>
 | |
|             {{/isFinished}}
 | |
|             <hr />
 | |
|         </li>
 | |
|     </ul>
 | |
| </div>
 | |
| 
 | |
| 
 | |
| <!-- 
 | |
|     Torrent Add Dialog
 | |
|  -->
 | |
| <style type="text/css">
 | |
|     #tbp_proxy_torrent_add_dialog_container{
 | |
|         width: 32em;
 | |
|     }
 | |
| 
 | |
|     #tbp_proxy_torrent_add_dialog input[type="text"]{
 | |
|         width: 90%;
 | |
|     }
 | |
|     #tbp_proxy_torrent_add_dialog label,legend{
 | |
|         font-weight: bold;
 | |
|     }
 | |
| 
 | |
| </style>
 | |
| 
 | |
| <div id="tbp_proxy_torrent_add_dialog" title="Add torrent">
 | |
|     <div id="tbp_proxy_torrent_add_dialog_container" class='card'>
 | |
|         <div class="card-header shadow actionMessage" style="display:none"></div>
 | |
|         <div jq-repeat="torrentAdd">
 | |
|             <form action="torrent" method="post" onsubmit="formAJAX(this)" evalAJAX="
 | |
|                 app.publish('torrent:add', {...data, __noSocket: true});
 | |
|                 $('#tbp_proxy_torrent_add_dialog').dialog('close');
 | |
|                 openDialog($('#tbp_proxy_torrent_dialog'))
 | |
|             ">
 | |
|                 <p>
 | |
|                     <label for="_name">Name:</label>
 | |
|                     <br />
 | |
|                     <input type="text" name="_name" value="{{{name}}}" readonly/>
 | |
|                 </p>
 | |
| 
 | |
|                 <p>
 | |
|                     <label for="magnetLink">Magnet Link:</label>
 | |
|                     <br />
 | |
|                     <input type="text" name="magnetLink" value="{{{magnetLink}}}" readonly/>
 | |
|                 </p>
 | |
| 
 | |
|                 <p>
 | |
|                   <legend>Public Download:</legend>
 | |
| 
 | |
|                   <label for="radio-1" title="The download will appare in the communal download folder">Public</label>
 | |
|                   <input type="radio" name="isPrivate" id="radio-1" value="true" checked readonly/>
 | |
| 
 | |
|                   <label for="radio-2" title="Only you(and the admins) will be able to see this download">Private</label>
 | |
|                   <input type="radio" name="isPrivate" id="radio-2" value="false" readonly/>
 | |
|                 </p>
 | |
| 
 | |
|                 <p>
 | |
|                   <legend>Start on add:</legend>
 | |
| 
 | |
|                   <label for="isStart-1" title="The download will appare in the communal download folder">Yes</label>
 | |
|                   <input type="radio" name="isStart" id="isStart-1" value="true" checked readonly/>
 | |
| 
 | |
|                   <label for="isStart-2" title="Only you(and the admins) will be able to see this download">No</label>
 | |
|                   <input type="radio" name="isStart" id="isStart-2" value="false" readonly/>
 | |
|                 </p>
 | |
| 
 | |
|                 <hr />
 | |
|                 <button type="submit">Start Download</button>
 | |
|                 <button onclick="$('#tbp_proxy_torrent_add_dialog').dialog('close')">Cancel</button>
 | |
|             </form>
 | |
|         </div>
 | |
|     </div>
 | |
| </div>
 | |
| 
 | |
| 
 | |
| <!-- 
 | |
|     The bar injected at the top of the page
 | |
|  -->
 | |
| 
 | |
| <div id="tbp_proxy_header_right">
 | |
|     <span id="tbp_proxy_torrent_dialog_opener" class="tbp_proxy_is_authed">
 | |
|         <img src="/__static/img/Transmission_Icon.svg" height="22" width="22" style="margin-right: .3em;" />
 | |
|         <span jq-repeat="tbp_proxy_torrent_dialog_opener_status">
 | |
|             <b> <span class="ui-icon ui-icon-arrowthick-1-n"></span>{{downloadSpeed}} <span class="ui-icon ui-icon-arrowthick-1-s"></span>{{uploadSpeed}}</b>
 | |
|         </span>
 | |
|     </span>
 | |
|     <button id="tbp_proxy_login_dialog_opener" class="tbp_proxy_not_authed ui-button ui-corner-all ui-widget">Login</button>
 | |
|     <button class="tbp_proxy_is_authed ui-button ui-corner-all ui-widget"
 | |
|         onclick="app.auth.logOut(e => window.location.href='/')">Logout</button>
 | |
| </div>
 | |
| 
 | |
| <script type="text/javascript">
 | |
|     $( document ).ready(function() {
 | |
|         var commonDialogOptions = {
 | |
|             position: { my: "left top", at: "left bottom", of: '#tbp_proxy_header_right' },
 | |
|             autoOpen: false,
 | |
|             resizable: false,
 | |
|             closeOnEscape: true,
 | |
|             draggable: false,
 | |
|             width: 'auto',
 | |
|         };
 | |
| 
 | |
|         /* Login Button and dialog*/
 | |
|         $( "#tbp_proxy_login_dialog" ).dialog(commonDialogOptions);
 | |
| 
 | |
|         $( "#tbp_proxy_login_dialog_opener" ).on( "click", function() {
 | |
|             // https://stackoverflow.com/a/6500385
 | |
|             $( "#tbp_proxy_login_dialog" ).parent().css({position:"fixed", 'margin-right': "2em", 'margin-top': '3em'}).end().dialog( "open" );
 | |
|         });
 | |
| 
 | |
| 
 | |
|         /* Torrent list button and dialog */
 | |
|         $( "#tbp_proxy_torrent_dialog" ).dialog(commonDialogOptions);
 | |
| 
 | |
|         $( "#tbp_proxy_torrent_dialog_opener" ).on( "click", function() {
 | |
|             $( "#tbp_proxy_torrent_dialog" ).parent().css({position:"fixed", 'margin-right': "2em", 'margin-top': '3em'}).end().dialog( "open" );
 | |
|         });
 | |
| 
 | |
| 
 | |
|         /* Torrent add button and dialog */
 | |
|         $( "#tbp_proxy_torrent_add_dialog" ).dialog({
 | |
|             modal: true,
 | |
|             height: 300,
 | |
|             ...commonDialogOptions
 | |
|         });
 | |
| 
 | |
|         $("body").on('click', 'img.718link', function(el){
 | |
|             // magnetLink 
 | |
|             $.scope.torrentAdd.update({
 | |
|                 magnetLink: $(this).data('link'),
 | |
|                 name: (new URLSearchParams($(this).data('link'))).get('dn')
 | |
|             });
 | |
|             $('#tbp_proxy_torrent_add_dialog').parent().css({position:"fixed", 'margin-right': "2em", 'margin-top': '3em'}).end().dialog('open');
 | |
|         });
 | |
|         
 | |
|         $('a').each(function(idx, el){
 | |
|             var $el = $(el);
 | |
|             if($el.attr('href') && $el.attr('href').match("magnet:?")){
 | |
|                 $el.before('<img class="tbp_proxy_is_authed 718link" src="/__static/img/Transmission_Icon.svg" height=24 width=24 data-link="'+$el.attr('href')+'"/>')
 | |
|             }
 | |
|         });
 | |
| 
 | |
|         /* Enable tooltips*/
 | |
|         $( '#tbp_proxy_header' ).tooltip({
 | |
|           track: true
 | |
|         });
 | |
| 
 | |
|         app.subscribe('torrent:add', function(data, topic){
 | |
|             console.log('sub', topic, data)
 | |
|             $.scope.tbp_proxy_torrent_dialog_torrents.unshift(app.torrent.parseTorrnetItem(data))
 | |
|         });
 | |
| 
 | |
|         app.subscribe('torrent:server:status', function(data, topic){
 | |
|             app.torrent.isDown = false
 | |
|             $('#tbp_proxy_torrent_dialog_opener').css('background', "lightseagreen")
 | |
|             $.scope.tbp_proxy_torrent_dialog_opener_status.update(app.torrent.parseServerStatus(data));
 | |
|         });
 | |
| 
 | |
|         app.subscribe(`app:api:error:555`, function(data, topics){
 | |
|             console.log('we down')
 | |
|             app.torrent.isDown = true
 | |
|             $('#tbp_proxy_torrent_dialog_opener').css('background', "red") 
 | |
|         });
 | |
| 
 | |
|         app.subscribe('torrent:server:status:down', function(data, topic){
 | |
|             app.torrent.isDown = true
 | |
|             $('#tbp_proxy_torrent_dialog_opener').css('background', "red")
 | |
|         });
 | |
| 
 | |
|         listTorrents();
 | |
|         setInterval(refreshTorrents, 5000)
 | |
|     });
 | |
| 
 | |
|     function humanFileSize(size) {
 | |
|         var i = size == 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024));
 | |
|         return (size / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
 | |
|     }
 | |
| 
 | |
|     function openDialog($el){
 | |
|         $el.parent().css({
 | |
|             position:"fixed", 'margin-right': "2em", 'margin-top': '3em'
 | |
|         }).end().dialog('open');
 | |
|     }
 | |
| 
 | |
|     function listTorrents(){
 | |
|         app.torrent.list(function(err, data){
 | |
|             for(let torrent of data.results){
 | |
|                 $.scope.tbp_proxy_torrent_dialog_torrents.unshift(app.torrent.parseTorrnetItem(torrent))
 | |
|                 app.torrent.get(function(error, torrent){
 | |
|                     $.scope.tbp_proxy_torrent_dialog_torrents.update('id', torrent.result.id, app.torrent.parseTorrnetItem(torrent.result))
 | |
|                 } , torrent.id, true)
 | |
|             }
 | |
|         });
 | |
|     };
 | |
| 
 | |
|     function refreshTorrents(){
 | |
|         for(let torrent of $.scope.tbp_proxy_torrent_dialog_torrents){
 | |
|             if(!torrent.isFinished){
 | |
|                 app.torrent.get(function(error, torrent){
 | |
|                     $.scope.tbp_proxy_torrent_dialog_torrents.update('id', torrent.result.id, app.torrent.parseTorrnetItem(torrent.result))
 | |
|                 } , torrent.id, true)
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
| </script>
 |