Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Merge pull request #10 from amarshall/tabs

Tabs & more
  • Loading branch information...
commit d8f43a0a3c20eedb50b671106a24a54e45f23328 2 parents ae966ca + 01f6696
@seanmoon authored
View
5 app/helpers/application_helper.rb
@@ -1,4 +1,9 @@
module ApplicationHelper
+ def link_to_with_current(name, url)
+ options = (current_page? url) ? { class: "current" } : {}
+ link_to name, url, options
+ end
+
def location
ENV["PIVOT_PONG_LOCATION"] || "NYC"
end
View
21 app/views/layouts/application.html.haml
@@ -1,10 +1,10 @@
-<!DOCTYPE html>
+!!! 5
%html
%head
- %title== Pivot Pong - #{location}
+ %title Pivot Pong #{location} — #{yield :title}
= stylesheet_link_tag 'reset', 'pong', 'jquery.autocomplete'
= javascript_include_tag :defaults
- = javascript_include_tag 'jquery.autocomplete'
+ = javascript_include_tag 'jquery.autocomplete', 'jquery.tabs'
= javascript_include_tag "http://use.typekit.com/rol0dzy.js"
= javascript_tag "try{Typekit.load();}catch(e){}"
= favicon_link_tag
@@ -12,8 +12,13 @@
%body
#page
- #content
- %h1== pivot pong #{location.downcase}
- = render 'shared/flash_messages'
- = yield
- = link_to "source code", "https://github.com/seanmoon/pivot-pong", class: "source"
+ %header
+ %h1 pivot pong #{location.downcase}
+ %nav
+ = link_to_with_current "Rankings", root_path
+ = link_to_with_current "Matches", matches_path
+
+ = render 'shared/flash_messages'
+ = yield
+ %footer
+ = link_to "source code", "https://github.com/seanmoon/pivot-pong"
View
9 app/views/matches/index.html.haml
@@ -1,7 +1,4 @@
-%h2 Add a match
-
-%nav
- = link_to "Rankings", root_path
+- content_for :title, "Matches"
= form_for(@match) do |f|
= label_tag :winner_name
@@ -26,7 +23,3 @@
%td= m.winner.display_name
%td= m.loser.display_name
%td.action= link_to "delete", match_path(m), method: :delete
-
-
-%nav
- = link_to "Rankings", root_path
View
35 app/views/matches/rankings.html.haml
@@ -1,22 +1,23 @@
-%h2 Rankings
+- content_for :title, "Rankings"
-%nav
- = link_to "Matches", matches_path
+.tabs
+ %ul.tab-bar
+ %li= link_to "All time", "#all-time"
+ %li= link_to "Last 30 days", "#30-days"
+ %li= link_to "Last 90 days", "#90-days"
-%h1 All time
-%ol.rankings
- - @rankings.each do |player|
- %li{class: cycle("even", "odd")}= player.display_name
+ %ol#all-time.rankings
+ - @rankings.each do |player|
+ %li{class: cycle("even", "odd")}= player.display_name
-%h1 Last 30 days
-%ol.rankings
- - @last_30_days_rankings.each do |player|
- %li{class: cycle("even", "odd")}= player
+ - reset_cycle
-%h1 Last 90 days
-%ol.rankings
- - @last_90_days_rankings.each do |player|
- %li{class: cycle("even", "odd")}= player
+ %ol#30-days.rankings
+ - @last_30_days_rankings.each do |player|
+ %li{class: cycle("even", "odd")}= player
-%nav
- = link_to "Matches", matches_path
+ - reset_cycle
+
+ %ol#90-days.rankings
+ - @last_90_days_rankings.each do |player|
+ %li{class: cycle("even", "odd")}= player
View
6 app/views/shared/_flash_messages.html.haml
@@ -1,8 +1,6 @@
- if notice || alert
.flash
- if notice
- .notice
- = notice
+ .notice= notice
- if alert
- .alert
- = alert
+ .alert= alert
View
21 db/seeds.rb
@@ -6,12 +6,17 @@
# cities = City.create([{ :name => 'Chicago' }, { :name => 'Copenhagen' }])
# Mayor.create(:name => 'Daley', :city => cities.first)
#
-# <Match id: 1, winner: "Adam", loser: "Bob", created_at: "2011-07-08 00:21:06", updated_at: "2011-07-08 00:21:06", occured_at: "2011-07-07 20:20:59">
+# <Match id: 1, winner: "Adam", loser: "Bob", created_at: "2011-07-08 00:21:06", updated_at: "2011-07-08 00:21:06", occured_at: "2011-07-07 20:20:59">
#
-Match.create(:winner => "Adam", :loser => "Bob")
-Match.create(:winner => "Bob", :loser => "Carol")
-Match.create(:winner => "Carol", :loser => "Dave")
-Match.create(:winner => "Dave", :loser => "Ed")
-Match.create(:winner => "Adam", :loser => "Carol")
-Match.create(:winner => "Adam", :loser => "Dave")
-Match.create(:winner => "Adam", :loser => "Ed")
+adam = Player.create(name: "Adam")
+bob = Player.create(name: "Bob")
+carol = Player.create(name: "Carol")
+dave = Player.create(name: "Dave")
+ed = Player.create(name: "Ed")
+Match.create(winner: adam, loser: bob)
+Match.create(winner: bob, loser: carol)
+Match.create(winner: carol, loser: dave)
+Match.create(winner: dave, loser: ed)
+Match.create(winner: adam, loser: carol)
+Match.create(winner: adam, loser: dave)
+Match.create(winner: adam, loser: ed)
View
3  public/javascripts/application.js
@@ -1,3 +1,4 @@
$(document).ready( function(){
$('#new_match input[type=text]').autocomplete('/matches/players');
-});
+ $('.tab-bar').tabs();
+});
View
33 public/javascripts/jquery.tabs.js
@@ -0,0 +1,33 @@
+(function($) {
+ $.fn.tabs = function() {
+ var $this = $(this);
+ var tabs = [];
+ $this.data("currentTab", $("<p></p>"));
+
+ var switchToTab = function(elem) {
+ console.log(elem);
+ $elem = $(elem);
+ current = $this.data("currentTab");
+ $(current).hide();
+ $("a[href='" + current + "']").removeClass("current");
+ $elem.show();
+ $("a[href='" + elem + "']").addClass("current");
+ $this.data("currentTab", elem);
+ }
+
+ $this.children().each(function() {
+ var link = $(this).find("a").first();
+ var id = link.attr("href");
+ tabs.push(id);
+ $(id).hide();
+ link.click(function(e) {
+ e.preventDefault();
+ switchToTab(id);
+ });
+ });
+
+ switchToTab(tabs[0]);
+
+ return this;
+ }
+})(jQuery);
View
92 public/stylesheets/pong.css
@@ -2,68 +2,102 @@ body {
font-family: "coolvetica-1", "coolvetica-2", Helvetica, Arial, sans-serif;
}
-body h1 {
+body > * {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ -ms-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+h1, h3 {
font-size: 36px;
margin: 10px 0;
}
-body a {
+a {
text-decoration: none;
- color: #cc5500;
+ color: #c50;
}
-nav a {
- display: block;
- margin-top: 20px;
+a.current {
+ color: #eee;
+ background-color: #c50;
+ padding-left: 3px;
+ padding-right: 3px;
+}
+
+header {
+ margin-bottom: 20px;
+}
+
+header > * {
+ display: inline;
+}
+
+header nav {
+ margin-left: 10px;
+ vertical-align: 4px;
+}
+
+header nav a + a {
+ margin-left: 10px;
+}
+
+footer {
+ font-size: 12px;
+}
+
+footer a {
+ float: right;
}
-body ol {
+ol {
font-size: 48px;
- margin: 20px auto;
- width: 550px;
+ margin-top: 10px;
+ margin-bottom: 20px;
}
-body li {
+li {
padding: 5px 25px;
width: 500px;
list-style-position: inside;
}
-body li, body td {
+li, td {
white-space: nowrap;
text-overflow: ellipsis;
}
-body table {
+table {
table-layout: fixed;
margin: 10px 0px;
width: 550px;
}
-body tr {
+tr {
height: 20px;
}
-body th, body td {
+th, td {
padding: 2px 5px;
vertical-align: middle;
}
-body th {
+th {
background-color: #333;
color: white;
overflow: hidden;
}
-body td {
+td {
width: 200px;
}
-body form {
+form {
margin: 10px 0;
}
-body input[type='text'] {
+input[type='text'] {
font-size: 24px;
display: block;
width: 100%;
@@ -86,24 +120,28 @@ td.action, th.action {
border-left: 1px solid #999;
border-right: 1px solid #999;
width: 600px;
-}
-
-#content {
padding: 25px;
- background-color: #DEDEDE;
+ background-color: #dedede;
}
.even {
- background-color: #F0F0F0;
+ background-color: #f0f0f0;
}
.odd {
- background-color: #E7E7E7;
+ background-color: #e7e7e7;
}
-a.source {
- font-size: 12px;
- float: right;
+.tabs {
+ margin-top: 20px;
+}
+
+.tab-bar {
+ list-style-type: none;
+}
+
+.tab-bar li {
+ display: inline;
}
.flash {
View
32 spec/helpers/application_helper_spec.rb
@@ -1,21 +1,37 @@
require 'spec_helper'
describe ApplicationHelper do
+ describe "#link_to_with_current" do
+ let(:name) { "My Link" }
+ let(:url) { "/the/url" }
+ subject { helper.link_to_with_current(name, url) }
+
+ context "when the URL is the current page" do
+ before { view.stub(:current_page?) { true } }
+
+ it { should include('class="current"') }
+ end
+
+ context "when the URL is not the current page" do
+ before { view.stub(:current_page?) { false } }
+
+ it { should_not include('class="current"') }
+ end
+ end
+
describe "#location" do
+ subject { helper.location }
+
context "when no location is configured" do
- it "returns nyc" do
- helper.location.should == "NYC"
- end
+ it { should == "NYC" }
end
-
+
context "when a location is configured" do
before do
ENV["PIVOT_PONG_LOCATION"] = "Starbase Alpha"
end
-
- it "returns that location" do
- helper.location.should == "Starbase Alpha"
- end
+
+ it { should == "Starbase Alpha" }
end
end
end
View
2  spec/spec_helper.rb
@@ -24,4 +24,6 @@
# examples within a transaction, remove the following line or assign false
# instead of true.
config.use_transactional_fixtures = true
+
+ config.color_enabled = true
end
View
1  spec/views/matches/index.html.haml_spec.rb
@@ -11,6 +11,5 @@
it { should include("Cl") }
it { should include("Minzy") }
it { should include(occured_at.strftime("%Y-%m-%d")) }
- it { should include(link_to "Rankings", "/") }
it { should include(link_to "delete", match_path(match), method: :delete) }
end
View
1  spec/views/matches/rankings.html.haml_spec.rb
@@ -15,5 +15,4 @@
it { should include("two") }
it { should include("meow") }
it { should include("woof") }
- it { should include(link_to "Matches", matches_path) }
end
Please sign in to comment.
Something went wrong with that request. Please try again.