r101211 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r101210‎ | r101211 | r101212 >
Date:21:55, 28 October 2011
Author:preilly
Status:ok (Comments)
Tags:
Comment:
Modified paths:
  • /branches/wmf/1.18wmf1/extensions/MobileFrontend/javascripts/opensearch.js (modified) (history)
  • /branches/wmf/1.18wmf1/extensions/MobileFrontend/stylesheets/common.css (modified) (history)
  • /branches/wmf/1.18wmf1/extensions/MobileFrontend/views/layout/application.html.php (modified) (history)

Diff [purge]

Index: branches/wmf/1.18wmf1/extensions/MobileFrontend/javascripts/opensearch.js
@@ -12,14 +12,40 @@
1313 var results = document.getElementById( 'results' );
1414 var search = document.getElementById( 'search' );
1515 var sq = document.getElementById( 'sq' );
16 -var iw = ( document.documentElement.clientWidth ) ? document.documentElement.clientWidth : document.body.clientWidth;
17 -sq.style.width = ( iw - 110 ) + pixels;
18 -search.style.width = ( iw - 140 ) + pixels;;
 16+var sb = document.getElementById( 'searchbox' );
1917
 18+function updateSearchWidth() {
 19+ if ( sq && search && sb ) {
 20+ var iw = ( document.documentElement.clientWidth ) ? document.documentElement.clientWidth : document.body.clientWidth;
 21+ sb.style.width = ( iw - 30 ) + pixels;
 22+ sq.style.width = ( iw - 110 ) + pixels;
 23+ search.style.width = ( iw - 140 ) + pixels;
 24+ }
 25+}
 26+
 27+updateSearchWidth();
 28+
2029 results.style.width = ( sq.offsetWidth - 2 ) + pixels;
2130 results.style.left = sq.offsetLeft + pixels;
2231 results.style.top = ( sq.offsetTop + sq.offsetHeight ) + pixels;
2332
 33+function updateOrientationSearchWidth() {
 34+ switch( window.orientation ) {
 35+ case 0:
 36+ updateSearchWidth();
 37+ break;
 38+ case 90:
 39+ updateSearchWidth();
 40+ break;
 41+ case -90:
 42+ updateSearchWidth();
 43+ break;
 44+ }
 45+}
 46+
 47+// Point to the updateOrientation function when iPhone switches between portrait and landscape modes.
 48+window.onorientationchange = updateOrientationSearchWidth;
 49+
2450 window.onload = function () {
2551 search.addEventListener( 'keyup',
2652 function() {
@@ -66,6 +92,12 @@
6793 return sections;
6894 }
6995
 96+function sqValUpdate( sqValue ) {
 97+ if ( search ) {
 98+ search.value = sqValue;
 99+ }
 100+}
 101+
70102 function writeResults( sections ) {
71103 results.style.display = 'block';
72104 if ( !sections || sections.length < 1 ) {
@@ -76,7 +108,7 @@
77109 var section = sections[i];
78110 var rel = i + 1;
79111 section.value = section.value.replace( /^(?:\/\/|[^\/]+)*\//, '/' );
80 - html = html + "<div class=\"suggestions-result\" rel=\"" + rel + "\" title=\"" + section.label + "\"><a href='" + section.value + "'>" + section.label + "</a></div>";
 112+ html = html + "<div class=\"suggestions-result\" rel=\"" + rel + "\" title=\"" + section.label + "\"><a href='" + section.value + "'>" + section.label + "</a><a class=\"sq-val-update\" href=\"javascript:sqValUpdate('" + section.label + "');\"> + </a></div>";
81113 if ( i < ( sections.length - 1 ) ) {
82114 html = html + '<hr />';
83115 }
Index: branches/wmf/1.18wmf1/extensions/MobileFrontend/stylesheets/common.css
@@ -52,6 +52,28 @@
5353 .suggestions-result:hover {
5454 background-color: #ACD1E9;
5555 }
 56+a.sq-val-update {
 57+ font-size: 1.3em;
 58+ font-weight:normal;
 59+ text-decoration: none;
 60+ color: #000000;
 61+}
 62+a.sq-val-update:link {
 63+ text-decoration: none;
 64+ color:#000000;
 65+}
 66+a.sq-val-update:visited {
 67+ text-decoration: none;
 68+ color:#000000;
 69+}
 70+a.sq-val-update:hover {
 71+ text-decoration: none;
 72+ color:#000000;
 73+}
 74+a.sq-val-update:active {
 75+ text-decoration: none;
 76+ color:#000000;
 77+}
5678
5779 #results {
5880 display: none;
Index: branches/wmf/1.18wmf1/extensions/MobileFrontend/views/layout/application.html.php
@@ -27,7 +27,7 @@
2828 <head>
2929 <title>{$htmlTitle}</title>
3030 <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
31 - <link href='{$wgExtensionAssetsPath}/MobileFrontend/stylesheets/common.css?version=10282011120815' media='all' rel='Stylesheet' type='text/css' />
 31+ <link href='{$wgExtensionAssetsPath}/MobileFrontend/stylesheets/common.css?version=10282011122615' media='all' rel='Stylesheet' type='text/css' />
3232 <link href='{$wgExtensionAssetsPath}/MobileFrontend/stylesheets/{$cssFileName}.css?version=10202011120715' media='all' rel='Stylesheet' type='text/css' />
3333 <meta name="ROBOTS" content="NOINDEX, NOFOLLOW" />
3434 <meta name = "viewport" content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

Past revisions this follows-up on

RevisionCommit summaryAuthorDate
r101209add option to select a search result term and update orientationpreilly21:51, 28 October 2011

Comments

#Comment by Yair rand (talk | contribs)   01:36, 3 November 2011

Using javascript to resize something that's visible right away is really going to look ugly. The box should just start with the right size using a table.

Status & tagging log