Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

add jquery widget, courtesy of github.com/lachlanhardy/seinfeld-badge

  • Loading branch information...
commit 47d39958153d2de96b09b74e8dab42c64c100cdd 1 parent abd8958
@technoweenie technoweenie authored
View
6 public/javascripts/widget/go.js
@@ -0,0 +1,6 @@
+$(document).ready(function(){
+ // making sexy unobtrusive CSS possible since 2006
+ $("html").addClass("js");
+
+ seinfeldBadge();
+});
View
31 public/javascripts/widget/seinfeld-badge.js
@@ -0,0 +1,31 @@
+function seinfeldBadge() {
+ $(".seinfeld-badge").each(function() {
+ var seinfeld = $(this);
+ var username = seinfeld.attr("class").replace(/.*user-([a-z0-9]+).*/gi, "$1");
+
+ $.getJSON("http://pipes.yahoo.com/pipes/pipe.run?_id=6ff23978d8e18aa8f62b196cd7d0fe78&_render=json&username=" + username + "&_callback=?", function(calendar){
+ var table = $("<div id=\"calendar\"/>").html(calendar.value.items[0].content);
+ table.find("thead th:contains('Month')").remove();
+ $("th.monthName", table).attr("colspan", "8");
+ seinfeld.append(table);
+
+ $("td.progressed", table).each(function(){
+ var that = $(this);
+ var x = $("<div class=\"xmarksthespot\"/>").css("height", that.height())
+ .css("width", that.width())
+ .append("<img src=\"http://calendaraboutnothing.com/images/x_1.png\" height=\"80%\" width=\"50%\">");
+ that.append(x);
+ });
+ });
+
+ $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fwww.calendaraboutnothing.com%2F~" + username + "%22%20and%20xpath%3D'%2F%2Fdiv%5B%40id%3D%22stats%22%5D%2Fdiv'%0A%20%20%20%20&format=json&callback=?", function(data){
+ var currentStreak = $("<strong>Current Streak: </strong>").append("<em>"+ data.query.results.div[0].span[1].content + "</em>");
+ var longestAnchor = $("<a/>").attr("href", data.query.results.div[1].a.href).text(data.query.results.div[1].a.span[1].content);
+ var longestStreak = $("<strong class=\"longest\">Longest Streak: </strong>").append(longestAnchor);
+ var streaks = $("<p class=\"streaks\"/>").append(currentStreak)
+ .append(longestStreak);
+ seinfeld.append(streaks);
+ seinfeld.append($("<p class=\"pimpage\"><a href=\"http://github.com/lachlanhardy/seinfeld-badge\">Want your own badge?</a></p>"));
+ });
+ });
+}
View
17 public/styles/main.css
@@ -151,7 +151,7 @@ a{
@group Calendar Styles
------------------------------------------------------------------------------------*/
-#calendar{
+#calendar, #widget{
margin:30px auto 15px auto;
padding:0 0 20px 0;
width:700px;
@@ -198,6 +198,21 @@ a{
color:#ccc;
}
+#widget form {
+ width:700px;
+ margin:0; padding:0;
+}
+
+#widget p{
+ font-size: 12px;
+}
+
+#widget textarea {
+ width:400px;
+ height:150px;
+ margin:0 150px;
+}
+
tr.dayname th{
width:100px;
padding:5px 0;
View
52 public/styles/widget/reset.css
@@ -0,0 +1,52 @@
+/****
+Modified version of the definitive CSS reset
+ Props to Eric Meyer (as always)
+ http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
+****/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-weight: inherit;
+ font-style: inherit;
+ font-size: 100.01%;
+ font-family: inherit;
+ vertical-align: baseline;
+}
+/* remember to define focus styles! */
+:focus {
+ outline: 0;
+}
+body {
+ line-height: 1.26;
+ color: black;
+ background: white;
+}
+ol, ul {
+ list-style: none;
+}
+/* tables still need 'cellspacing="0"' in the markup */
+table {
+ border-collapse: separate;
+ border-spacing: 0;
+}
+caption, th, td {
+ text-align: left;
+ font-weight: normal;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+ content: "";
+}
+blockquote, q {
+ quotes: "" "";
+}
View
20 public/styles/widget/screen.css
@@ -0,0 +1,20 @@
+/****
+Calendar About Nothing Badge sample page
+http://lachstock.com.au/
+20090418
+
+****/
+
+/* - =Structure - */
+body {background: #fff; color: #0e0e0e; font: 62.5%/1.3 Arial, 'Helvetica Neue', Helvetica, sans-serif; margin: 0; padding: 0;}
+
+h2, p, table {margin: 0 0 0.5em 0;}
+
+h1 {font-size: 2em;}
+h2 {font-size: 1.5em;}
+
+#page {font-size: 1.5em; padding: 1em; width: 300px;}
+
+ #header {background: #0e0e0e; border-bottom: 2px solid #666; color: #fff; font-size: 1.5em; padding: 0.2em 1em 0.5em 1em;}
+ #header h1 {background: #0e0e0e; color: #ff8000; font-weight: 700; letter-spacing: 0.06em; margin: 0;}
+
View
23 public/styles/widget/seinfeld-badge.css
@@ -0,0 +1,23 @@
+/****
+Seinfeld Badge
+http://github.com/lachlanhardy/seinfeld-badge
+20090418
+
+****/
+.seinfeld-badge {margin: 0 0 2em 0;}
+ .seinfeld-badge #calendar {border-bottom: 1px solid #000; border-top: 2px solid #000; margin: 1em 0 0 0; padding: 0 5px 5px 5px;}
+ .seinfeld-badge table {width: 100%;}
+ .seinfeld-badge th.monthName {color: #b20000; font-weight: 700; letter-spacing: 5px; padding: 5px 0; text-align: center; text-transform: uppercase;}
+ .seinfeld-badge tr.dayName th {font-weight: 700; letter-spacing: 2px; padding: 5px 0; text-align: center; text-transform: uppercase;}
+ .seinfeld-badge td {position: relative; text-align: center;}
+ .seinfeld-badge td.otherMonth {color: #ccc;}
+ .seinfeld-badge td.today {color: green;}
+ .seinfeld-badge .xmarksthespot{margin: -1.3% 0 0 0; position: absolute; z-index: 100;}
+ .seinfeld-badge .otherMonth .xmarksthespot{opacity: 0.2;}
+
+ .seinfeld-badge p.streaks {font-size: 0.9em; margin: 0 0.4em 0 0.4em;}
+ .seinfeld-badge p.streaks strong {font-weight: 700;}
+ .seinfeld-badge p.streaks strong em,
+ .seinfeld-badge p.streaks strong a {font-style: normal; font-weight: 300;}
+ .seinfeld-badge .longest {float: right; margin: -1.3em 0 0 0; width: auto;}
+ .seinfeld-badge p.pimpage {float: right; color: #ccc; font-size: 0.8em; margin: 0.5em 0.4em 0 0.4em; width: auto;}
View
20 seinfeld_calendar.rb
@@ -29,42 +29,40 @@
end
get '/~:name.json' do
- cache_for 5.minutes
show_user_json
end
+get '/~:name/widget' do
+ cache_for 1.hour
+ @user = Seinfeld::User.first(:login => params[:name])
+ haml :widget
+end
+
get '/~:name' do
- cache_for 5.minutes
show_user_calendar
end
get '/~:name/:year.json' do
- cache_for 5.minutes
show_user_json
end
get '/~:name/:year' do
- cache_for 5.minutes
show_user_calendar
end
get '/~:name/:year/:month.json' do
- cache_for 5.minutes
show_user_json
end
get '/~:name/:year/:month' do
- cache_for 5.minutes
show_user_calendar
end
get '/group/:names' do
- cache_for 5.minutes
show_group_calendar
end
get '/group/:names/:year/:month' do
- cache_for 5.minutes
show_group_calendar
end
@@ -101,7 +99,7 @@ def get_user_and_progressions(extra = 0)
end
def show_user_calendar
- response['Cache-Control'] = 'public, max-age=300'
+ cache_for 5.minutes
@progressions = get_user_and_progressions(6)
if @user
haml :show
@@ -111,7 +109,7 @@ def show_user_calendar
end
def show_group_calendar
- response['Cache-Control'] = 'public, max-age=300'
+ cache_for 5.minutes
@progressions = Set.new
@users = params[:names].split(',')
@users.each do |name|
@@ -122,7 +120,7 @@ def show_group_calendar
end
def show_user_json
- response['Cache-Control'] = 'public, max-age=300'
+ cache_for 5.minutes
@progressions = get_user_and_progressions
json = {:days => @progressions.map { |p| p.to_s }.sort!, :longest_streak => @user.longest_streak, :current_streak => @user.current_streak}.to_json
if params[:callback]
View
6 views/show.haml
@@ -31,4 +31,8 @@
%span.desc days
#content.footnote
%a{:href => "http://calendaraboutnothing.com"} Calendar About Nothing
- by <a href="http://techno-weenie.net">rick</a> and <a href="http://warpspire.com/">kyle</a> / <a href="http://entp.com">ENTP</a>
+ by <a href="http://techno-weenie.net">rick</a> and <a href="http://warpspire.com/">kyle</a> / <a href="http://entp.com">ENTP</a>
+ #content.footnote
+ Put the
+ %a{:href=> "/~#{@user.login}/widget"} javascript widget
+ on your site!
View
65 views/widget.haml
@@ -0,0 +1,65 @@
+%html
+ %head
+ %title
+ = page_title
+ %link{:rel => 'icon', :type => 'image/png', :href => '/images/apple-touch-icon.png', :sizes => '48x48'}
+ %link{:rel => 'stylesheet', :type => 'text/css', :href => '/styles/main.css'}
+
+ %link{:rel => 'stylesheet', :type => 'text/css', :href => '/styles/widget/seinfeld-badge.css'}
+
+ %script{:type => 'text/javascript', :src => 'http://jscdn.net/jquery-1.3.2.js'}
+ %body
+ .title
+ %a{:rel => "me", :href => "http://github.com/#{@user.login}"}
+ == #{@user.login}'s
+ CAN Widget
+ %form#widget
+ %p
+ This javascript widget was written by
+ %a{:href => "http://github.com/lachlanhardy"} lachlanhardy
+ and uses jQuery. Please direct any requests or patches to the
+ %a{:href => "http://github.com/lachlanhardy/seinfeld-badge"} seinfeld-badge
+ repo so they can be pushed upstream to the CAN.
+ %p
+ %textarea
+ :preserve
+ <link rel="stylesheet" href="http://www.calendaraboutnothing.com/styles/widget/reset.css" media="screen, projection" type="text/css">
+ <link rel="stylesheet" href="http://www.calendaraboutnothing.com/styles/widget/screen.css" media="screen, projection" type="text/css">
+ <link rel="stylesheet" href="http://www.calendaraboutnothing.com/styles/widget/seinfeld-badge.css" media="screen, projection" type="text/css">
+
+ <div class="seinfeld-badge user-#{@user.login}">
+ <h2>I like open software</h2>
+ <p><a href="http://www.calendaraboutnothing.com/~#{@user.login}" rel="me">Calendar About Nothing</a> tracks my public contributions on <A href="http://github.com/">GitHub</a>.</p>
+ </div> <!-- .seinfeld-badge .user-#{@user.login} -->
+
+ <!-- Using the new CDN for JS from Lindsay Evans - http://jscdn.net/ -->
+ <script src="http://jscdn.net/jquery-1.3.2.js" type="text/javascript"></script>
+ <!-- // JSCDN hosting -->
+
+ <!-- Adding Seinfeld CAN Badge -->
+ <script src="http://calendaraboutnothing.com/javascripts/widget/seinfeld-badge.js" type="text/javascript"></script>
+ <!-- // Seinfeld badge-->
+
+ <!-- Calling JS fun -->
+ <script src="http://calendaraboutnothing.com/javascripts/widget/go.js" type="text/javascript"></script>
+ <!-- // Calling JS fun -->
+ %p
+ %a{:href => "/~#{@user.login}"} &#171; BACK
+ #main
+ #stats
+ .current_streak
+ %span.type
+ current streak
+ %span.num
+ = @user.current_streak
+ %span.desc days
+ .longest_streak
+ %a{:href => @user.longest_streak_url}
+ %span.type
+ longest streak
+ %span.num
+ = @user.longest_streak
+ %span.desc days
+ #content.footnote
+ %a{:href => "http://calendaraboutnothing.com"} Calendar About Nothing
+ by <a href="http://techno-weenie.net">rick</a> and <a href="http://warpspire.com/">kyle</a> / <a href="http://entp.com">ENTP</a>
Please sign in to comment.
Something went wrong with that request. Please try again.