Permalink
Browse files

Update

  • Loading branch information...
1 parent 9622f35 commit feb3225fa0aef3359255d50c03bc02897a39eed7 Joe Van Dyk committed Nov 8, 2009
Showing with 350 additions and 2 deletions.
  1. +1 −0 .gems
  2. +1 −0 .gitignore
  3. +53 −2 news.rb
  4. +143 −0 public/iphonenav.css
  5. +147 −0 public/iphonenav.js
  6. +5 −0 views/index.haml
View
1 .gems
@@ -0,0 +1 @@
+nokogiri
View
@@ -0,0 +1 @@
+.*sw*
View
55 news.rb
@@ -1,6 +1,57 @@
require 'rubygems'
require 'sinatra'
+require 'open-uri'
+require 'nokogiri'
-get '/' do
- "Hello!"
+Y = "http://news.ycombinator.com"
+
+def url_for_y path
+ "#{Y}#{path}"
+end
+
+def cache_it
+ headers['Cache-Control'] = 'public, max-age=60'
+end
+
+def remote_load url
+ open(url).read
+end
+
+def style_for_iphone text
+ doc = Nokogiri::HTML(text)
+
+ html = '<html><head>'
+ html << '<meta name="viewport" content="width=320; initial-scale=0.6; maximum-scale=1.0; user-scalable=0;"/>'
+ html << '<style type="text/css" media="screen">@import "/iphonenav.css";</style>'
+ html << '<title>Fixie Iphone for y-combinator</title>'
+ html << '</head>'
+ html << '<body>'
+
+ html << '<h1 id="pageTitle"><a href="/">Y Combinator</a></h1>'
+
+ html << '<ul selected="true">'
+ doc.css('tr').each do |row|
+ if story_title = row.css('td.title > a').first
+ html << '<li>'
+ html << "<a href='#{story_title['href']}'>#{story_title.content}</a>"
+ end
+ if subtext = row.css('td.subtext').first
+ comments_link = subtext.css('a').last
+ html << "<a href='#{comments_link['href']}'>#{comments_link.content}\n"
+ html << '</li>'
+ end
+ end
+ html << '</ul>'
+ html << '</body></html>'
+ html
+end
+
+get '*' do
+ cache_it
+ content = remote_load(url_for_y(request.fullpath))
+ if %w(/ /x).include?(request.path_info)
+ style_for_iphone(content)
+ else
+ content
+ end
end
View
@@ -0,0 +1,143 @@
+
+body {
+ margin: 0;
+ font-family: Helvetica;
+ background: #FFFFFF;
+ color: #000000;
+ overflow: hidden;
+ -webkit-text-size-adjust: none;
+}
+
+body > h1 {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 10px;
+ line-height: 20px;
+ font-size: 20px;
+ font-weight: bold;
+ text-align: center;
+ text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
+ text-overflow: ellipsis;
+ color: #FFFFFF;
+ background: url(iPhoneToolbar.png) #6d84a2 repeat-x;
+ border-bottom: 1px solid #2d3642;
+}
+
+.button {
+ position: absolute;
+ top: 8px;
+ right: 6px;
+ -webkit-border-image: url(iPhoneButton.png) 0 5 0 5;
+ -webkit-border-radius: 0;
+ border-width: 0 5px 0 5px;
+ padding: 0;
+ height: 28px;
+ line-height: 28px;
+ font-size: 12px;
+ font-weight: bold;
+ color: #FFFFFF;
+ text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
+ text-decoration: none;
+ background: none;
+}
+
+#homeButton {
+ display: none;
+ left: 6px;
+ right: auto;
+ -webkit-border-image: url(iPhoneBackButton.png) 0 8 0 14;
+ border-width: 0 8px 0 14px;
+}
+
+.goButton {
+ -webkit-border-image: url(iPhoneGoButton.png) 0 5 0 5;
+ border-width: 0 5px;
+}
+
+body > div,
+body > form,
+body > ul {
+ display: none;
+ position: absolute;
+ left: 0;
+ top: 41px;
+ width: 100%;
+ min-height: 418px;
+ margin: 0;
+ padding: 0;
+}
+
+body > *[selected="true"] {
+ display: block;
+}
+
+body > ul > li {
+ margin: 0;
+ border-bottom: 1px solid #E0E0E0;
+ padding: 0;
+ background: url(iPhoneArrow.png) no-repeat right center;
+ font-size: 20px;
+ font-weight: bold;
+ list-style: none;
+}
+
+body > ul > li > a {
+ display: block;
+ padding: 8px 32px 8px 8px;
+ text-decoration: none;
+ color: inherit;
+}
+
+.panel {
+ box-sizing: border-box;
+ padding: 10px;
+ background: #c8c8c8 url(pinstripes.png);
+}
+
+/************************************************************************************************/
+
+.dialog {
+ position: absolute;
+ top: 0;
+ width: 100%;
+ min-height: 468px;
+ z-index: 2;
+ background: rgba(0, 0, 0, 0.8);
+ padding: 0;
+ text-align: right;
+}
+
+fieldset {
+ box-sizing: border-box;
+ width: 100%;
+ margin: 0;
+ border: none;
+ padding: 10px 6px;
+ background: url(iPhoneToolbar.png) #7388a5 repeat-x;
+}
+
+fieldset > h1 {
+ margin: 0 10px 0 10px;
+ padding: 0;
+ font-size: 20px;
+ font-weight: bold;
+ color: #FFFFFF;
+ text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
+ text-align: center;
+}
+
+label {
+ position: absolute;
+ margin: 14px 0 0 6px;
+ font-size: 14px;
+ color: #BBBBBB;
+}
+
+input {
+ box-sizing: border-box;
+ width: 100%;
+ margin: 6px 0 0 0;
+ padding: 6px 6px 6px 44px;
+ font-size: 16px;
+ font-weight: normal;
+}
View
@@ -0,0 +1,147 @@
+
+(function() {
+
+var animateX = -20;
+var animateInterval = 24;
+
+var currentPage = null;
+var currentDialog = null;
+var currentWidth = 0;
+var currentHash = location.hash;
+var hashPrefix = "#_";
+var pageHistory = [];
+
+addEventListener("load", function(event)
+{
+ var body = document.getElementsByTagName("body")[0];
+ for (var child = body.firstChild; child; child = child.nextSibling)
+ {
+ if (child.nodeType == 1 && child.getAttribute("selected") == "true")
+ {
+ showPage(child);
+ break;
+ }
+ }
+
+ setInterval(checkOrientAndLocation, 300);
+ setTimeout(scrollTo, 0, 0, 1);
+}, false);
+
+addEventListener("click", function(event)
+{
+ event.preventDefault();
+
+ var link = event.target;
+ while (link && link.localName.toLowerCase() != "a")
+ link = link.parentNode;
+
+ if (link && link.hash)
+ {
+ var page = document.getElementById(link.hash.substr(1));
+ showPage(page);
+ }
+}, true);
+
+function checkOrientAndLocation()
+{
+ if (window.outerWidth != currentWidth)
+ {
+ currentWidth = window.outerWidth;
+
+ var orient = currentWidth == 320 ? "profile" : "landscape";
+ document.body.setAttribute("orient", orient);
+ }
+
+ if (location.hash != currentHash)
+ {
+ currentHash = location.hash;
+
+ var pageId = currentHash.substr(hashPrefix.length);
+ var page = document.getElementById(pageId);
+ if (page)
+ {
+ var index = pageHistory.indexOf(pageId);
+ var backwards = index != -1;
+ if (backwards)
+ pageHistory.splice(index, pageHistory.length);
+
+ showPage(page, backwards);
+ }
+ }
+}
+
+function showPage(page, backwards)
+{
+ if (currentDialog)
+ {
+ currentDialog.removeAttribute("selected");
+ currentDialog = null;
+ }
+
+ if (page.className.indexOf("dialog") != -1)
+ showDialog(page);
+ else
+ {
+ location.href = currentHash = hashPrefix + page.id;
+ pageHistory.push(page.id);
+
+ var fromPage = currentPage;
+ currentPage = page;
+
+ var pageTitle = document.getElementById("pageTitle");
+ pageTitle.innerHTML = page.title || "";
+
+ var homeButton = document.getElementById("homeButton");
+ if (homeButton)
+ homeButton.style.display = ("#"+page.id) == homeButton.hash ? "none" : "inline";
+
+ if (fromPage)
+ setTimeout(swipePage, 0, fromPage, page, backwards);
+ }
+}
+
+function swipePage(fromPage, toPage, backwards)
+{
+ toPage.style.left = "100%";
+ toPage.setAttribute("selected", "true");
+ scrollTo(0, 1);
+
+ var percent = 100;
+ var timer = setInterval(function()
+ {
+ percent += animateX;
+ if (percent <= 0)
+ {
+ percent = 0;
+ fromPage.removeAttribute("selected");
+ clearInterval(timer);
+ }
+
+ fromPage.style.left = (backwards ? (100-percent) : (percent-100)) + "%";
+ toPage.style.left = (backwards ? -percent : percent) + "%";
+ }, animateInterval);
+}
+
+function showDialog(form)
+{
+ currentDialog = form;
+ form.setAttribute("selected", "true");
+
+ form.onsubmit = function(event)
+ {
+ event.preventDefault();
+ form.removeAttribute("selected");
+
+ var index = form.action.lastIndexOf("#");
+ if (index != -1)
+ showPage(document.getElementById(form.action.substr(index+1)));
+ }
+
+ form.onclick = function(event)
+ {
+ if (event.target == form)
+ form.removeAttribute("selected");
+ }
+}
+
+})();
View
@@ -0,0 +1,5 @@
+%html
+ %head
+ %title Joe Rocks
+ %body
+ %p I do rock

0 comments on commit feb3225

Please sign in to comment.