Changeset 10050

Timestamp:

Jan 31, 2010, 2:42:48 AM (12 years ago)

Author:

kjg

Message:

(trunk web) Add a trackers tab patch from mjpieters, with minor style changes

Location:

trunk/web

Files:

• images/buttons/Makefile.am (modified) (1 diff)
• images/buttons/info_trackers.png (added)
• index.html (modified) (2 diffs)
• javascript/torrent.js (modified) (5 diffs)
• javascript/transmission.js (modified) (5 diffs)
• stylesheets/common.css (modified) (2 diffs)
• stylesheets/iphone.css (modified) (2 diffs)

trunk/web/images/buttons/Makefile.am

@@ -8 +8 @@
   info_files.png \
   info_general.png \
+  info_trackers.png \
   tab_backgrounds.png \
   toolbar_buttons.png \

trunk/web/index.html

@@ -69 +69 @@
                                 <div class="inspector_tab selected" id="inspector_tab_info"><a href="#info"><img src="images/buttons/info_general.png" alt="Information"/></a></div>
                                 <div class="inspector_tab" id="inspector_tab_activity"><a href="#activity"><img src="images/buttons/info_activity.png" alt="Activity"/></a></div>
+                                <div class="inspector_tab" id="inspector_tab_trackers"><a href="#trackers"><img src="images/buttons/info_trackers.png" alt="Trackers"/></a></div>
                                 <div class="inspector_tab" id="inspector_tab_files"><a href="#files"><img src="images/buttons/info_files.png" alt="Files"/></a></div>
                         </div>
@@ -173 +174 @@
                                 </div><!-- class="inspector_group"-->
                         </div><!-- id="inspector_tab_activity_container" -->
+
+                        <div style="display:none;" class="inspector_container" id="inspector_tab_trackers_container">
+                                <div id="inspector_trackers_list">
+                                </div>
+                        </div><!-- id="inspector_tab_trackers_container" -->
 
                         <div style="display:none;" class="inspector_container" id="inspector_tab_files_container">

trunk/web/javascript/torrent.js

@@ -33 +33 @@
     'haveUnchecked', 'haveValid', 'leftUntilDone', 'metadataPercentComplete', 'peersConnected',
     'peersGettingFromUs', 'peersSendingToUs', 'rateDownload', 'rateUpload',
-    'recheckProgress', 'sizeWhenDone', 'status',
+    'recheckProgress', 'sizeWhenDone', 'status', 'trackerStats',
     'uploadedEver', 'uploadRatio', 'seedRatioLimit', 'seedRatioMode', 'downloadDir' ]
 
@@ -55 +55 @@
                 this._name          = data.name;
                 this._name_lc       = this._name.toLowerCase( );
+                this._trackerStats  = this.buildTrackerStats(data.trackerStats);
                 this._file_model    = [ ];
                 this._file_view     = [ ];
@@ -153 +154 @@
         },
         
