p2

[P2-php-svn] [875] expack:

svnno****@sourc***** svnno****@sourc*****
2010年 8月 14日 (土) 18:24:47 JST

• 前の記事 [P2-php-svn] [874] expack:
• 次の記事 [P2-php-svn] [876] expack:
• 記事の並び順: [ 日付 ] [ スレッド ] [ 件名 ] [ 著者 ]

Revision: 875
          http://sourceforge.jp/projects/p2-php/svn/view?view=rev&revision=875
Author:   rsk
Date:     2010-08-14 18:24:47 +0900 (Sat, 14 Aug 2010)

Log Message:
-----------
expack:
- iPhone用ツールバーを微調整。

Modified Paths:
--------------
    p2ex/trunk/css/iphone.css
    p2ex/trunk/js/iphone.js
    p2ex/trunk/lib/sb_header_i.inc.php
    p2ex/trunk/lib/toolbar_i.inc.php


-------------- next part --------------
Modified: p2ex/trunk/css/iphone.css
===================================================================
--- p2ex/trunk/css/iphone.css	2010-08-13 10:52:05 UTC (rev 874)
+++ p2ex/trunk/css/iphone.css	2010-08-14 09:24:47 UTC (rev 875)
@@ -79,6 +79,7 @@
 	width: 24px;
 	height: 24px;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 	vertical-align: middle;
 }
 
@@ -127,6 +128,7 @@
 	background: #ffffff url('../img/iphone/btn-bg.png') repeat-x left bottom;
 	border: #505050 solid 1px;
 	-webkit-border-radius: 15px;
+	border-radius: 8px;
 }
 
 div#read_new_header {
@@ -153,7 +155,9 @@
 	color: #ffffff;
 	background-color: rgba(0, 0, 0, 0.8);
 	-webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
+	box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 }
 
 div#spm span#spm-num {
@@ -218,6 +222,7 @@
 	background-color: #ffffff;
 	border: #808080 solid 1px;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 }
 
 div.res.aborned {
@@ -292,6 +297,7 @@
 	background-color: rgba(255, 255, 240, 0.9) !important;
 	border-color: rgba(108, 108, 108, 0.8) !important;
 	-webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
+	box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
 }
 
 div.respop > div.res > div.res-header {
@@ -417,6 +423,7 @@
 	color: #ffffff !important;
 	background-color: #666666;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 }
 
 ul.subject > li > a > span.unread.new {
@@ -456,7 +463,9 @@
 	color: #ffffff;
 	background-color: rgba(0, 0, 0, 0.8);
 	-webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
+	box-shadow: rgba(0, 0, 0, 0.7) 0 2px 5px;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 }
 
 div.popup-dialog > img.close-button {
@@ -676,9 +685,17 @@
 }
 
 div.ntoolbar td > a {
-	display: block;
+	display: inline-block;
 	position: relative;
+	width: 64px; /* 320/5 px */
+	margin: 0 auto;
+	padding: 0;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	text-align: center;
 	text-decoration: none;
+	-webkit-tap-highlight-color: transparent;
 }
 
 div.ntoolbar > h1.ptitle > a:link,
@@ -688,6 +705,11 @@
 	color: #fff;
 }
 
+div.ntoolbar td > a.inactive,
+div.ntoolbar td > span.unavailable {
+	color: #666;
+}
+
 div.ntoolbar > h1.ptitle > a.hover,
 div.ntoolbar > h1.ptitle > a.active,
 div.ntoolbar > h1.ptitle > a:hover,
@@ -699,11 +721,6 @@
 	color: #9cf;
 }
 
-div.ntoolbar td > a.inactive,
-div.ntoolbar td > span.unavailable {
-	color: #666;
-}
-
 div.ntoolbar td > a > span.badge {
 	display: inline-block;
 	position: absolute;
@@ -714,6 +731,7 @@
 	margin: 0;
 	padding: 2px 5px;
 	-webkit-border-radius: 8px;
+	border-radius: 8px;
 	background-color: #f00;
 	background-color: rgba(255, 0, 0, 0.95);
 	color: #fff;
@@ -722,6 +740,22 @@
 	line-height: 12px;
 }
 
