refs #1604 : jquery.mobile added.

TODO : update jquery.mobile version to 1.0 TODO : restructure jquery.mobile paths TODO : Migrate every mobile screen to jquery.mobile
Needlworks · Nov 24, 2011 · 7fa1112 · 7fa1112
1 parent bd6ceef
commit 7fa1112
Show file tree

Hide file tree

Showing 18 changed files with 1,247 additions and 1,017 deletions.
diff --git a/framework/id/textcube/config.default.php b/framework/id/textcube/config.default.php
@@ -14,7 +14,8 @@
 define('CRLF', "\r\n");
 define('TAB', "	");
 define('INT_MAX',2147483647);
-define('JQUERY_VERSION','1.4');
+define('JQUERY_VERSION','1.6.4.min');
+define('JQUERYMOBILE_VERSION','1.0rc1.min');
 if( strstr( PHP_OS, "WIN") !== false ) {
 	define('DS', "\\");
 } else {

diff --git a/interface/i/category/index.php b/interface/i/category/index.php
@@ -5,9 +5,7 @@
 define('__TEXTCUBE_IPHONE__', true);
 require ROOT . '/library/preprocessor.php';
 requireView('iphoneView');
-if (false) {
-	fetchConfigVal();
-}
+
 $category = $suri['id'];
 if(isset($category)) {
 	$blog['entriesOnList'] = 8;

diff --git a/interface/i/comment/index.php b/interface/i/comment/index.php
@@ -5,6 +5,10 @@
 define('__TEXTCUBE_IPHONE__', true);
 require ROOT . '/library/preprocessor.php';
 requireView('iphoneView');
+printIphoneHtmlHeader();
+printMobileHTMLMenu('','comment');
+
+
 if(isset($_GET['page'])) $page = $_GET['page'];
 else $page = 1;
 if(!empty($suri['id'])) {	// entry-related comment print
@@ -28,12 +32,8 @@
 <div id="comment_<?php echo time();?>" title="<?php echo _text('최근 댓글');?>" selected="false">
 <?php
 	printIphoneRecentCommentView($page);
-?>
-	<fieldset class="navi margin-top10">
-<?php
 	printIphoneNavigation($entry, false, false, $paging, 'comment');
 ?>
-	</fieldset>
 </div>
 <?php
 }

diff --git a/interface/i/entry/index.php b/interface/i/entry/index.php
@@ -5,14 +5,17 @@
 define('__TEXTCUBE_IPHONE__', true);
 require ROOT . '/library/preprocessor.php';
 requireView('iphoneView');
+printIphoneHtmlHeader();
+
 if(empty($suri['id']) && empty($suri['value'])) {
+	printMobileHTMLMenu('','list');
 	$blog['entriesOnList'] = 8;
 	if(!$listWithPaging = getEntriesWithPaging($blogid, $suri['page'], $blog['entriesOnList']))
 		$listWithPaging = array(array(), array('total' => 0));
 	$list = array('title' => (empty($suri['value']) ? getCategoryLabelById($blogid, 0) : $suri['value']), 'items' => $listWithPaging[0], 'count' => $listWithPaging[1]['total']);
 	$paging = $listWithPaging[1];
 ?>
-	<ul class="posts" id="blog_posts_<?php echo $suri['page'];?>" title="<?php echo _text('글목록');?>" selected="false">
+	<ul data-role="listview" class="posts" id="blog_posts_<?php echo $suri['page'];?>" title="<?php echo _text('글목록');?>" selected="false">
 <?php
 	$itemsView = '<li class="group">'.CRLF;
 	$itemsView .= '	<span class="left">'._text('글목록').'('.$list['count'].')</span>'.CRLF;

diff --git a/interface/i/index.php b/interface/i/index.php
@@ -8,7 +8,12 @@
 if(empty($suri['id'])) {
 	printIphoneHtmlHeader();
 ?>	
-	<ul id="home" title="<?php echo htmlspecialchars(UTF8::lessenAsEm($blog['title'],30));?>" selected="true">
+
+	<div data-role="page">
+<?php
+	printMobileHTMLMenu('','list');
+?>
+	<ul data-role="listview" id="home" title="<?php echo htmlspecialchars(UTF8::lessenAsEm($blog['title'],30));?>" selected="true">
 	<?php
 		$blogAuthor = User::getBlogOwnerName($blogid);
 		$blogLogo = !empty($blog['logo']) ? printIphoneImageResizer($blogid, $blog['logo'], 80) : "{$service['path']}/resources/style/iphone/image/textcube_logo.png";
@@ -22,45 +27,53 @@
 		$itemsView .= '</li>'.CRLF;
 		print $itemsView;
 	?>
-		<li><a href="<?php echo $blogURL;?>/entry" class="link"><?php echo _text('글목록');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/entry" rel="external" class="link"><?php echo _text('글목록');?></a></li>
 		<li><a href="#categories" class="link"><?php echo _text('분류');?></a></li>
 		<li><a href="#archives" class="link"><?php echo _text('보관목록');?></a></li>
 		<li><a href="#tags" class="link"><?php echo _text('태그');?></a></li>
-		<li><a href="<?php echo $blogURL;?>/comment" class="link"><?php echo _text('최근 댓글');?></a></li>
-		<li><a href="<?php echo $blogURL;?>/trackback" class="link"><?php echo _text('최근 트랙백');?></a></li>
-		<li><a href="<?php echo $blogURL;?>/guestbook" class="link"><?php echo _text('방명록');?></a></li>
-		<li><a href="<?php echo $blogURL;?>/link" class="link"><?php echo _text('링크');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/comment" rel="external" class="link"><?php echo _text('최근 댓글');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/trackback" rel="external" class="link"><?php echo _text('최근 트랙백');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/guestbook" rel="external" class="link"><?php echo _text('방명록');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/link" rel="external" class="link"><?php echo _text('링크');?></a></li>
 	<?php
 		if (doesHaveOwnership()) {
 	?>
-		<li><a href="<?php echo $defaultURL;?>/owner/center/dashboard" onclick="window.location.href='<?php echo $defaultURL;?>/owner/center/dashboard'" class="link dashboard"><?php echo _text('관리 패널');?></a></li>
-		<li><a href="<?php echo $blogURL;?>/logout" class="link logout"><?php echo _text('로그아웃');?></a></li>
+		<li><a href="<?php echo $defaultURL;?>/owner/center/dashboard" rel="external" href="<?php echo $defaultURL;?>/owner/center/dashboard" class="link dashboard"><?php echo _text('관리 패널');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/logout" rel="external" class="link logout"><?php echo _text('로그아웃');?></a></li>
 	<?php
 		}else{
 	?>
-		<li><a href="<?php echo $blogURL;?>/login" class="link"><?php echo _text('로그인');?></a></li>
+		<li><a href="<?php echo $blogURL;?>/login" rel="external" class="link"><?php echo _text('로그인');?></a></li>
 	<?php
 		}
 	?>
 		<li><a href="#textcube" class="link"><span class="colorText"><span class="c1">T</span><span class="c2">e</span><span class="c3">x</span><span class="c4">t</span><span class="c5">c</span><span class="c6">u</span><span class="c7">b</span><span class="c8">e</span></span></a></li>
 	</ul>
-
-	<ul id="categories" title="Categories" selected="false">
+  </div>
+<?php
+	 ?>
+	<div data-role="page" id="categories">
+<?php
+	printMobileHTMLMenu();
+?>	<ul data-role="listview" title="Categories" selected="false">
 	<?php
 		$totalPosts = getEntriesTotalCount($blogid);
 		$categories = getCategories($blogid);
 		print printIphoneCategoriesView($totalPosts, $categories, true);	
 	?>
 	</ul>
-
-	<ul id="archives" title="Archives" selected="false">
+	</div>
+	<div data-role="page" id="archives">
+	<ul data-role="listview" title="Archives" selected="false">
 	<?php
 		$archives = printIphoneArchives($blogid);
 		print printIphoneArchivesView($archives);	
 	?>
 	</ul>
-
-	<ul id="tags" title="Tags" selected="false">
+	</div>
+
+	<div data-role="page" id="tags">
+	<ul data-role="listview" title="Tags" selected="false">
 		<li class="group"><span class="left">Random Tags (100)</span><span class="right">&nbsp;</span></li>
 		<li class="panel">
 		<div class="content padding5">
@@ -73,7 +86,9 @@
 		</div>
 		</li>
 	</ul>
-
+	</div>
+
+	<div data-role="page" id="search">
     <form id="searchForm" method="GET" class="dialog snug editorBar" action="<?php echo $blogURL;?>/search">
         <fieldset>
             <h1><?php echo _text('글 검색');?></h1>
@@ -85,8 +100,9 @@
 			<input id="qString" type="text" name="search" autocomplete="off" unedited="true" class="search" onkeyup="searchKeywordCheck(this);" onkeydown="searchKeywordCheck(this);" />
 		</fieldset>
     </form>
-
-	<div id="textcube" title="TEXTCUBE" selected="false">
+	</div>
+
+	<div data-role="page" id="textcube" title="TEXTCUBE" selected="false">
 		<div class="textcubeLogo">&nbsp;</div>
 		<div class="textcubeVersion">
 			Brand yourself! : <?php echo TEXTCUBE_NAME;?> <?php echo TEXTCUBE_VERSION;?>

diff --git a/interface/i/link/index.php b/interface/i/link/index.php
@@ -5,8 +5,10 @@
 define('__TEXTCUBE_IPHONE__', true);
 require ROOT . '/library/preprocessor.php';
 requireView('iphoneView');
+printIphoneHtmlHeader();
+printMobileHTMLMenu();
 
-$linkView .= '<ul class="posts" id="links" title="'._text('링크').'" selected="false">'.CRLF;
+$linkView .= '<ul data-role="listview" class="posts" id="links" title="'._text('링크').'" selected="false">'.CRLF;
 $linkView .= printIphoneLinksView(getLinks($blogid));
 $linkView .= '</ul>';
 print $linkView;

diff --git a/interface/i/trackback/index.php b/interface/i/trackback/index.php
@@ -5,6 +5,9 @@
 define('__TEXTCUBE_IPHONE__', true);
 require ROOT . '/library/preprocessor.php';
 requireView('iphoneView');
+printIphoneHtmlHeader();
+printMobileHTMLMenu('','trackback');
+
 if(isset($_GET['page'])) $page = $_GET['page'];
 else $page = 1;
 
@@ -15,25 +18,17 @@
 <div id="trackback_<?php echo $entry['id']."_".time();?>" title="<?php echo _text('트랙백');?> : <?php echo htmlspecialchars($entry['title']);?>" selected="false">
 <?php
 	printIphoneTrackbackView($entry['id']);
-?>
-	<fieldset class="navi margin-top10">
-<?php
 	printIphoneNavigation($entry, true, false);
 ?>
-	</fieldset>
 </div>
 <?php
 } else {
 ?>	
 <div id="trackback_<?php echo "_".time();?>" title="<?php echo _text('최근 트랙백');?>" selected="false">
 <?php
 	printIphoneRecentTrackbackView($page);
-?>
-	<fieldset class="navi margin-top10">
-<?php
 	printIphoneNavigation($entry, false, false, $paging, 'trackback');
 ?>
-	</fieldset>
 </div>
 <?php
 }

diff --git a/library/view/iphoneView.php b/library/view/iphoneView.php
@@ -197,37 +197,46 @@ function printIphoneLinksView($links) {
 function printIphoneHtmlHeader($title = '') {
 	$context = Model_Context::getInstance();
 	$title = htmlspecialchars($context->getProperty('blog.title') . ' :: ' . $title);
-?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko">
+?><!DOCTYPE html> 
+<html> 
+
 <head>
 	<title><?php echo $title;?></title>
 	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
-	<meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
+	<meta name="viewport" content="width=device-width, initial-scale=1"> 
 	<link rel="stylesheet" type="text/css" href="<?php echo $context->getProperty('service.path');?>/resources/style/iphone/iphone.css" />
+	<link rel="stylesheet" type="text/css" href="<?php echo $context->getProperty('service.path');?>/resources/style/iphone/jquery.mobile-<?php echo JQUERYMOBILE_VERSION;?>.css" />
 <?php
 	if(Setting::getBlogSettingGlobal('useBlogIconAsIphoneShortcut',true) && file_exists(ROOT."/attach/".$context->getProperty('blog.id')."/index.gif")) {
 ?>
 	<link rel="apple-touch-icon" href="<?php echo $context->getProperty('uri.default')."/index.gif";?>" />
 <?php
 	}
 ?>
-	<script type="application/x-javascript" src="<?php echo $context->getProperty('service.path');?>/resources/script/iphone/iphone.js"></script>
+	<script type="application/x-javascript" src="<?php echo $context->getProperty('service.path');?>/resources/script/jquery/jquery-<?php echo JQUERY_VERSION;?>.js"></script>
+	<script type="application/x-javascript" src="<?php echo $context->getProperty('service.path');?>/resources/script/jquery.mobile/jquery.mobile-<?php echo JQUERYMOBILE_VERSION;?>.js"></script>
 </head>
 <body>
-	<div class="toolbar">
+<?php
+}
+
+function printMobileHTMLMenu($title = '',$menu='') {
+	$context = Model_Context::getInstance();
+	$title = htmlspecialchars($context->getProperty('blog.title') . ' :: ' . $title);
+?>
+	<div data-role="header" class="toolbar">
 		<h1 id="pageTitle"><?php echo htmlspecialchars($context->getProperty('blog.title'));?></h1>
-		<a id="backButton" class="button" href="#"></a>
-		<a class="button" href="#searchForm" id="searchButton" onclick="searchAction(true);"><?php echo _text('검색');?></a>
+		<a data-role="button" data-rel="back" data-icon="back" data-iconpos="notext" id="backButton" class="button" href="#"><?php echo _text('뒤로');?></a>
+		<a data-role="button" data-icon="search" class="button" href="#searchForm" id="searchButton" onclick="searchAction(true);"><?php echo _text('검색');?></a>
 	</div>
-	<div class="toolbar shortcut">
-	<ul>
-		<li><a href="<?php echo $context->getProperty('uri.blog');?>" onclick="window.location.href='<?php echo $context->getProperty('uri.blog');?>'"><?php echo _text('글목록');?></a></li>
-		<li><a href="<?php echo $context->getProperty('uri.blog');?>/comment"><?php echo _text('댓글');?></a></li>
-		<li><a href="<?php echo $context->getProperty('uri.blog');?>/trackback"><?php echo _text('트랙백');?></a></li>
-		<li><a href="<?php echo $context->getProperty('uri.blog');?>/guestbook"><?php echo _text('방명록');?></a></li>
-	</ul>
+	<div data-role="navbar" data-position="fixed" class="toolbar shortcut">
+		<ul>
+			<li><a href="<?php echo $context->getProperty('uri.blog');?>" rel="external" <?php echo $menu=="list" ? 'class="ui-btn-active"' : '';?>><?php echo _text('글목록');?></a></li>
+			<li><a href="<?php echo $context->getProperty('uri.blog');?>/comment" rel="external" <?php echo $menu=="comment" ? 'class="ui-btn-active"' : '';?>><?php echo _text('댓글');?></a></li>
+			<li><a href="<?php echo $context->getProperty('uri.blog');?>/trackback" rel="external" <?php echo $menu=="trackback" ? 'class="ui-btn-active"' : '';?>><?php echo _text('트랙백');?></a></li>
+			<li><a href="<?php echo $context->getProperty('uri.blog');?>/guestbook" rel="external" <?php echo $menu=="guestbook" ? 'class="ui-btn-active"' : '';?>><?php echo _text('방명록');?></a></li>
+		</ul>
 	</div>
-
 <?php
 }
 
@@ -396,9 +405,11 @@ function printIphoneHtmlFooter() {
 }
 
 function printIphoneNavigation($entry, $jumpToComment = true, $jumpToTrackback = true, $paging = null, $mode = 'entry') {
+	$context = Model_Context::getInstance();
 	global $suri, $blogURL;
 ?>
-	<ul class="content navigation">
+	<div data-role="footer">
+	<ul data-role="navbar" class="content navigation">
 		<?php
 	if (isset($paging['prev'])) {
 ?>
@@ -426,12 +437,15 @@ function printIphoneNavigation($entry, $jumpToComment = true, $jumpToTrackback =
 		<?php
 	}
 	if ($suri['directive'] != '/i') {
+	/*
 ?>
 		<li class="last_no_line"><a href="<?php echo $blogURL;?>" onclick="window.location.href='<?php echo $blogURL;?>';" accesskey="6"><?php echo _text('첫화면으로 돌아가기');?></a></li>
 		<?php
+	*/
 	}
 ?>
 	</ul>
+	</div>
 <?php
 }
 
@@ -449,7 +463,7 @@ function printIphoneTrackbackView($entryId, $page, $mode = null) {
 	} else {
 		foreach ($trackbacks as $trackback) {
 ?>
-		<ul id="trackback_<?php echo $commentItem['id'];?>" class="trackback">
+		<ul data-role="listview" data-inset="true" id="trackback_<?php echo $commentItem['id'];?>" class="trackback">
 			<li class="group">
 				<span class="left">
 					<?php echo htmlspecialchars($trackback['subject']);?>
@@ -459,7 +473,7 @@ function printIphoneTrackbackView($entryId, $page, $mode = null) {
 				</span>
 			</li>
 			<li class="body">
-				<span class="date">DATE : <?php echo Timestamp::format5($trackback['written']);?></span>
+				<p class="ui-li-aside"><?php echo Timestamp::format5($trackback['written']);?></p>
 				<?php echo htmlspecialchars($trackback['excerpt']);?>
 			</li>
 		</ul>
@@ -484,34 +498,40 @@ function printIphoneCommentView($entryId, $page = null, $mode = null) {
 	} else {
 		foreach ($comments as $commentItem) {
 ?>
-		<ul id="comment_<?php echo $commentItem['id'];?>" class="comment">
+		<ul data-role="listview" id="comment_<?php echo $commentItem['id'];?>" class="comment">
 			<li class="group">
-				<span class="left">
+				<p class="left">
 					<?php if(!empty($commentItem['name'])) { ?><strong><?php echo htmlspecialchars($commentItem['name']);?></strong><?php } ?>
-					(<?php echo Timestamp::format5($commentItem['written']);?>)
-				</span>
-				<span class="right">
-					<a href="<?php echo $blogURL;?>/comment/comment/<?php echo $commentItem['id'];?>"><?php echo ($entryId == 0 ? _text('방명록에 댓글 달기') : _text('댓글에 댓글 달기'));?></a> :
-					<a href="<?php echo $blogURL;?>/comment/delete/<?php echo $commentItem['id'];?>"><?php echo _text('지우기');?></a>
-				</span>
-			</li>
-			<li class="body">
+				</p>
+				<p class="ui-li-aside">
+					<?php echo Timestamp::format5($commentItem['written']);?>
+				</p>
+				<p class="right">
+					<div data-role="controlgroup">
+						<a href="<?php echo $blogURL;?>/comment/comment/<?php echo $commentItem['id'];?>" data-role="button" data-icon="plus" data-iconpos="notext"><?php echo ($entryId == 0 ? _text('방명록에 댓글 달기') : _text('댓글에 댓글 달기'));?></a> 
+						<a href="<?php echo $blogURL;?>/comment/delete/<?php echo $commentItem['id'];?>" data-role="button" data-icon="delete" data-iconpos="notext"><?php echo _text('지우기');?></a>
+					</div>
+				</p>
+				<p class="body">
 				<?php echo ($commentItem['secret'] && doesHaveOwnership() ? '<div class="hiddenComment" style="font-weight: bold; color: #e11">'.($entryId == 0 ? _text('비밀 방명록') : _text('비밀 댓글')).' &gt;&gt;</div>' : '').nl2br(addLinkSense(htmlspecialchars($commentItem['comment'])));?>
+				</p>
 			</li>
 			<?php
 			foreach (getCommentComments($commentItem['id']) as $commentSubItem) {
 ?>
 			<li class="groupSub">
-				<span class="left">&nbsp;Re :
+				<p class="left">&nbsp;Re :
 					<?php if(!empty($commentSubItem['name'])) { ?><strong><?php echo htmlspecialchars($commentSubItem['name']);?></strong><?php } ?>
-					(<?php echo Timestamp::format5($commentSubItem['written']);?>)
-				</span>
-				<span class="right">
-					<a href="<?php echo $blogURL;?>/comment/delete/<?php echo $commentSubItem['id'];?>">DEL</a><br />
-				</span>
-			</li>
-			<li class="body">
+				</p>
+				<p class="ui-li-aside">
+					<?php echo Timestamp::format5($commentSubItem['written']);?>
+				</p>
+				<p class="right">
+					<a href="<?php echo $blogURL;?>/comment/delete/<?php echo $commentSubItem['id'];?>" data-role="button" data-icon="delete" data-inline="true" data-iconpos="notext"><?php echo _text('지우기');?></a><br />
+				</p>
+				<p class="body">
 				<?php echo ($commentSubItem['secret'] && doesHaveOwnership() ? '<div class="hiddenComment" style="font-weight: bold; color: #e11">'._t('Secret Comment').' &gt;&gt;</div>' : '').nl2br(addLinkSense(htmlspecialchars($commentSubItem['comment'])));?>
+				</p>
 			</li>
 			<?php
 			}

diff --git a/resources/script/jquery.mobile/jquery.mobile-1.0rc1.min.css b/resources/script/jquery.mobile/jquery.mobile-1.0rc1.min.css