Ticket #2774: webuiStats.patch

File webuiStats.patch, 9.3 KB (added by Longinus00, 11 years ago)
  • web/index.html

    diff --git web/index.html web/index.html
    index 0f8e7c6..082e0d0 100755
     
    316316                                </form>
    317317                        </div>
    318318                </div>
     319
     320                <div class="dialog_container" id="stats_container" style="display:none;">
     321                        <div class="dialog_top_bar"></div>
     322                        <div class="dialog_window">
     323                                <h2 class="dialog_heading">Statistics</h2>
     324                                <div id="stats_error"></div>
     325                                <div id="stats_info_container" class="stats_info_container">
     326                                        <div class="stats_group">
     327                                                <label class="category">Current Session:</label>
     328                                                <div class="stats_row">
     329                                                        <div class="item">Uploaded:</div>
     330                                                        <div id="stats_session_uploaded"></div>
     331                                                </div>
     332                                                <div class="stats_row">
     333                                                        <div class="item">Downloaded:</div>
     334                                                        <div id="stats_session_downloaded"></div>
     335                                                </div>
     336                                                <div class="stats_row">
     337                                                        <div class="item">Ratio:</div>
     338                                                        <div id="stats_session_ratio"></div>
     339                                                </div>
     340                                                <div class="stats_row">
     341                                                        <div class="item">Duration:</div>
     342                                                        <div id="stats_session_duration"></div>
     343                                                </div>
     344                                        </div>
     345                                        <div class="stats_group">
     346                                                <label class="category">Total:</label>
     347                                                <div class="stats_row">
     348                                                        <div class="item2">Started </div>
     349                                                        <div id="stats_total_count"></div>
     350                                                </div>
     351                                                <div class="stats_row">
     352                                                        <div class="item">Uploaded:</div>
     353                                                        <div id="stats_total_uploaded"></div>
     354                                                </div>
     355                                                <div class="stats_row">
     356                                                        <div class="item">Downloaded:</div>
     357                                                        <div id="stats_total_downloaded"></div>
     358                                                </div>
     359                                                <div class="stats_row">
     360                                                        <div class="item">Ratio:</div>
     361                                                        <div id="stats_total_ratio"></div>
     362                                                </div>
     363                                                <div class="stats_row">
     364                                                        <div class="item">Duration:</div>
     365                                                        <div id="stats_total_duration"></div>
     366                                                </div>
     367                                        </div>
     368                                </div>
     369                                <a href="#close" id="stats_close_button">Close</a>
     370                        </div>
     371                </div>
    319372               
    320373                <div class="dialog_container" id="upload_container" style="display:none;">
    321374                        <div class="dialog_top_bar"></div>
     
    343396                                <li id="button">&nbsp;
    344397                                        <ul id="footer_super_menu">
    345398                                                <li id="preferences">Preferences</li>
     399                                                <li id="statistics">Statistics</li>
    346400                                                <li class="separator"></li>
    347401                                                <li>Total Download Rate
    348402                                                        <ul id="footer_download_rate_menu">
  • web/javascript/transmission.js

    diff --git web/javascript/transmission.js web/javascript/transmission.js
    index f01534d..53b921a 100644
    Transmission.prototype = 
    4646                $('#filter_paused_link').parent().bind('click', function(e){ tr.showPausedClicked(e); });
    4747                $('#prefs_save_button').bind('click', function(e) { tr.savePrefsClicked(e); return false;});
    4848                $('#prefs_cancel_button').bind('click', function(e){ tr.cancelPrefsClicked(e); return false; });
     49                $('#stats_close_button').bind('click', function(e){ tr.closeStatsClicked(e); return false; });
    4950                $('.inspector_tab').bind('click', function(e){ tr.inspectorTabClicked(e, this); });
    5051                $('.file_wanted_control').live('click', function(e){ tr.fileWantedClicked(e, this); });
    5152                $('.file_priority_control').live('click', function(e){ tr.filePriorityClicked(e, this); });
    Transmission.prototype = 
    120121                var tr = this;
    121122                var async = false;
    122123                this.loadDaemonPrefs( async );
     124                this.loadDaemonStats( async );
    123125                this.initializeAllTorrents();
    124126
    125127                this.togglePeriodicRefresh( true );
    Transmission.prototype = 
    135137                }, async );
    136138        },
    137139
     140        loadDaemonStats: function( async ){
     141                var tr = this;
     142                this.remote.loadDaemonStats( function(data){
     143                        var o = data.arguments;
     144                        tr.updateStats( o );
     145                }, async );
     146        },
     147
    138148        preloadImages: function() {
    139149                if (iPhone) {
    140150                        this.loadImages(
    Transmission.prototype = 
    649659                tr.hidePrefsDialog( );
    650660        },
    651661
     662        closeStatsClicked: function(event) {
     663                this.hideStatsDialog( );
     664        },
     665
    652666        removeClicked: function( event ) {     
    653667                var tr = this;
    654668                if( tr.isButtonEnabled( event ) ) {
    Transmission.prototype = 
    817831                }
    818832        },
    819833
     834        /*
     835         * Turn the periodic ajax stats refresh on & off
     836         */
     837        togglePeriodicStatsRefresh: function(state) {
     838                var tr = this;
     839                if (state && this._periodic_stats_refresh == null) {
     840                        // sanity check
     841                        if( !this[Prefs._SessionRefreshRate] )
     842                             this[Prefs._SessionRefreshRate] = 5;
     843                        remote = this.remote;
     844                        this._periodic_stats_refresh = setInterval(
     845                                function(){ tr.loadDaemonStats(); }, this[Prefs._SessionRefreshRate] * 1000
     846                        );
     847                } else {
     848                        clearInterval(this._periodic_stats_refresh);
     849                        this._periodic_stats_refresh = null;
     850                }
     851        },
     852
    820853        toggleTurtleClicked: function() {
    821854                // Toggle the value
    822855                this[Prefs._TurtleState] = !this[Prefs._TurtleState];
    Transmission.prototype = 
    922955                this.updateTurtleButton();
    923956        },
    924957
     958        showStatsDialog: function( ) {
     959                this.loadDaemonStats();
     960                $('body').addClass('stats_showing');
     961                $('#stats_container').show();
     962                this.hideiPhoneAddressbar();
     963                if( Safari3 )
     964                        setTimeout("$('div#stats_container div.dialog_window').css('top', '0px');",10);
     965                this.updateButtonStates( );
     966                this.togglePeriodicStatsRefresh(true);
     967        },
     968
     969        hideStatsDialog: function( ){
     970                $('body.stats_showing').removeClass('stats_showing');
     971                if (iPhone) {
     972                        this.hideiPhoneAddressbar();
     973                        $('#stats_container').hide();
     974                } else if (Safari3) {
     975                        $('div#stats_container div.dialog_window').css('top', '-425px');
     976                        setTimeout("$('#stats_container').hide();",500);
     977                } else {
     978                        $('#stats_container').hide();
     979                }
     980                this.updateButtonStates( );
     981                this.togglePeriodicStatsRefresh(false);
     982        },
     983
     984        /*
     985         * Process got some new session stats from the server
     986         */
     987        updateStats: function( stats )
     988        {
     989                // can't think of a reason to remember this
     990                //this._stats = stats;
     991
     992                var session = stats["current-stats"];
     993                var total = stats["cumulative-stats"];
     994
     995                setInnerHTML( $('#stats_session_uploaded')[0], Math.formatBytes(session["uploadedBytes"]) );
     996                setInnerHTML( $('#stats_session_downloaded')[0], Math.formatBytes(session["downloadedBytes"]) );
     997                setInnerHTML( $('#stats_session_ratio')[0], Math.ratio(session["uploadedBytes"],session["downloadedBytes"]));
     998                setInnerHTML( $('#stats_session_duration')[0], Math.formatSeconds(session["secondsActive"]) );
     999                setInnerHTML( $('#stats_total_count')[0], total["sessionCount"] + " times" );
     1000                setInnerHTML( $('#stats_total_uploaded')[0], Math.formatBytes(total["uploadedBytes"]) );
     1001                setInnerHTML( $('#stats_total_downloaded')[0], Math.formatBytes(total["downloadedBytes"]) );
     1002                setInnerHTML( $('#stats_total_ratio')[0], Math.ratio(total["uploadedBytes"],total["downloadedBytes"]));
     1003                setInnerHTML( $('#stats_total_duration')[0], Math.formatSeconds(total["secondsActive"]) );
     1004        },
     1005
    9251006        setSearch: function( search ) {
    9261007                this._current_search = search ? search.trim() : null;
    9271008                this.refilter( );
    Transmission.prototype = 
    9541035                                        $('div#prefs_container h2.dialog_heading').show();
    9551036                                        tr.showPrefsDialog( );
    9561037                                }
     1038                                else if ($element[0].id == 'statistics') {
     1039                                        $('div#stats_container div#stats_error').hide();
     1040                                        $('div#stats_container h2.dialog_heading').show();
     1041                                        tr.showStatsDialog( );
     1042                                }
    9571043                                break;
    9581044                       
    9591045                        // Limit the download rate
  • web/javascript/transmission.remote.js

    diff --git web/javascript/transmission.remote.js web/javascript/transmission.remote.js
    index 6ff1f59..2fa1a35 100644
    TransmissionRemote.prototype = 
    108108                this.sendRequest( o, callback, async );
    109109        },
    110110
     111        loadDaemonStats: function( callback, async ) {
     112                var tr = this._controller;
     113                var o = { method: 'session-stats' };
     114                this.sendRequest( o, callback, async );
     115        },
     116
    111117        getInitialDataFor: function(torrent_ids, callback) {
    112118                var o = {
    113119                        method: 'torrent-get',
  • web/stylesheets/common.css

    diff --git web/stylesheets/common.css web/stylesheets/common.css
    index 8ffacce..d2a130f 100644
    div#prefs_container div.dialog_window { 
    894894        padding: 0 15px;
    895895}
    896896
     897div#stats_container div.dialog_window {
     898        width: 230px;
     899        padding: 0 15px;
     900}
     901
    897902div.dialog_container div.dialog_window img {
    898903        margin: 20px 20px 0 20px;
    899904        float: left;
    div#prefs_container div#prefs_tabs ul li { 
    10861091        background: none;
    10871092        border-bottom: 1px solid #efefef;
    10881093}
     1094div#stats_container h2.dialog_heading {
     1095        display: none;
     1096}
     1097div#stats_container div#stats_error {
     1098        display: none;
     1099        width: 395px;
     1100        margin: 6px auto 6px auto;
     1101        padding: 3px 0 3px 0;
     1102        border: 2px solid #cc3333;
     1103        color: #cc3333;
     1104        font-size: 1.2em;
     1105        vertical-align: middle;
     1106        text-align: center;
     1107        height: 20px;
     1108        line-height: 20px;
     1109        background-color: #FFEFEF;
     1110}
     1111.stats_info_container {
     1112        clear: both;
     1113        padding: 0px 7px 0px 7px;
     1114}
     1115.stats_group {
     1116        display: table;
     1117        margin: 5px 0px 0px 0px;
     1118        padding: 5px 0px 0px 0px;
     1119        width: 100%;
     1120}
     1121.stats_row {
     1122        display: table-row;
     1123}
     1124.stats_row > div {
     1125        padding-top: 4px;
     1126}
     1127div#stats_container label.category {
     1128        clear: both;
     1129        font-size: 1.2em;
     1130        margin: 5px 0px;
     1131}
     1132div#stats_container div.item {
     1133        font-size: 11px !important;
     1134        margin: 0 5px 0 20px;
     1135        float: left;
     1136        width: 100px;
     1137}
     1138div#stats_container div.item2 {
     1139        font-size: 11px !important;
     1140        margin: 0 5px 0 20px;
     1141        float: left;
     1142}
     1143div#stats_container a {
     1144        clear: left;
     1145        margin: 10px 5px 10px 7px;
     1146}
     1147
    10891148div.dialog_container div#prefs_tabs ul li.prefs_tab_disabled:hover,
    10901149div.dialog_container div#prefs_tabs ul li.prefs_tab_disabled:active {
    10911150        background: none;