Changeset 6458

Timestamp:

Aug 9, 2008, 4:38:51 AM (15 years ago)

Author:

Gimp

Message:

Fix filter text box bugs reported by BentMyWookie? and a bit more cleanup

Location:

trunk/web

Files:

• index.html (modified) (3 diffs)
• javascript/common.js (modified) (1 diff)
• javascript/transmission.js (modified) (1 diff)

trunk/web/index.html

@@ -9 +9 @@
                 <link href="./images/favicon.ico" rel="SHORTCUT ICON" />
                 <script type="text/javascript" src="./javascript/jquery/jquery.min.js"></script>
-                <link media="only screen and (max-device-width: 480px)" href="./stylesheets/iphone.css" type= "text/css" rel="stylesheet">
-                <link media="screen and (min-device-width: 481px)" href="./stylesheets/common.css" type="text/css" rel="stylesheet">
+                <link media="only screen and (max-device-width: 480px)" href="./stylesheets/iphone.css" type= "text/css" rel="stylesheet" />
+                <link media="screen and (min-device-width: 481px)" href="./stylesheets/common.css" type="text/css" rel="stylesheet" />
                 <script type="text/javascript" src="./javascript/jquery/jquery.transmenu.min.js"></script>
                 <script type="text/javascript" src="./javascript/jquery/jquery.contextmenu.min.js"></script>
@@ -48 +48 @@
                 <div id="torrent_filter_bar">
                         <ul>    
-                                 <li><a href='#all' id='filter_all_link' class='active'>All</a></li>
-                                 <li><a href='#downloading' id='filter_downloading_link'>Downloading</a></li>
-                                 <li><a href='#seeding' id='filter_seeding_link'>Seeding</a></li>
-                                 <li><a href='#paused' id='filter_paused_link'>Paused</a></li>
-                        </ul>
-                        <input type='text' id='torrent_search' class='blur' />          
+                                 <li><a href="#all" id="filter_all_link" class="active">All</a></li>
+                                 <li><a href="#downloading" id="filter_downloading_link">Downloading</a></li>
+                                 <li><a href="#seeding" id="filter_seeding_link">Seeding</a></li>
+                                 <li><a href="#paused" id="filter_paused_link">Paused</a></li>
+                        </ul>
+                        <input type="search" id="torrent_search" class="blur" autosave="Clutch" results="0" />          
                 </div>
                 <div id="torrent_inspector" style="display:none;">
@@ -194 +194 @@
                                         enctype='multipart/form-data' target='torrent_upload_frame'>  
                                         <div class="dialog_message">
-                                                Please select a .torrent file to upload:
+                                                Please select a torrent file to upload:
                                                         <input type='file' name='torrent_file' id='torrent_upload_file'/>
                                         </div>

trunk/web/javascript/common.js

@@ -48 +48 @@
                 $('#torrent_inspector').css('height', '100%');
                 
-                // Set Filter input to type search (nicely styled input field)
-                $('#torrent_search')[0].type = 'search';
-                $('#torrent_search')[0].placeholder = 'Filter';
+                // Move search field's margin down for the styled input
                 $('#torrent_search').css('margin-top', 3);              
         }

trunk/web/javascript/transmission.js

@@ -167 +167 @@
                 var tr = this;
                 var search_box = $('#torrent_search');
-                search_box[0].value = 'filter';
-                search_box.bind('keyup', {transmission: this}, function(event) {
+                search_box.bind('keyup click', {transmission: this}, function(event) {
                         tr.setSearch(this.value);
-                }).bind('blur', {transmission: this}, function(event) {
-                        if (this.value == '') {
-                                $(this).addClass('blur');
-                                this.value = 'filter';
-                                tr.setSearch(null);
-                        }
-                }).bind('focus', {}, function(event) {
-                        if ($(this).is('.blur')) {
-                                this.value = '';
-                                $(this).removeClass('blur');
-                        }
                 });
+                if (!$.browser.safari)
+                {
+                        search_box[0].value = 'Filter';
+                        search_box.bind('blur', {transmission: this}, function(event) {
+                                if (this.value == '') {
+                                        $(this).addClass('blur');
+                                        this.value = 'Filter';
+                                        tr.setSearch(null);
+                                }
+                        }).bind('focus', {}, function(event) {
+                                if ($(this).is('.blur')) {
+                                        this.value = '';
+                                        $(this).removeClass('blur');
+                                }
+                        });
+                }
         },