+        buildTrackerStats: function(trackerStats) {
+                result = [];
+                for( var i=0, tracker; tracker=trackerStats[i]; ++i ) {
+                        tier = result[tracker.tier - 1] || [];
+                        tier[tier.length] = {
+                                'host': tracker.host,
+                                'seederCount': tracker.seederCount,
+                                'leecherCount': tracker.leecherCount,
+                                'downloadCount': tracker.downloadCount
+                        };
+                        result[tracker.tier - 1] = tier;
+                }
+                return result;
+        },
+
         /*--------------------------------------------
          *
@@ -208 +224 @@
                 }
         },
+        trackerStats: function() { return this._trackerStats; },
         uploadSpeed: function() { return this._upload_speed; },
         uploadTotal: function() { return this._upload_total; },
@@ -334 +351 @@
                 this._error_string            = data.errorString;
                 this._eta                     = data.eta;
+                this._trackerStats            = this.buildTrackerStats(data.trackerStats);
                 this._state                   = data.status;
                 this._download_dir            = data.downloadDir;

trunk/web/javascript/transmission.js

@@ -76 +76 @@
                 this._torrent_list             = $('#torrent_list')[0];
                 this._inspector_file_list      = $('#inspector_file_list')[0];
+                this._inspector_trackers_list  = $('#inspector_trackers_list')[0];
                 this._inspector_tab_files      = $('#inspector_tab_files')[0];
                 this._toolbar_buttons          = $('#torrent_global_menu ul li');
@@ -683 +684 @@
         
                 this.updateVisibleFileLists();
+                this.updateTrackersLists();
         },
 
@@ -1086 +1088 @@
                         setInnerHTML( tab.error, na );
                         this.updateVisibleFileLists();
+                        this.updateTrackersLists();
                         $("#torrent_inspector_size, .inspector_row > div:contains('N/A')").css('color', '#666');
                         return;
@@ -1160 +1163 @@
                 setInnerHTML( tab.error, error );
                 
+                this.updateTrackersLists();
                 $(".inspector_row > div:contains('N/A')").css('color', '#666');
                 this.updateVisibleFileLists();
@@ -1182 +1186 @@
                         }
                 }
+        },
+
+        updateTrackersLists: function() {
+                // By building up the HTML as as string, then have the browser
+                // turn this into a DOM tree, this is a fast operation.
+                var html = '';
+                var na = 'N/A';
+                var torrents = this.getSelectedTorrents( );
+                if( $(this._inspector_trackers_list).is(':visible') && torrents.length == 1 ) {
+                        for( var i=0, tier; tier=torrents[0]._trackerStats[i]; ++i ) {
+                                html += '<div class="inspector_group"><div class="inspector_group_label">';
+                                html += 'Tier ' + (i + 1) + '</div><ul class="tier_list">';
+                                for( var j=0, tracker; tracker=tier[j]; ++j ) {
+                                        var parity = ((j+1) % 2 == 0 ? 'even' : 'odd');
+                                        html += '<li class="inspector_tracker_entry ' + parity + '"><div class="tracker_host">'
+                                        html += tracker.host + '</div><table class="tracker_stats">';
+                                        html += '<tr><th>Seeders:</th><td>' + (tracker.seederCount > -1 ? tracker.seederCount : na) + '</td></tr>';
+                                        html += '<tr><th>Leechers:</th><td>' + (tracker.leecherCount > -1 ? tracker.leecherCount : na) + '</td></tr>';
+                                        html += '<tr><th>Downloads:</th><td>' + (tracker.downloadCount > -1 ? tracker.downloadCount : na)+ '</td></tr>';
+                                        html += '</table></li>';
+                                }
+                                html += '</ul></div>';
+                        }
+                }
+                setInnerHTML(this._inspector_trackers_list, html);
         },
 

trunk/web/stylesheets/common.css

@@ -550 +550 @@
 }
 div#inspector_tabs {
-        width: 189px;
+        width: 243px;
         margin: 0 auto;
         padding-top: 10px;
@@ -592 +592 @@
         padding-top: 10px;
         width: 230px; /* inspector_container_width==330 - inspector_label_width==100 */
+}
+
+/* Trackers Inspector Tab */
+#inspector_trackers_list {
+        padding: 0 0 0 0;
+        margin: 0 0 0 0;
+        text-align: left;
+        cursor: default;
+        overflow: hidden;
+}
+
+#inspector_trackers_list > div.inspector_group {
+        padding-bottom: 0;
+        margin-bottom: 0;
+}
+
+ul.tier_list {
+        width: 100%;
+        margin: 10px 0 0 0;
+        padding-left: 0px;
+        text-align: left;
+        display: block;
+        cursor: default;
+        list-style-type: none;
+        list-style: none;
+        list-style-image: none;
+        clear: both;
+}
+.tier_list table{
+  margin-left: 15px;
+  color: #666;
+}
+.tier_list th{
+  text-align: right;
+}
+
+li.inspector_tracker_entry {
+        padding: 3px 0 3px 2px;
+        display: block;
+}
+
+li.inspector_tracker_entry.odd {
+        background-color: #EEEEEE;
+}
+div.tracker_host {
+        font-size: 1.2em;
+        font-weight: bold;
+        color: #222;
 }
 

trunk/web/stylesheets/iphone.css

@@ -591 +591 @@
 }
 div#inspector_tabs {
-        width: 189px;
+        width: 243px;
         margin: 0 auto;
         padding-top: 10px;
@@ -633 +633 @@
         padding-top: 10px;
         width: 230px; /* inspector_container_width==330 - inspector_label_width==100 */
+}
+
+/* Trackers Inspector Tab */
+#inspector_trackers_list {
+        padding: 0 0 0 0;
+        margin: 0 0 0 0;
+        text-align: left;
+        cursor: default;
+        overflow: hidden;
+}
+#inspector_trackers_list > div.inspector_group {
+        padding-bottom: 0;
+        margin-bottom: 0;
+}
+ul.tier_list {
+        width: 100%;
+        margin: 10px 0 0 0;
+        padding-left: 0px;
+        text-align: left;
+        display: block;
+        cursor: default;
+        list-style-type: none;
+        list-style: none;
+        list-style-image: none;
+        clear: both;
+}
+.tier_list table{
+  margin-left: 15px;
+  color: #666;
+}
+.tier_list th{
+  text-align: right;
+}
+li.inspector_tracker_entry {
+        padding: 3px 0 3px 2px;
+        display: block;
+}
+li.inspector_tracker_entry.odd {
+        background-color: #EEEEEE;
+}
+div.tracker_host {
+        font-size: 1.2em;
+        font-weight: bold;
+        color: #222;
 }