Changeset 14518


Ignore:
Timestamp:
Apr 30, 2015, 5:20:48 AM (6 years ago)
Author:
mikedld
Message:

#4866: Replace existing menus with jQueryUI menu

Location:
trunk/web
Files:
2 added
2 deleted
10 edited

Legend:

Unmodified
Added
Removed
  • trunk/web/index.html

    r14516 r14518  
    1212                <script type="text/javascript" src="./javascript/jquery/jquery-migrate.min.js"></script>
    1313                <script type="text/javascript" src="./javascript/jquery/jquery-ui.min.js"></script>
     14                <script type="text/javascript" src="./javascript/jquery/jquery.ui-contextmenu.min.js"></script>
    1415                <link rel="stylesheet" href="./style/jqueryui/jquery-ui.min.css" type="text/css" media="all" />
    1516<!--
     
    2223                <![endif]-->
    2324                <script type="text/javascript" src="./javascript/jquery/jquery.transmenu.min.js"></script>
    24                 <script type="text/javascript" src="./javascript/jquery/jquery.contextmenu.min.js"></script>
    2525                <script type="text/javascript" src="./javascript/jquery/json2.min.js"></script>
    2626                <script type="text/javascript" src="./javascript/common.js"></script>
     
    335335
    336336                <div class="torrent_footer">
    337                         <ul id="settings_menu" title="Settings Menu">
    338                                 <li id="button">&nbsp;
    339                                         <ul id="footer_super_menu">
    340                                                 <li id="about-button">About</li>
    341                                                 <li class="separator"></li>
    342                                                 <li id="homepage">Transmission Homepage</li>
    343                                                 <li id="tipjar">Transmission Tip Jar</li>
    344                                                 <li class="separator"></li>
    345                                                 <li id="statistics">Statistics</li>
    346                                                 <li class="ui-helper-hidden" id="toggle_notifications">Notifcations</li>
    347                                                 <li class="separator"></li>
    348                                                 <li>Total Download Rate
    349                                                         <ul id="footer_download_rate_menu">
    350                                                                 <li id="unlimited_download_rate">Unlimited</li>
    351                                                                 <li id="limited_download_rate">Limit (10 kB/s)</li>
    352                                                                 <li class="separator"></li>
    353                                                                 <li class='download-speed'>5 kB/s</li>
    354                                                                 <li class='download-speed'>10 kB/s</li>
    355                                                                 <li class='download-speed'>20 kB/s</li>
    356                                                                 <li class='download-speed'>30 kB/s</li>
    357                                                                 <li class='download-speed'>40 kB/s</li>
    358                                                                 <li class='download-speed'>50 kB/s</li>
    359                                                                 <li class='download-speed'>75 kB/s</li>
    360                                                                 <li class='download-speed'>100 kB/s</li>
    361                                                                 <li class='download-speed'>150 kB/s</li>
    362                                                                 <li class='download-speed'>200 kB/s</li>
    363                                                                 <li class='download-speed'>250 kB/s</li>
    364                                                                 <li class='download-speed'>500 kB/s</li>
    365                                                                 <li class='download-speed'>750 kB/s</li>
    366                                                         </ul>
    367                                                 </li>
    368                                                 <li>Total Upload Rate
    369                                                         <ul id="footer_upload_rate_menu">
    370                                                                 <li id="unlimited_upload_rate">Unlimited</li>
    371                                                                 <li id="limited_upload_rate">Limit (10 kB/s)</li>
    372                                                                 <li class="separator"></li>
    373                                                                 <li class='upload-speed'>5 kB/s</li>
    374                                                                 <li class='upload-speed'>10 kB/s</li>
    375                                                                 <li class='upload-speed'>20 kB/s</li>
    376                                                                 <li class='upload-speed'>30 kB/s</li>
    377                                                                 <li class='upload-speed'>40 kB/s</li>
    378                                                                 <li class='upload-speed'>50 kB/s</li>
    379                                                                 <li class='upload-speed'>75 kB/s</li>
    380                                                                 <li class='upload-speed'>100 kB/s</li>
    381                                                                 <li class='upload-speed'>150 kB/s</li>
    382                                                                 <li class='upload-speed'>200 kB/s</li>
    383                                                                 <li class='upload-speed'>250 kB/s</li>
    384                                                                 <li class='upload-speed'>500 kB/s</li>
    385                                                                 <li class='upload-speed'>750 kB/s</li>
    386                                                         </ul>
    387                                                 </li>
    388                                                 <li class="separator"></li>
    389                                                 <li>Sort Transfers By
    390                                                         <ul id="footer_sort_menu">
    391                                                                 <li class='sort-mode' id="sort_by_queue_order">Queue Order</li>
    392                                                                 <li class='sort-mode' id="sort_by_activity">Activity</li>
    393                                                                 <li class='sort-mode' id="sort_by_age">Age</li>
    394                                                                 <li class='sort-mode' id="sort_by_name">Name</li>
    395                                                                 <li class='sort-mode' id="sort_by_percent_completed">Progress</li>
    396                                                                 <li class='sort-mode' id="sort_by_ratio">Ratio</li>
    397                                                                 <li class='sort-mode' id="sort_by_size">Size</li>
    398                                                                 <li class='sort-mode' id="sort_by_state">State</li>
    399                                                                 <li class="separator"></li>
    400                                                                 <li id="reverse_sort_order">Reverse Sort Order</li>
    401                                                         </ul>
    402                                                 </li>
     337                        <div id="settings_menu" title="Settings Menu">&nbsp;</div>
     338                        <div id="prefs-button" title="Edit Preferences