+div.ntoolbar td > a > span.badge.l2 {
+	right: 5px;
+}
+
+div.ntoolbar td > a > span.badge.l3 {
+	right: 3px;
+}
+
+div.ntoolbar td > a > span.badge.l4 {
+	right: 0px;
+}
+
+div.ntoolbar td > a > span.badge.l0 {
+	display: none;
+}
+
 div.ntoolbar td > a.hover > span.badge,
 div.ntoolbar td > a.active > span.badge,
 div.ntoolbar td > a:hover > span.badge,
@@ -738,6 +772,11 @@
 	background-color: #fff;
 }
 
+div.ntoolbar td > a.inactive > img,
+div.ntoolbar td > span.unavailable > img {
+	background-color: #666;
+}
+
 div.ntoolbar td > a.hover > img,
 div.ntoolbar td > a.active > img,
 div.ntoolbar td > a:hover > img,
@@ -745,11 +784,6 @@
 	background-color: #9cf;
 }
 
-div.ntoolbar td > a.inactive > img,
-div.ntoolbar td > span.unavailable > img {
-	background-color: #666;
-}
-
 div.ntoolbar td > select {
 	font-size: 16px;
 }

Modified: p2ex/trunk/js/iphone.js
===================================================================
--- p2ex/trunk/js/iphone.js	2010-08-13 10:52:05 UTC (rev 874)
+++ p2ex/trunk/js/iphone.js	2010-08-14 09:24:47 UTC (rev 875)
@@ -754,13 +754,9 @@
  */
 iutil.toolbarSetFav = function(element, event) {
 	if (iutil.httpGetText(element.href) == '1') {
-		if (element.className === 'inactive') {
-			element.className = '';
-		} else {
-			element.className = 'inactive';
-		}
+		iutil.toggleClass(element, 'inactive');
 	} else {
-		window.alert('‚¨‹C‚É“ü‚è‚Ì“o˜^E‰ðœ‚ÉŽ¸”s‚µ‚Ü‚µ‚½\n'+element.href);
+		window.alert('‚¨‹C‚É“ü‚è‚Ì“o˜^E‰ðœ‚ÉŽ¸”s‚µ‚Ü‚µ‚½');
 	}
 
 	return iutil.stopEvent(event);
@@ -780,6 +776,44 @@
 iutil.toolbarSetFavIta = iutil.toolbarSetFav;
 
 // }}}
+// {{{ toggleClass()
+
+/**
+ * CSSƒNƒ‰ƒX‚̃gƒOƒ‹‚·‚é
+ *
+ * @param {Element} element
+ * @param {String} className
+ * @param {Boolean} toggle
+ * @return void
+ */
+iutil.toggleClass = function(element, className, toggle) {
+	var i, l, hasClass, oldClasses, newClasses;
+
+	oldClasses = element.className.split(/\s+/);
+	newClasses = [];
+	l = oldClasses.length;
+	hasClass = false;
+
+	for (i = 0; i < l; i++) {
+		if (oldClasses[i] === className) {
+			hasClass = true;
+		} else {
+			newClasses.push(oldClasses[i]);
+		}
+	}
+
+	if (typeof toggle === 'undefined') {
+		if (!hasClass) {
+			newClasses.push(className);
+		}
+	} else if (toggle) {
+		newClasses.push(className);
+	}
+
+	element.className = newClasses.join(' ');
+};
+
+// }}}
 // {{{ sliding.onTouchStart()
 
 /**

Modified: p2ex/trunk/lib/sb_header_i.inc.php
===================================================================
--- p2ex/trunk/lib/sb_header_i.inc.php	2010-08-13 10:52:05 UTC (rev 874)
+++ p2ex/trunk/lib/sb_header_i.inc.php	2010-08-14 09:24:47 UTC (rev 875)
@@ -95,7 +95,7 @@
 }
 
 // ƒXƒŒî•ñ
-if (!$spmode || $spmode == 'soko' || $spmode == 'taborn') {
+if (!$spmode) {
     if (!function_exists('get_board_info')) {
         include P2_LIB_DIR . '/get_info.inc.php';
     }

Modified: p2ex/trunk/lib/toolbar_i.inc.php
===================================================================
--- p2ex/trunk/lib/toolbar_i.inc.php	2010-08-13 10:52:05 UTC (rev 874)
+++ p2ex/trunk/lib/toolbar_i.inc.php	2010-08-14 09:24:47 UTC (rev 875)
@@ -3,6 +3,13 @@
  * rep2 - ƒc[ƒ‹ƒo[—pƒ†[ƒeƒBƒŠƒeƒBiiPhonej
  */
 
+$GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'] = implode(' ', array(
+    '',
+    'ontouchstart="iutil.toggleClass(this, \'hover\', true);"',
+    'ontouchend="iutil.toggleClass(this, \'hover\', false);"',
+    'ontouchcancel="iutil.toggleClass(this, \'hover\', false);"',
+));
+
 // {{{ toolbar_i_standard_button()
 
 /**
@@ -15,8 +22,9 @@
  */
 function toolbar_i_standard_button($icon, $label, $uri)
 {
+    $attrs = $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'];
     return <<<EOS
-<a href="{$uri}" ontouchstart="this.className='hover'" ontouchend="this.className=''"><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
+<a href="{$uri}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
 EOS;
 }
 
