diff options
| -rw-r--r-- | mobile/functions.php | 6 | ||||
| -rw-r--r-- | mobile/index.php | 1 | ||||
| -rw-r--r-- | mobile/mobile.css | 32 | ||||
| -rw-r--r-- | mobile/mobile.js | 82 |
4 files changed, 121 insertions, 0 deletions
diff --git a/mobile/functions.php b/mobile/functions.php index c1bb61c54..18440bab9 100644 --- a/mobile/functions.php +++ b/mobile/functions.php @@ -477,6 +477,12 @@ print "<p>$content</p>"; + print "<div class='nav'> + <label>Navigation</label> + <div class='button left' onclick='goPrev($id, $feed_id, this)'>Prev</div> + <div class='button right' onclick='goNext($id, $feed_id, this)'>Next</div> + </div>"; + print "<fieldset>"; print "<div class=\"row\"> diff --git a/mobile/index.php b/mobile/index.php index bcdfe23d1..b0b374497 100644 --- a/mobile/index.php +++ b/mobile/index.php @@ -34,6 +34,7 @@ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script type="text/javascript" src="../lib/prototype.js"></script> <script type="text/javascript" src="mobile.js"></script> +<style type="text/css" media="screen">@import "mobile.css";</style> </head> <style type="text/css"> diff --git a/mobile/mobile.css b/mobile/mobile.css new file mode 100644 index 000000000..bbf286b07 --- /dev/null +++ b/mobile/mobile.css @@ -0,0 +1,32 @@ +div.nav { + height: 40px; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + background-color: #ffffff; + border: 1px solid #999999; + text-align: center; + margin-bottom: 1em; +} +div.nav label { + line-height: 40px; + color: black; + font-weight: bold; +} +div.nav .button { + position: static; + margin: 5px 10px; + -webkit-border-image: url(../lib/iui/whiteButton.png) 0 12 0 12; + text-shadow: rgba(255, 255, 255, 0.7) 0 1px 0; + color: black; + cursor: pointer; /* On a touch screen ? */ +} +div.nav .button.left { + float: left; +} +div.nav .button.right { + float: right; +} + +ul li a.read { + color: #666666; +} diff --git a/mobile/mobile.js b/mobile/mobile.js index 669e63d09..57908bc08 100644 --- a/mobile/mobile.js +++ b/mobile/mobile.js @@ -58,3 +58,85 @@ function setPref(elem) { } }); } + +// Go directly to another item in the same feed +function goToSibling(article_id, feed_id, link, step) { + var links = linksInFeed(feed_id); + for (var i=0 ; i<links.length ; i++) { + var re = new RegExp(".*article\\.php\\?id="+article_id+"&.*"); + if (!re.test(links[i].href)) continue; + // here, we've found the current article + var index = i + step; + if (index < 0) { + markAsRead(feed_id); + iui.showPage($("feed-"+feed_id), true); + return false; + } + if (index >= links.length) { + showRestOfFeed(feed_id); + return false; + } + console.log(links[index]); + var match = links[index].href.match(/.*article\.php\?(.*)/); + var qs = match[1]; + var backwards = false; + if (step < 0) backwards = true; + link.setAttribute("selected", "progress"); + function unselect() { link.removeAttribute("selected"); } + iui.showPageByHref("article.php?"+qs, null, null, null, unselect, backwards); + return false; + } + return false; +} +function goPrev(article_id, feed_id, link) { + return goToSibling(article_id, feed_id, link, -1); +} +function goNext(article_id, feed_id, link) { + return goToSibling(article_id, feed_id, link, 1); +} + +// Get all the links in the feed. The all_links variable includes the "get more article" link +function linksInFeed(feed_id, all_links) { + var feed_content = $("feed-"+feed_id); + var links_raw = feed_content.getElementsByTagName("a"); + if (all_links) return links_raw; + var links = []; + // filter the array to remove the "get more articles" link + // and the "search" link (which is always first) + for (var i=1 ; i<links_raw.length ; i++) { + if (links_raw[i].href.match(/.*article\.php\?id=.*/)) { + links.push(links_raw[i]); + } + } + return links; +} + +// Adds the "read" class to all read links in the feed +function markAsRead(feed_id) { + var links = linksInFeed(feed_id); + for (var j=0 ; j<links.length ; j++) { + var match = links[j].href.match(/.*article\.php\?id=(\d+)&.*/); + if ($("article-"+match[1])) { + links[j].className = "read"; + } + } +} + +// Go the the articles list and expand the "get more articles" link +function showRestOfFeed(feed_id) { + var links_raw = linksInFeed(feed_id, true); + var lastlink = links_raw[links_raw.length - 1]; + if (lastlink.target == "_replace") { + // It's a "get more articles" link + iui.showPage($("feed-"+feed_id), true); + // Mark old items a "read" + markAsRead(feed_id); + // Simulate click on the "get more articles" link + lastlink.setAttribute("selected", "progress"); + function unselect() { lastlink.removeAttribute("selected"); } + setTimeout(window.scrollTo, 0, 0, 1000); + iui.showPageByHref(lastlink.href, null, null, lastlink, unselect); + } else { + iui.showPage($("home"), true); + } +} |