">&nbsp;</div>
     339                        <div id="turtle-button" title="Alternative Speed Limits">&nbsp;</div>
     340                        <div id="compact-button" title="Compact View">&nbsp;</div>
     341
     342                        <ul class="ui-helper-hidden" id="footer_super_menu">
     343                                <li id="about-button">About</li>
     344                                <li>---</li>
     345                                <li id="homepage">Transmission Homepage</li>
     346                                <li id="tipjar">Transmission Tip Jar</li>
     347                                <li>---</li>
     348                                <li id="statistics">Statistics</li>
     349                                <!--
     350                                <li id="toggle_notifications">Notifcations</li>
     351                                -->
     352                                <li>---</li>
     353                                <li>Total Download Rate
     354                                        <ul id="footer_download_rate_menu">
     355                                                <li radio-group="download-rate" id="unlimited_download_rate"><span class='ui-icon ui-icon-bullet'></span>Unlimited</li>
     356                                                <li radio-group="download-rate" id="limited_download_rate">Limit (10 kB/s)</li>
     357                                                <li>---</li>
     358                                                <li class='download-speed'>5 kB/s</li>
     359                                                <li class='download-speed'>10 kB/s</li>
     360                                                <li class='download-speed'>20 kB/s</li>
     361                                                <li class='download-speed'>30 kB/s</li>
     362                                                <li class='download-speed'>40 kB/s</li>
     363                                                <li class='download-speed'>50 kB/s</li>
     364                                                <li class='download-speed'>75 kB/s</li>
     365                                                <li class='download-speed'>100 kB/s</li>
     366                                                <li class='download-speed'>150 kB/s</li>
     367                                                <li class='download-speed'>200 kB/s</li>
     368                                                <li class='download-speed'>250 kB/s</li>
     369                                                <li class='download-speed'>500 kB/s</li>
     370                                                <li class='download-speed'>750 kB/s</li>
     371                                        </ul>
     372                                </li>
     373                                <li>Total Upload Rate
     374                                        <ul id="footer_upload_rate_menu">
     375                                                <li radio-group="upload-rate" id="unlimited_upload_rate"><span class='ui-icon ui-icon-bullet'></span>Unlimited</li>
     376                                                <li radio-group="upload-rate" id="limited_upload_rate">Limit (10 kB/s)</li>
     377                                                <li>---</li>
     378                                                <li class='upload-speed'>5 kB/s</li>
     379                                                <li class='upload-speed'>10 kB/s</li>
     380                                                <li class='upload-speed'>20 kB/s</li>
     381                                                <li class='upload-speed'>30 kB/s</li>
     382                                                <li class='upload-speed'>40 kB/s</li>
     383                                                <li class='upload-speed'>50 kB/s</li>
     384                                                <li class='upload-speed'>75 kB/s</li>
     385                                                <li class='upload-speed'>100 kB/s</li>
     386                                                <li class='upload-speed'>150 kB/s</li>
     387                                                <li class='upload-speed'>200 kB/s</li>
     388                                                <li class='upload-speed'>250 kB/s</li>
     389                                                <li class='upload-speed'>500 kB/s</li>
     390                                                <li class='upload-speed'>750 kB/s</li>
     391                                        </ul>
     392                                </li>
     393                                <li>---</li>
     394                                <li>Sort Transfers By
     395                                        <ul id="footer_sort_menu">
     396                                                <li radio-group="sort-mode" id="sort_by_queue_order">Queue Order</li>
     397                                                <li radio-group="sort-mode" id="sort_by_activity">Activity</li>
     398                                                <li radio-group="sort-mode" id="sort_by_age">Age</li>
     399                                                <li radio-group="sort-mode" id="sort_by_name">Name</li>
     400                                                <li radio-group="sort-mode" id="sort_by_percent_completed">Progress</li>
     401                                                <li radio-group="sort-mode" id="sort_by_ratio">Ratio</li>
     402                                                <li radio-group="sort-mode" id="sort_by_size">Size</li>
     403                                                <li radio-group="sort-mode" id="sort_by_state">State</li>
     404                                                <li>---</li>
     405                                                <li id="reverse_sort_order">Reverse Sort Order</li>
    403406                                        </ul>
    404407                                </li>
    405408                        </ul>
    406                         <div id="prefs-button" title="Edit Preferences
">&nbsp;</div>
    407                         <div id="turtle-button" title="Alternative Speed Limits">&nbsp;</div>
    408                         <div id="compact-button" title="Compact View">&nbsp;</div>
    409                 </div>
    410 
    411                 <div class="contextMenu" id="torrent_context_menu">
    412                         <ul>
    413                                 <li id="context_pause_selected" class="disabled context_pause_selected">Pause</li>
    414                                 <li id="context_resume_selected" class="disabled context_resume_selected">Resume</li>
    415                                 <li id="context_resume_now_selected" class="disabled context_resume_selected">Resume Now</li>
    416                                 <li class="separator"></li>
    417                                 <li id="context_move_top">Move to Top</li>
    418                                 <li id="context_move_up">Move Up</li>
    419                                 <li id="context_move_down">Move Down</li>
    420                                 <li id="context_move_bottom">Move to Bottom</li>
    421                                 <li class="separator"></li>
    422                                 <li id="context_remove">Remove From List
</li>
    423                                 <li id="context_removedata">Trash Data and Remove From List
</li>
    424                                 <li class="separator"></li>
    425                                 <li id="context_verify">Verify Local Data</li>
    426                                 <li id="context_move">Set Location
</li>
    427                                 <li id="context_rename">Rename
</li>
    428                                 <li class="separator"></li>
    429                                 <li id="context_reannounce">Ask tracker for more peers</li>
    430                                 <li class="separator"></li>
    431                                 <li id="context_select_all">Select All</li>
    432                                 <li id="context_deselect_all">Deselect All</li>
    433                         </ul>
    434                 </div>
     409                </div>
     410
     411                <ul class="ui-helper-hidden" id="torrent_context_menu">
     412                        <li data-command="pause_selected">Pause</li>
     413                        <li data-command="resume_selected">Resume</li>
     414                        <li data-command="resume_now_selected">Resume Now</li>
     415                        <li>---</li>
     416                        <li data-command="move_top">Move to Top</li>
     417                        <li data-command="move_up">Move Up</li>
     418                        <li data-command="move_down">Move Down</li>
     419                        <li data-command="move_bottom">Move to Bottom</li>
     420                        <li>---</li>
     421                        <li data-command="remove">Remove From List
</li>
     422                        <li data-command="remove_data">Trash Data and Remove From List
</li>
     423                        <li>---</li>
     424                        <li data-command="verify">Verify Local Data</li>
     425                        <li data-command="move">Set Location
</li>
     426                        <li data-command="rename">Rename