@@ -34,8 +42,10 @@
  */
 function toolbar_i_badged_button($icon, $label, $uri, $badge)
 {
+    $attrs = $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'];
+    $l = min(strlen($badge), 4);
     return <<<EOS
-<a href="{$uri}" ontouchstart="this.className='hover'" ontouchend="this.className=''"><img src="{$icon}" width="48" height="32" alt=""><br>{$label}<span class="badge">{$badge}</span></a>
+<a href="{$uri}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$label}<span class="badge l{$l}">{$badge}</span></a>
 EOS;
 }
 
@@ -52,8 +62,9 @@
  */
 function toolbar_i_opentab_button($icon, $label, $uri)
 {
+    $attrs = $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'] . ' target="_blank"';
     return <<<EOS
-<a href="{$uri}" ontouchstart="this.className='hover'" ontouchend="this.className=''" target="_blank"><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
+<a href="{$uri}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
 EOS;
 }
 
@@ -88,8 +99,9 @@
  */
 function toolbar_i_showhide_button($icon, $label, $id)
 {
+    $attrs = ' onclick="return iutil.toolbarShowHide(this, event);"' . $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'];
     return <<<EOS
-<a href="#{$id}", onclick="return iutil.toolbarShowHide(this, event);"><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
+<a href="#{$id}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$label}</a>
 EOS;
 }
 
@@ -112,7 +124,10 @@
     }
 
     $fav = $info->favs[$setnum];
-    $attrs = $fav['set'] ? '' : ' class="inactive"';
+    $attrs = ' onclick="return iutil.toolbarSetFavIta(this, event);"' . $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'];
+    if (!$fav['set']) {
+        $attrs .= ' class="inactive"';
+    }
     $query = http_build_query(array(
         'cmd'       => 'setfavita',
         'host'      => $info->host,
@@ -123,7 +138,7 @@
     ), '', '&amp;');
 
     return <<<EOS
-<a href="httpcmd.php?{$query}", onclick="return iutil.toolbarSetFavIta(this, event);"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$fav['title']}</a>
+<a href="httpcmd.php?{$query}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$fav['title']}</a>
 EOS;
 }
 
@@ -146,7 +161,10 @@
     }
 
     $fav = $info->favs[$setnum];
-    $attrs = $fav['set'] ? '' : ' class="inactive"';
+    $attrs = ' onclick="return iutil.toolbarSetFav(this, event);"' . $GLOBALS['_TOOLBAR_I_TOGGLE_HOVER'];
+    if (!$fav['set']) {
+        $attrs .= ' class="inactive"';
+    }
     $query = http_build_query(array(
         'cmd'       => 'setfav',
         'host'      => $info->host,
@@ -158,7 +176,7 @@
     ), '', '&amp;');
 
     return <<<EOS
-<a href="httpcmd.php?{$query}", onclick="return iutil.toolbarSetFav(this, event);"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$fav['title']}</a>
+<a href="httpcmd.php?{$query}"{$attrs}><img src="{$icon}" width="48" height="32" alt=""><br>{$fav['title']}</a>
 EOS;
 }
 

• 前の記事 [P2-php-svn] [874] expack:
• 次の記事 [P2-php-svn] [876] expack:
• 記事の並び順: [ 日付 ] [ スレッド ] [ 件名 ] [ 著者 ]