</li>
     427                        <li>---</li>
     428                        <li data-command="reannounce">Ask tracker for more peers</li>
     429                        <li>---</li>
     430                        <li data-command="select_all">Select All</li>
     431                        <li data-command="deselect_all">Deselect All</li>
     432                </ul>
    435433
    436434                <iframe name="torrent_upload_frame" id="torrent_upload_frame" src="about:blank" ></iframe>
  • trunk/web/javascript/common.js

    r13768 r14518  
    6565        } else {
    6666                // Fix for non-Safari-3 browsers: dark borders to replace shadows.
    67                 // Opera messes up the menu if we use a border on .trans_menu
    68                 // div.outerbox so use ul instead
    69                 $('.trans_menu ul, div#jqContextMenu, div.dialog_container div.dialog_window').css('border', '1px solid #777');
    70                 // and this kills the border we used to have
    71                 $('.trans_menu div.outerbox').css('border', 'none');
     67                $('div.dialog_container div.dialog_window').css('border', '1px solid #777');
    7268        }
    7369
  • trunk/web/javascript/jquery/Makefile.am

    r14506 r14518  
    55  jquery-migrate.min.js \
    66  jquery.min.js \
    7   jquery.contextmenu.min.js \
     7  jquery.ui-contextmenu.min.js \
    88  jquery.transmenu.min.js \
    99  json2.min.js
  • trunk/web/javascript/jquery/jquery.transmenu.js

    r12818 r14518  
    1 /* transMenu - v0.1.5 (2007-07-07)
    2  * Copyright (c) 2007 Roman Weich
    3  * http://p.sohei.org
     1/*
     2 * This file Copyright (C) 2015 Mnemosyne LLC
    43 *
     4 * It may be used under the GNU GPL versions 2 or 3
     5 * or any future license endorsed by Mnemosyne LLC.
    56 */
     7
     8$.widget('tr.transMenu', $.ui.menu, {
     9        options: {
     10                open: null,
     11                close: null
     12        },
     13
     14        _create: function() {
     15                this.selectImpl = this.options.select;
     16                this.options.select = $.proxy(this._select, this);
     17                this.element.hide();
     18                this._superApply(arguments);
     19        },
     20
     21        _select: function(event, ui) {
     22                if (ui.item.is("[aria-haspopup='true']"))
     23                        return;
     24                ui.id = ui.item.attr("id");
     25                ui.group = ui.item.attr("radio-group");
     26                ui.target = $(event.currentTarget);
     27                if (this.selectImpl(event, ui) !== false)
     28                        this.close();
     29        },
     30
     31        open: function(event) {
     32                this.element.show();
     33                this.element.css({ position: "absolute", left: 4, top: -this.element.height() - 4 });
     34
     35                $(document).bind("keydown" + this.eventNamespace, $.proxy(function(event) {
     36                        if (event.which === $.ui.keyCode.ESCAPE)
     37                                this.close();
     38                }, this));
     39                $(document).bind("mousedown" + this.eventNamespace + " touchstart" + this.eventNamespace, $.proxy(function(event) {
     40                        if (!$(event.target).closest(".ui-menu-item").length)
     41                                this.close();
     42                }, this));
     43
     44                this._trigger("open", event);
     45        },
     46
     47        close: function(event) {
     48                $(document).unbind("keydown" + this.eventNamespace);
     49                $(document).unbind("mousedown" + this.eventNamespace);
     50                $(document).unbind("touchstart" + this.eventNamespace);
     51
     52                this._close(this.element);
     53                this.element.hide();
     54
     55                this._trigger("close", event);
     56        }
     57});
    658
    759(function($)
    860{
    9         var defaults = {
    10                 onClick: function(){
    11                         $(this).find('>a').each(function(){
    12                                 if ( this.href )
    13                                 {
    14                                         window.location = this.href;
    15                                 }
    16                         });
    17                 },
    18                 arrow_char: '&#x25BA;',
    19                 selected_char: '&#x2713;',
    20                 subDelay: 300,
    21                 direction: 'down',
    22                 mainDelay: 10
    23         };
    24        
    25         var transMenuSettings;
     61        function indicatorClass(type)
     62        {
     63                return ['ui-icon', 'ui-icon-' + type];
     64        }
    2665
    27         $.fn.transMenu = function(options)
     66        function findIndicator(item, type)
    2867        {
    29                 var shown = false;
    30                 var liOffset = 2;
     68                return $(item).find('span.' + indicatorClass(type).join('.'));
     69        }
    3170
    32                 transMenuSettings = $.extend({}, defaults, options);
     71        function createIndicator(item, type)
     72        {
     73                $(item).prepend($("<span class='" + indicatorClass(type).join(' ') + "'></span>"));
     74        }
    3375
    34                 var hideDIV = function(div, delay) {
    35                         //a timer running to show the div?
    36                         if ( div.timer && !div.isVisible ) {
    37                                 clearTimeout(div.timer);
    38                         } else if (div.timer) {
    39                                 return; //hide-timer already running
    40                         }
    41                         if ( div.isVisible ) {
    42                                 div.timer = setTimeout( function() {
    43                                         //remove events
    44                                         $(div).find('ul li').unbind('mouseover', liHoverIn).unbind('mouseout', liHoverOut).unbind('click', transMenuSettings.onClick);
    45                                         $(div).hide();
    46                                         div.isVisible = false;
    47                                         div.timer = null;
    48                                 }, delay);
    49                         }
    50                 };
     76        function indicatorType(item)
     77        {
     78                var group = item.attr('radio-group');
     79                return { type: group !== undefined ? 'bullet' : 'check', group: group };
     80        }
    5181
    52                 var showDIV = function(div, delay) {
    53                         if ( div.timer ) {
    54                                 clearTimeout(div.timer);
    55                         }
    56                         if ( !div.isVisible ) {
    57                                 div.timer = setTimeout( function() {
    58                                         //check if the mouse is still over the parent item - if not dont show the submenu
    59                                         if (! $(div).parent().is('.hover')) {
    60                                                 return;
    61                                         }
    62                                         //assign events to all div>ul>li-elements
    63                                         $(div).find('ul li').mouseover(liHoverIn).mouseout(liHoverOut).click(transMenuSettings.onClick);
    64                                         //positioning
    65                                         if (! $(div).parent().is('.main')) {
    66                                                 $(div).css('left', $(div).parent().parent().width() - liOffset);
    67                                         }
    68                                        
    69                                         if (transMenuSettings.direction == 'up') {
    70                                                 $(div).css('top', ($(div).height() * -1) + $(div).parent().parent().height());
    71                                         }
    72                                        
    73                                         div.isVisible = true; //we use this over :visible to speed up traversing
    74                                         $(div).show();
    75                                         div.timer = null;
    76                                 }, delay);
    77                         }
    78                 };
    79 
    80                 //same as hover.handlehover in jquery - just can't use hover() directly - need the ability to unbind only the one hover event
    81                 var testHandleHover = function(e) {
    82                         // Check if mouse(over|out) are still within the same parent element
    83                         var p = (e.type == "mouseover" ? e.fromElement : e.toElement) || e.relatedTarget;
    84                         // Traverse up the tree
    85                         while ( p && p != this ) {
    86                                 try {
    87                                         p = p.parentNode;
    88                                 } catch(e) {
    89                                         p = this;
    90                                 }
    91                         }
    92                         // If we actually just moused on to a sub-element, ignore it
    93                         if ( p == this ) {
    94                                 return false;
    95                         }
    96                         return true;
    97                 };
    98                
    99                 var mainHoverIn = function(e) {
    100                         $(this).addClass('hover').siblings('li.hover').removeClass('hover');
    101                         if ( shown ) {
    102                                 hoverIn(this, transMenuSettings.mainDelay);
    103                         }
    104                 };
    105 
    106                 var liHoverIn = function(e) {
    107                         if ( !testHandleHover(e) ) {
    108                                 return false;
    109                         }
    110                         if ( e.target != this ) {
    111                                 //look whether the target is a direct child of this (maybe an image)
    112                                 if ( !isChild(this, e.target) ) {
    113                                         return;
    114                                 }
    115                         }
    116                         hoverIn(this, transMenuSettings.subDelay);
    117                 };
    118 
    119                 var hoverIn = function(li, delay) {
    120                         //stop running timers from the other menus on the same level - a little faster than $('>*>div', li.parentNode)
    121                         var n = li.parentNode.firstChild;
    122                         for ( ; n; n = n.nextSibling ) {
    123                                 if ( n.nodeType == 1 && n.nodeName.toUpperCase() == 'LI' ) {
    124                                         var div = getOneChild(n, 'DIV');
    125                                         //clear show-div timer
    126                                         if ( div && div.timer && !div.isVisible ) {
    127                                                 clearTimeout(div.timer);
    128                                                 div.timer = null;
    129                                         }
    130                                 }
    131                         }
    132                         //is there a timer running to hide one of the parent divs? stop it
    133                         var pNode = li.parentNode;
    134                         for ( ; pNode; pNode = pNode.parentNode ) {
    135                                 if ( pNode.nodeType == 1 && pNode.nodeName.toUpperCase() == 'DIV' ) {
    136                                         if (pNode.timer) {
    137                                                 clearTimeout(pNode.timer);
    138                                                 pNode.timer = null;
    139                                                 $(pNode.parentNode).addClass('hover');
    140                                         }
    141                                 }
    142                         }
    143                         //highlight the current element
    144                         $(li).addClass('hover');
    145                         var innerDiv = $(li).children('div');
    146                         innerDiv = innerDiv.length ? innerDiv[0] : null;
    147                         //is the submenu already visible?
    148                         if ( innerDiv && innerDiv.isVisible ) {
    149                                 //hide-timer running?
    150                                 if ( innerDiv.timer ) {
    151                                         clearTimeout(innerDiv.timer);
    152                                         innerDiv.timer = null;
    153                                 } else {
    154                                         return;
    155                                 }
    156                         }
    157                         //hide all open menus on the same level and below and unhighlight the li item (but not the current submenu!)
    158                         $(li.parentNode.getElementsByTagName('DIV')).each( function() {
    159                                 if ( this != innerDiv && this.isVisible ) {
    160                                         hideDIV(this, delay);
    161                                         $(this.parentNode).removeClass('hover');
    162                                 }
    163                         });
    164                         //show the submenu, if there is one
    165                         if ( innerDiv ) {
    166                                 showDIV(innerDiv, delay);
    167                         }
    168                 };
    169 
    170                 var liHoverOut = function(e) {
    171                         if ( !testHandleHover(e) ) {
    172                                 return false;
    173                         }
    174                         if ( e.target != this ) {
    175                                 //return only if the target is no direct child of this
    176                                 if ( !isChild(this, e.target) )  {
    177                                         return;
    178                                 }
    179                         }
    180                         // Remove the hover from the submenu item, if the mouse is hovering out of the
    181                         // menu (this is only for the last open (levelwise) (sub-)menu)
    182                         var div = getOneChild(this, 'DIV');
    183                         if ( !div ) {
    184                                 $(this).removeClass('hover');
    185                         } else  {
    186                                 if ( !div.isVisible ) {
    187                                         $(this).removeClass('hover');
    188                                 }
    189                         }
    190                 };
    191 
    192                 var mainHoverOut = function(e) {
    193                         //no need to test e.target==this, as no child has the same event bound
    194                         var div = getOneChild(this, 'DIV');
    195                         var relTarget = e.relatedTarget || e.toElement; //this is undefined sometimes (e.g. when the mouse moves out of the window), so dont remove hover then
    196                         var p;
    197                         if ( !shown ) {
    198                                 $(this).removeClass('hover');
    199                                
    200                         //menuitem has no submenu, so dont remove the hover if the mouse goes outside the menu 
    201                         } else if ( !div && relTarget ) {
    202                                 p = $(e.target).parents('UL.trans_menu');
    203                                 if ( p.contains(relTarget)) {
    204                                         $(this).removeClass('hover');
    205                                 }
    206                         } else if ( relTarget ) {
    207                                 //remove hover only when moving to anywhere inside the trans_menu
    208                                 p = $(e.target).parents('UL.trans_menu');
    209                                 if ( !div.isVisible && (p.contains(relTarget)) ) {
    210                                         $(this).removeClass('hover');
    211                                 }
    212                         }
    213                 };
    214 
    215                 var mainClick = function() {
    216                         var div = getOneChild(this, 'DIV');
    217                         //clicked on an open main-menu-item
    218                         if ( div && div.isVisible ) {
    219                                 clean();
    220                                 $(this).addClass('hover');
    221                         } else {
    222                                 hoverIn(this, transMenuSettings.mainDelay);
    223                                 shown = true;
    224                                 $('ul.trans_menu li').addClass('active');
    225                                 $(document).bind('mousedown', checkMouse);
    226                         }
    227                 };
    228 
    229                 var checkMouse = function(e) {
    230                         //is the mouse inside a trans_menu? if yes, is it an open (the current) one?
    231                         var vis = false;
    232                         $(e.target).parents('UL.trans_menu').find('div').each( function(){
    233                                 if ( this.isVisible ) {
    234                                         vis = true;
    235                                 }
    236                         });
    237                         if ( !vis ) {
    238                                 clean();
    239                         }
    240                 };
    241 
    242                 var clean = function() {
    243                         //remove timeout and hide the divs
    244                         $('ul.trans_menu div.outerbox').each(function(){
    245                                 if ( this.timer ) {
    246                                         clearTimeout(this.timer);
    247                                         this.timer = null;
    248                                 }
    249                                 if ( this.isVisible ) {
    250                                         $(this).hide();
    251                                         this.isVisible = false;
    252                                 }
    253                         });
    254                         $('ul.trans_menu li').removeClass('hover');
    255                         //remove events
    256                         $('ul.trans_menu>li li').unbind('mouseover', liHoverIn).unbind('mouseout', liHoverOut).unbind('click', transMenuSettings.onClick);
    257                         $(document).unbind('mousedown', checkMouse);
    258                         shown = false;
    259                         $('ul.trans_menu li').removeClass('active');
    260                 };
    261 
    262                 var getOneChild = function(elem, name) {
    263                         if ( !elem ) {
    264                                 return null;
    265                         }
    266                         var n = elem.firstChild;
    267                         for ( ; n; n = n.nextSibling )  {
    268                                 if ( n.nodeType == 1 && n.nodeName.toUpperCase() == name ) {
    269                                         return n;
    270                                 }
    271                         }
    272                         return null;
    273                 };
    274                
    275                 var isChild = function(elem, childElem) {
    276                         var n = elem.firstChild;
    277                         for ( ; n; n = n.nextSibling ) {
    278                                 if ( n == childElem ) {
    279                                         return true;
    280                                 }
    281                         }
    282                         return false;
    283                 };
    284 
    285             return this.each(function() {
    286                         //add .contains() to mozilla - http://www.quirksmode.org/blog/archives/2006/01/contains_for_mo.html
    287                         if (window.Node && Node.prototype && !Node.prototype.contains) {
    288                                 Node.prototype.contains = function(arg)  {
    289                                         return !!(this.compareDocumentPosition(arg) & 16);
    290                                 };
    291                         }
    292                         if (! $(this).is('.trans_menu')) {
    293                                 $(this).addClass('trans_menu');
    294                         }
    295                         //add shadows
    296                         $('ul', this).shadowBox();
    297                        
    298                         //assign events
    299                         $(this).bind('closemenu', function(){clean();}); //assign closemenu-event, through wich the menu can be closed from outside the plugin
    300                         //add click event handling, if there are any elements inside the main menu
    301                         var liElems = $(this).children('li');
    302                         for ( var j = 0; j < liElems.length; j++ ) {
    303                                 if ( getOneChild(getOneChild(getOneChild(liElems[j], 'DIV'), 'UL'), 'LI') ) {
    304                                         $(liElems[j]).click(mainClick);
    305                                 }
    306                         }
    307                         //add hover event handling and assign classes
    308                         $(liElems).hover(mainHoverIn, mainHoverOut).addClass('main').find('>div').addClass('inner');
    309                         //add the little arrow before each submenu
    310                         if ( transMenuSettings.arrow_char ) {
    311                                 var arrow_markup = $("<span class='arrow'>" + transMenuSettings.arrow_char + '</span>');
    312                                 // Mozilla float/position hack
    313                                 if ($.browser.mozilla && +$.browser.version.replace(/\./g,'').slice(0,3) < 191) {
    314                                         arrow_markup.css('margin-top', '-13px');
    315                                 }
    316                                 $('div.inner div.outerbox', this).before(arrow_markup);
    317                         }
    318 
    319                         //the floating list elements are destroying the layout..so make it nice again..
    320                         $(this).wrap('<div class="main_container"></div>').after('<div style="clear: both; visibility: hidden;"></div>');
    321             });
    322         };
    323        
    324         $.fn.transMenu.setDefaults = function(o) {
    325                 $.extend(defaults, o);
     82        $.fn.selectMenuItem = function() {
     83                var t = indicatorType(this);
     84                if (t.type == 'bullet')
     85                        this.parent().find('li[radio-group=' + t.group + '] span.' + indicatorClass(t.type).join('.')).remove();
     86                if (findIndicator(this, t.type).length == 0)
     87                        createIndicator(this, t.type);
     88                return this;
    32689        };
    32790
    328         $.fn.shadowBox = function() {
    329             return this.each(function() {
    330                         var outer = $('<div class="outerbox"></div>').get(0);
    331                         if ( $(this).css('position') == 'absolute' ) {
    332                                 //if the child(this) is positioned abolute, we have to use relative positioning and shrink the outerbox accordingly to the innerbox
    333                                 $(outer).css({position:'relative', width:this.offsetWidth, height:this.offsetHeight});
    334                         } else {
    335                                 //shrink the outerbox
    336                                 $(outer).css('position', 'absolute');
    337                         }
    338                         //add the boxes
    339                         $(this).addClass('innerBox').wrap(outer).
    340                                         before('<div class="shadowbox1"></div><div class="shadowbox2"></div><div class="shadowbox3"></div>');
    341             });
     91        $.fn.deselectMenuItem = function() {
     92                var t = indicatorType(this);
     93                return findIndicator(this, t.type).remove();
    34294        };
    343        
    344         $.fn.selectMenuItem = function() {
    345                 if (this.find('span.selected').length == 0) {
    346                         this.prepend($("<span class='selected'>" + transMenuSettings.selected_char + "</span>"));
    347                 }
    348             return this;
    349         };
    350        
    351         $.fn.deselectMenuItem = function() {
    352                 return this.find('span.selected').remove();
    353         };
    354        
     95
    35596        $.fn.menuItemIsSelected = function() {
    356                 return (this.find('span.selected').length > 0);
    357         };
    358        
    359         $.fn.deselectMenuSiblings = function() {
    360                 this.parent().find('span.selected').remove();
    361             this.selectMenuItem();
    362                 return this;
     97                return findIndicator(this, 'bullet').length > 0 || findIndicator(this, 'check').length > 0;
    36398        };
    36499})(jQuery);
  • trunk/web/javascript/jquery/jquery.transmenu.min.js

    r12830 r14518  
    1 (function(a){var b={onClick:function(){a(this).find(">a").each(function(){this.href&&(window.location=this.href)})},arrow_char:"&#x25BA;",selected_char:"&#x2713;",subDelay:300,direction:"down",mainDelay:10},c;a.fn.transMenu=function(d){var e=!1,f=2;c=a.extend({},b,d);var g=function(b,d){if(b.timer&&!b.isVisible)clearTimeout(b.timer);else if(b.timer)return;b.isVisible&&(b.timer=setTimeout(function(){a(b).find("ul li").unbind("mouseover",k).unbind("mouseout",m).unbind("click",c.onClick),a(b).hide(),b.isVisible=!1,b.timer=null},d))},h=function(b,d){b.timer&&clearTimeout(b.timer),b.isVisible||(b.timer=setTimeout(function(){if(!a(b).parent().is(".hover"))return;a(b).find("ul li").mouseover(k).mouseout(m).click(c.onClick),a(b).parent().is(".main")||a(b).css("left",a(b).parent().parent().width()-f),c.direction=="up"&&a(b).css("top",a(b).height()*-1+a(b).parent().parent().height()),b.isVisible=!0,a(b).show(),b.timer=null},d))},i=function(a){var b=(a.type=="mouseover"?a.fromElement:a.toElement)||a.relatedTarget;while(b&&b!=this)try{b=b.parentNode}catch(a){b=this}return b==this?!1:!0},j=function(b){a(this).addClass("hover").siblings("li.hover").removeClass("hover"),e&&l(this,c.mainDelay)},k=function(a){if(!i(a))return!1;if(a.target!=this&&!s(this,a.target))return;l(this,c.subDelay)},l=function(b,c){var d=b.parentNode.firstChild;for(;d;d=d.nextSibling)if(d.nodeType==1&&d.nodeName.toUpperCase()=="LI"){var e=r(d,"DIV");e&&e.timer&&!e.isVisible&&(clearTimeout(e.timer),e.timer=null)}var f=b.parentNode;for(;f;f=f.parentNode)f.nodeType==1&&f.nodeName.toUpperCase()=="DIV"&&f.timer&&(clearTimeout(f.timer),f.timer=null,a(f.parentNode).addClass("hover"));a(b).addClass("hover");var i=a(b).children("div");i=i.length?i[0]:null;if(i&&i.isVisible)if(i.timer)clearTimeout(i.timer),i.timer=null;else return;a(b.parentNode.getElementsByTagName("DIV")).each(function(){this!=i&&this.isVisible&&(g(this,c),a(this.parentNode).removeClass("hover"))}),i&&h(i,c)},m=function(b){if(!i(b))return!1;if(b.target!=this&&!s(this,b.target))return;var c=r(this,"DIV");c?c.isVisible||a(this).removeClass("hover"):a(this).removeClass("hover")},n=function(b){var c=r(this,"DIV"),d=b.relatedTarget||b.toElement,f;e?!c&&d?(f=a(b.target).parents("UL.trans_menu"),f.contains(d)&&a(this).removeClass("hover")):d&&(f=a(b.target).parents("UL.trans_menu"),!c.isVisible&&f.contains(d)&&a(this).removeClass("hover")):a(this).removeClass("hover")},o=function(){var b=r(this,"DIV");b&&b.isVisible?(q(),a(this).addClass("hover")):(l(this,c.mainDelay),e=!0,a("ul.trans_menu li").addClass("active"),a(document).bind("mousedown",p))},p=function(b){var c=!1;a(b.target).parents("UL.trans_menu").find("div").each(function(){this.isVisible&&(c=!0)}),c||q()},q=function(){a("ul.trans_menu div.outerbox").each(function(){this.timer&&(clearTimeout(this.timer),this.timer=null),this.isVisible&&(a(this).hide(),this.isVisible=!1)}),a("ul.trans_menu li").removeClass("hover"),a("ul.trans_menu>li li").unbind("mouseover",k).unbind("mouseout",m).unbind("click",c.onClick),a(document).unbind("mousedown",p),e=!1,a("ul.trans_menu li").removeClass("active")},r=function(a,b){if(!a)return null;var c=a.firstChild;for(;c;c=c.nextSibling)if(c.nodeType==1&&c.nodeName.toUpperCase()==b)return c;return null},s=function(a,b){var c=a.firstChild;for(;c;c=c.nextSibling)if(c==b)return!0;return!1};return this.each(function(){window.Node&&Node.prototype&&!Node.prototype.contains&&(Node.prototype.contains=function(a){return!!(this.compareDocumentPosition(a)&16)}),a(this).is(".trans_menu")||a(this).addClass("trans_menu"),a("ul",this).shadowBox(),a(this).bind("closemenu",function(){q()});var b=a(this).children("li");for(var d=0;d<b.length;d++)r(r(r(b[d],"DIV"),"UL"),"LI")&&a(b[d]).click(o);a(b).hover(j,n).addClass("main").find(">div").addClass("inner");if(c.arrow_char){var e=a("<span class='arrow'>"+c.arrow_char+"</span>");a.browser.mozilla&&+a.browser.version.replace(/\./g,"").slice(0,3)<191&&e.css("margin-top","-13px"),a("div.inner div.outerbox",this).before(e)}a(this).wrap('<div class="main_container"></div>').after('<div style="clear: both; visibility: hidden;"></div>')})},a.fn.transMenu.setDefaults=function(c){a.extend(b,c)},a.fn.shadowBox=function(){return this.each(function(){var b=a('<div class="outerbox"></div>').get(0);a(this).css("position")=="absolute"?a(b).css({position:"relative",width:this.offsetWidth,height:this.offsetHeight}):a(b).css("position","absolute"),a(this).addClass("innerBox").wrap(b).before('<div class="shadowbox1"></div><div class="shadowbox2"></div><div class="shadowbox3"></div>')})},a.fn.selectMenuItem=function(){return this.find("span.selected").length==0&&this.prepend(a("<span class='selected'>"+c.selected_char+"</span>")),this},a.fn.deselectMenuItem=function(){return this.find("span.selected").remove()},a.fn.menuItemIsSelected=function(){return this.find("span.selected").length>0},a.fn.deselectMenuSiblings=function(){return this.parent().find("span.selected").remove(),this.selectMenuItem(),this}})(jQuery)
     1$.widget("tr.transMenu",$.ui.menu,{options:{open:null,close:null},_create:function(){this.selectImpl=this.options.select,this.options.select=$.proxy(this._select,this),this.element.hide(),this._superApply(arguments)},_select:function(e,t){t.item.is("[aria-haspopup='true']")||(t.id=t.item.attr("id"),t.group=t.item.attr("radio-group"),t.target=$(e.currentTarget),this.selectImpl(e,t)!==!1&&this.close())},open:function(e){this.element.show(),this.element.css({position:"absolute",left:4,top:-this.element.height()-4}),$(document).bind("keydown"+this.eventNamespace,$.proxy(function(e){e.which===$.ui.keyCode.ESCAPE&&this.close()},this)),$(document).bind("mousedown"+this.eventNamespace+" touchstart"+this.eventNamespace,$.proxy(function(e){$(e.target).closest(".ui-menu-item").length||this.close()},this)),this._trigger("open",e)},close:function(e){$(document).unbind("keydown"+this.eventNamespace),$(document).unbind("mousedown"+this.eventNamespace),$(document).unbind("touchstart"+this.eventNamespace),this._close(this.element),this.element.hide(),this._trigger("close",e)}}),function($){function e(e){return["ui-icon","ui-icon-"+e]}function t(t,n){return $(t).find("span."+e(n).join("."))}function n(t,n){$(t).prepend($("<span class='"+e(n).join(" ")+"'></span>"))}function i(e){var t=e.attr("radio-group");return{type:void 0!==t?"bullet":"check",group:t}}$.fn.selectMenuItem=function(){var s=i(this);return"bullet"==s.type&&this.parent().find("li[radio-group="+s.group+"] span."+e(s.type).join(".")).remove(),0==t(this,s.type).length&&n(this,s.type),this},$.fn.deselectMenuItem=function(){var e=i(this);return t(this,e.type).remove()},$.fn.menuItemIsSelected=function(){return t(this,"bullet").length>0||t(this,"check").length>0}}(jQuery);
  • trunk/web/javascript/transmission.js

    r14511 r14518  
    181181                var tr = this;
    182182                var bindings = {
    183                         context_pause_selected:       function() { tr.stopSelectedTorrents(); },
    184                         context_resume_selected:      function() { tr.startSelectedTorrents(false); },
    185                         context_resume_now_selected:  function() { tr.startSelectedTorrents(true); },
    186                         context_move:                 function() { tr.moveSelectedTorrents(false); },
    187                         context_remove:               function() { tr.removeSelectedTorrents(); },
    188                         context_removedata:           function() { tr.removeSelectedTorrentsAndData(); },
    189                         context_verify:               function() { tr.verifySelectedTorrents(); },
    190                         context_rename:               function() { tr.renameSelectedTorrents(); },
    191                         context_reannounce:           function() { tr.reannounceSelectedTorrents(); },
    192                         context_move_top:             function() { tr.moveTop(); },
    193                         context_move_up:              function() { tr.moveUp(); },
    194                         context_move_down:            function() { tr.moveDown(); },
    195                         context_move_bottom:          function() { tr.moveBottom(); },
    196                         context_select_all:           function() { tr.selectAll(); },
    197                         context_deselect_all:         function() { tr.deselectAll(); }
     183                        pause_selected:       function() { tr.stopSelectedTorrents(); },
     184                        resume_selected:      function() { tr.startSelectedTorrents(false); },
     185                        resume_now_selected:  function() { tr.startSelectedTorrents(true); },
     186                        move:                 function() { tr.moveSelectedTorrents(false); },
     187                        remove:               function() { tr.removeSelectedTorrents(); },
     188                        remove_data:          function() { tr.removeSelectedTorrentsAndData(); },
     189                        verify:               function() { tr.verifySelectedTorrents(); },
     190                        rename:               function() { tr.renameSelectedTorrents(); },
     191                        reannounce:           function() { tr.reannounceSelectedTorrents(); },
     192                        move_top:             function() { tr.moveTop(); },
     193                        move_up:              function() { tr.moveUp(); },
     194                        move_down:            function() { tr.moveDown(); },
     195                        move_bottom:          function() { tr.moveBottom(); },
     196                        select_all:           function() { tr.selectAll(); },
     197                        deselect_all:         function() { tr.deselectAll(); }
    198198                };
    199199
    200200                // Set up the context menu
    201                 $('ul#torrent_list').contextMenu('torrent_context_menu', {
    202                         bindings:          bindings,
    203                         menuStyle:         { width: '310px', backgroundColor: '#fff', border: 'none', padding: '5px 0', textAlign: 'left' },
    204                         itemStyle:         { backgroundColor: 'transparent', margin: '0', padding: '3px 10px 3px 20px', color: '#000', cursor: 'default', border: 'none'},
    205                         itemHoverStyle:    { backgroundColor: '#24e', color: '#fff', border: 'none'},
    206                         shadow:            false,
    207                         boundingElement:   $('div#torrent_container'),
    208                         boundingRightPad:  20,
    209                         boundingBottomPad: 5,
    210                         onContextMenu: function(ev) {
    211                                 var element = $(ev.target).closest('.torrent')[0];
     201                $("ul#torrent_list").contextmenu({
     202                        delegate: ".torrent",
     203                        menu: "#torrent_context_menu",
     204                        preventSelect: true,
     205                        taphold: true,
     206                        show: { effect: "none" },
     207                        hide: { effect: "none" },
     208                        select: function(event, ui) { bindings[ui.cmd](); },
     209                        beforeOpen: $.proxy(function(event, ui) {
     210                                var element = $(event.currentTarget);
    212211                                var i = $('#torrent_list > li').index(element);
    213                                 if ((i!==-1) && !tr._rows[i].isSelected())
    214                                         tr.setSelectedRow(tr._rows[i]);
    215                                 return true;
    216                         }
     212                                if ((i!==-1) && !this._rows[i].isSelected())
     213                                        this.setSelectedRow(this._rows[i]);
     214
     215                                this.calculateTorrentStates(function(s) {
     216                                        var tl = $(event.target);
     217                                        tl.contextmenu("enableEntry", "pause_selected", s.activeSel > 0);
     218                                        tl.contextmenu("enableEntry", "resume_selected", s.pausedSel > 0);
     219                                        tl.contextmenu("enableEntry", "resume_now_selected", s.pausedSel > 0);
     220                                        tl.contextmenu("enableEntry", "rename", s.sel == 1);
     221                                });
     222                        }, this)
    217223                });
    218224        },
    219225
    220226        createSettingsMenu: function() {
    221                 $('#settings_menu').transMenu({
    222                         selected_char: '&#x2714;',
    223                         direction: 'up',
    224                         onClick: $.proxy(this.onMenuClicked,this)
     227                $("#footer_super_menu").transMenu({
     228                        open: function() { $("#settings_menu").addClass("selected"); },
     229                        close: function() { $("#settings_menu").removeClass("selected"); },
     230                        select: $.proxy(this.onMenuClicked, this)
    225231                });
    226 
    227                 $('#unlimited_download_rate').selectMenuItem();
    228                 $('#unlimited_upload_rate').selectMenuItem();
     232                $("#settings_menu").click(function(event) {
     233                        $("#footer_super_menu").transMenu("open");
     234                });
    229235        },
    230236
     
    651657        },
    652658
    653         onMenuClicked: function(ev)
     659        onMenuClicked: function(event, ui)
    654660        {
    655661                var o, dir,
    656                     id = ev.target.id,
     662                    id = ui.id,
    657663                    remote = this.remote,
    658                     element = $(ev.target);
    659 
    660                 if (element.hasClass('sort-mode'))
    661                 {
    662                         element.parent().find('.sort-mode').each(function() {
    663                                 element.parent().deselectMenuItem();
    664                         });
     664                    element = ui.target;
     665
     666                if (ui.group == 'sort-mode')
     667                {
    665668                        element.selectMenuItem();
    666669                        this.setSortMethod(id.replace(/sort_by_/, ''));
     
    669672                {
    670673                        o = {};
    671                         o[RPC._UpSpeedLimit] = parseInt(ev.target.innerHTML);
     674                        o[RPC._UpSpeedLimit] = parseInt(element.text());
    672675                        o[RPC._UpSpeedLimited] = true;
    673676                        remote.savePrefs(o);
     
    676679                {
    677680                        o = {};
    678                         o[RPC._DownSpeedLimit] = parseInt(ev.target.innerHTML);
     681                        o[RPC._DownSpeedLimit] = parseInt(element.text());
    679682                        o[RPC._DownSpeedLimited] = true;
    680683                        remote.savePrefs(o);
     
    748751
    749752                }
    750                 $('#settings_menu').trigger('closemenu');
    751                 ev.stopImmediatePropagation();
    752753        },
    753754
     
    860861                // which deselects all on click
    861862                ev.stopPropagation();
    862                 // but still hide the context menu if it is showing
    863                 $('#jqContextMenu').hide();
    864863
    865864                if (isMobileDevice) {
     
    12021201                var limit, limited, e, b, text,
    12031202                    fmt = Transmission.fmt,
    1204                     menu = $('#settings_menu');
     1203                    menu = $('#footer_super_menu');
    12051204
    12061205                this.serverVersion = o.version;
     
    12331232                        if (!limited)
    12341233                                e = menu.find('#unlimited_download_rate');
    1235                         e.deselectMenuSiblings().selectMenuItem();
     1234                        e.selectMenuItem();
    12361235                }
    12371236
     
    12471246                        if (!limited)
    12481247                                e = menu.find('#unlimited_upload_rate');
    1249                         e.deselectMenuSiblings().selectMenuItem();
     1248                        e.selectMenuItem();
    12501249                }
    12511250        },
     
    13191318        },
    13201319
    1321         updateButtonStates: function()
    1322         {
    1323                 var e = this.elements,
    1324                     haveActive = false,
    1325                     havePaused = false,
    1326                     haveSel = false,
    1327                     haveActiveSel = false,
    1328                     havePausedSel = false;
     1320        calculateTorrentStates: function(callback)
     1321        {
     1322                var stats = {
     1323                        total: 0,
     1324                        active: 0,
     1325                        paused: 0,
     1326                        sel: 0,
     1327                        activeSel: 0,
     1328                        pausedSel: 0
     1329                };
    13291330
    13301331                clearTimeout(this.buttonRefreshTimer);
     
    13341335                        var isStopped = row.getTorrent().isStopped();
    13351336                        var isSelected = row.isSelected();
    1336                         if (!isStopped) haveActive = true;
    1337                         if (isStopped) havePaused = true;
    1338                         if (isSelected) haveSel = true;
    1339                         if (isSelected && !isStopped) haveActiveSel = true;
    1340                         if (isSelected && isStopped) havePausedSel = true;
    1341                 }
    1342 
    1343                 this.setEnabled(e.toolbar_pause_button,  haveActiveSel);
    1344                 this.setEnabled(e.toolbar_start_button,  havePausedSel);
    1345                 this.setEnabled(e.toolbar_remove_button, haveSel);
     1337                        ++stats.total;
     1338                        if (!isStopped) ++stats.active;
     1339                        if (isStopped) ++stats.paused;
     1340                        if (isSelected) ++stats.sel;
     1341                        if (isSelected && !isStopped) ++stats.activeSel;
     1342                        if (isSelected && isStopped) ++stats.pausedSel;
     1343                }
     1344
     1345                callback(stats);
     1346        },
     1347
     1348        updateButtonStates: function()
     1349        {
     1350                var tr = this,
     1351                e = this.elements;
     1352                this.calculateTorrentStates(function(s) {
     1353                        tr.setEnabled(e.toolbar_pause_button, s.activeSel > 0);
     1354                        tr.setEnabled(e.toolbar_start_button, s.pausedSel > 0);
     1355                        tr.setEnabled(e.toolbar_remove_button, s.sel > 0);
     1356                });
    13461357        },
    13471358
  • trunk/web/style/transmission/common.css

    r14516 r14518  
    795795  background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    796796  background-image: linear-gradient(top, #dddddd, #bbbbbb); }
    797   div.torrent_footer > * {
     797  div.torrent_footer > div {
    798798    float: left;
    799799    margin: 2px 4px;
     
    805805    -moz-user-select: none;
    806806    -webkit-user-select: none; }
    807   div.torrent_footer div.main_container {
     807  div.torrent_footer #settings_menu {
    808808    -moz-border-radius: 5px;
    809809    border-radius: 5px;
     
    823823    background-position: center;
    824824    background-repeat: no-repeat; }
    825     div.torrent_footer div.main_container:active, div.torrent_footer div.main_container.selected {
     825    div.torrent_footer #settings_menu:active, div.torrent_footer #settings_menu.selected {
    826826      background-color: #e6e6ff;
    827827      background-image: url("images/settings.png");
     
    10801080*****
    10811081****/
    1082 .trans_menu {
    1083   margin: 0;
    1084   padding: 0; }
    1085 
    1086 .trans_menu,
    1087 .trans_menu ul {
    1088   list-style: none; }
    1089 
    1090 .trans_menu ul {
    1091   /* place it right above the button */
    1092   position: relative;
    1093   bottom: 18px;
    1094   min-width: 210px;
    1095   background-color: white;
    1096   padding: 5px 0;
     1082.ui-menu-item {
    10971083  text-align: left;
    1098   list-style: none;
    1099   -webkit-border-radius: 5px;
    1100   -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4); }
    1101 
    1102 .trans_menu ul ul {
    1103   min-width: 150px; }
    1104 
    1105 .trans_menu ul ul#footer_sort_menu {
    1106   min-width: 175px; }
    1107 
    1108 .trans_menu > * li {
    1109   margin: 0;
    1110   padding: 3px 10px 3px 20px !important;
    1111   color: #000;
    1112   cursor: default;
    1113   text-indent: auto !important;
    1114   width: inherit; }
    1115 
    1116 .trans_menu li.separator,
    1117 .trans_menu li.separator.hover {
    1118   border-top: 1px solid #ddd;
    1119   margin: 5px 0;
    1120   padding: 0px;
    1121   background: transparent; }
    1122 
    1123 .trans_menu li span.arrow {
    1124   float: right; }
    1125 
    1126 .trans_menu li.hover li.hover span.arrow, .trans_menu li.hover li.hover li.hover span.selected {
    1127   color: white; }
    1128 
    1129 .trans_menu span.selected {
    1130   margin: 0 3px 0 -15px;
    1131   color: #666;
    1132   float: left; }
    1133 
    1134 .trans_menu div.outerbox {
    1135   display: none;
    1136   background: transparent;
    1137   border: 1px solid rgba(0, 0, 0, 0.1);
    1138   -webkit-border-radius: 5px; }
    1139 
    1140 .trans_menu div.inner {
    1141   left: 0;
    1142   margin: 0; }
    1143 
    1144 .trans_menu li.main li {
    1145   z-index: 2;
    1146   min-width: 78px; }
    1147 
    1148 .trans_menu a {
    1149   text-decoration: none;
    1150   cursor: default; }
    1151 
    1152 /*--------------------------------------
    1153  *
    1154  * C O N T E X T   M E N U
    1155  *
    1156  *--------------------------------------*/
    1157 div#jqContextMenu {
    1158   -webkit-border-radius: 5px;
    1159   border: 1px solid rgba(0, 0, 0, 0.1);
    1160   -moz-user-select: none;
    1161   -webkit-user-select: none; }
    1162   div#jqContextMenu ul {
    1163     filter: alpha(opacity=98);
    1164     -moz-opacity: .98;
    1165     opacity: .98;
    1166     -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
    1167     -webkit-border-radius: 5px; }
    1168   div#jqContextMenu li.separator, div#jqContextMenu div#jqContextMenu li.separator:hover {
    1169     background: inherit !important;
    1170     border-top: 1px solid #ddd !important;
    1171     margin: 5px 0 !important;
    1172     padding: 0px; }
     1084  white-space: nowrap; }
     1085
     1086#torrent_context_menu,
     1087#footer_super_menu {
     1088  font-size: 1em;
     1089  z-index: 3; }
  • trunk/web/style/transmission/common.scss

    r14516 r14518  
    767767        @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom);
    768768
    769         > * {
     769        > div {
    770770                float: left;
    771771                margin: 2px 4px;
     
    784784        $active-color-bottom: $selected-gradient-bottom;
    785785
    786         div.main_container {
     786        #settings_menu {
    787787                @include roundedBox(5px);
    788788                @include buttonImage('images/settings.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
     
    956956****/
    957957
    958 .trans_menu {
    959         margin: 0;
    960         padding: 0;
    961 }
    962 
    963 .trans_menu,
    964 .trans_menu ul {
    965         list-style: none;
    966 }
    967 
    968 .trans_menu ul {
    969         /* place it right above the button */
    970         position: relative;
    971         bottom: 18px;
    972 
    973         min-width: 210px;
    974         background-color: white;
    975         padding: 5px 0;
     958.ui-menu-item {
    976959        text-align: left;
    977         list-style: none;
    978         -webkit-border-radius: 5px;
    979         -webkit-box-shadow: 0 10px 25px rgba(0,0,0,0.4);
    980 }
    981 
    982 .trans_menu ul ul {
    983         min-width: 150px;
    984 }
    985 
    986 .trans_menu ul ul#footer_sort_menu {
    987         min-width: 175px;
    988 }
    989 
    990 .trans_menu > * li {
    991         margin: 0;
    992         padding: 3px 10px 3px 20px !important;
    993         color: #000;
    994         cursor: default;
    995         text-indent: auto !important;
    996         width: inherit;
    997 }
    998 
    999 .trans_menu li.separator,
    1000 .trans_menu li.separator.hover {
    1001         border-top: 1px solid #ddd;
    1002         margin: 5px 0;
    1003         padding: 0px;
    1004         background: transparent;
    1005 }
    1006 
    1007 .trans_menu li span.arrow {
    1008         float: right;
    1009 }
    1010 
    1011 .trans_menu li.hover li.hover span.arrow, .trans_menu li.hover li.hover li.hover span.selected {
    1012         color: white;
    1013 }
    1014 
    1015 .trans_menu span.selected {
    1016         margin: 0 3px 0 -15px;
    1017         color: #666;
    1018         float: left;
    1019 }
    1020 
    1021 .trans_menu div.outerbox {
    1022         display: none;
    1023         background: transparent;
    1024         border: 1px solid rgba(0,0,0,0.1);
    1025         -webkit-border-radius: 5px;
    1026 }
    1027 
    1028 .trans_menu div.inner {
    1029         left: 0;
    1030         margin: 0;
    1031 }
    1032 
    1033 .trans_menu li.main li {
    1034         z-index: 2;
    1035         min-width: 78px;
    1036 }
    1037 
    1038 .trans_menu a {
    1039         text-decoration: none;
    1040         cursor: default;
    1041 }
    1042 
    1043 /*--------------------------------------
    1044  *
    1045  * C O N T E X T   M E N U
    1046  *
    1047  *--------------------------------------*/
    1048 
    1049 div#jqContextMenu
    1050 {
    1051         -webkit-border-radius: 5px;
    1052         border: 1px solid rgba(0,0,0,0.1);
    1053         -moz-user-select: none;
    1054         -webkit-user-select: none;
    1055 
    1056         ul {
    1057                 filter: alpha(opacity=98);
    1058                 -moz-opacity: .98;
    1059                 opacity: .98;
    1060                 -webkit-box-shadow: 0 10px 25px rgba(0,0,0,0.4);
    1061                 -webkit-border-radius: 5px;
    1062         }
    1063 
    1064         li.separator, div#jqContextMenu li.separator:hover {
    1065                 background: inherit !important;
    1066                 border-top: 1px solid #ddd !important;
    1067                 margin: 5px 0 !important;
    1068                 padding: 0px;
    1069         }
    1070 }
     960        white-space: nowrap;
     961}
     962
     963#torrent_context_menu,
     964#footer_super_menu {
     965        font-size: 1em;
     966        z-index: 3;
     967}
  • trunk/web/style/transmission/mobile.css

    r14003 r14518  
    745745  background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    746746  background-image: linear-gradient(top, #dddddd, #bbbbbb); }
    747   div.torrent_footer > * {
     747  div.torrent_footer > div {
    748748    position: relative;
    749749    float: left;
     
    756756    -moz-user-select: none;
    757757    -webkit-user-select: none; }
    758   div.torrent_footer div.main_container,
    759   div.torrent_footer ul#settings_menu {
     758  div.torrent_footer #settings_menu {
    760759    display: none; }
    761760  div.torrent_footer #prefs-button {
     
    934933  text-align: left; }
    935934
    936 div#torrent_context_menu {
    937   display: none; }
     935.ui-menu-item {
     936  text-align: left;
     937  white-space: nowrap; }
     938
     939#torrent_context_menu {
     940  font-size: 1em;
     941  z-index: 3; }
    938942
    939943iframe#torrent_upload_frame {
  • trunk/web/style/transmission/mobile.scss

    r13977 r14518  
    695695        @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom);
    696696
    697         > * {
     697        > div {
    698698                position: relative;
    699699                float: left;
     
    713713        $active-color-bottom: $selected-gradient-bottom;
    714714
    715         div.main_container,
    716         ul#settings_menu {
     715        #settings_menu {
    717716                display: none;
    718717        }
     
    809808
    810809
    811 // no context menu in the mobile version...
    812 div#torrent_context_menu {
    813         display: none;
     810.ui-menu-item {
     811  text-align: left;
     812  white-space: nowrap;
     813}
     814
     815#torrent_context_menu {
     816  font-size: 1em;
     817  z-index: 3;
    814818}
    815819
Note: See TracChangeset for help on using the changeset viewer.