Permalink
Browse files

Changed some styles to accomodate longer quotes. Added a variable tim…

…eout for each quote for readability. Added some quotes provided by Jason Lefton.
  • Loading branch information...
1 parent 28bcc31 commit c9f8dfe0b3d14c4aaf8e4412350f2be94f4a0d0d @jmhobbs committed Feb 23, 2010
Showing with 30 additions and 12 deletions.
  1. +7 −2 clcm.js
  2. +1 −1 clcm.min.js
  3. +1 −1 index.html
  4. +17 −4 quote.php
  5. +3 −3 style.css
  6. +1 −1 style.min.css
View
9 clcm.js
@@ -120,8 +120,13 @@ var CLCM = {
CLCM.sayer.append( sayer );
CLCM.effect.fadeIn(
function () {
- if( false != CLCM.quote_timer )
- CLCM.quote_timer = setTimeout( CLCM.fresh_quote, 7500 );
+ if( false != CLCM.quote_timer ) {
+ if( null != data.showfor )
+ show_for = data.showfor
+ else
+ show_for = 7500
+ CLCM.quote_timer = setTimeout( CLCM.fresh_quote, show_for );
+ }
}
);
}
View
2 clcm.min.js
@@ -1 +1 @@
-var CLCM={box:null,quote:null,effect:null,sayer:null,link_box:null,body:null,play_pause:null,banner:null,debounce_resize:null,control_fader:null,control_fading_in:false,control_faded_in:false,token:"",quote_timer:null,init:function(){CLCM.token=Math.random();CLCM.box=$("#quote-box");CLCM.quote=$("#quote");CLCM.effect=$("#effect-wrapper");CLCM.sayer=$("#sayer");CLCM.body=$("body");CLCM.play_pause=$("#play-pause");CLCM.link_box=$("#link-box");CLCM.banner=CLCM.quote.children().clone();CLCM.link_box.hide();CLCM.play_pause.bind("click",CLCM.change_state);$(window).bind("resize",CLCM.window_resize).trigger("resize").bind("mousemove",CLCM.window_mousemove);CLCM.quote_timer=setTimeout(CLCM.fresh_quote,2500)},window_resize:function(){if(CLCM.debounce_resize){clearTimeout(CLCM.debounce_resize)}CLCM.debounce_resize=setTimeout(CLCM.reposition,50)},window_mousemove:function(){if(CLCM.control_fader){clearTimeout(CLCM.control_fader)}CLCM.control_fader=setTimeout(CLCM.fade_controls,2500);if(CLCM.control_fading_in&&CLCM.link_box.is(":animated")){return}if(CLCM.control_faded_in){return}CLCM.control_fading_in=true;CLCM.control_faded_in=false;CLCM.link_box.fadeIn("fast",function(){CLCM.control_faded_in=true})},fade_controls:function(){CLCM.control_faded_in=false;CLCM.control_fading_in=false;CLCM.link_box.stop().fadeOut("fast")},reposition:function(){_height=CLCM.body.height();_width=CLCM.body.width();CLCM.box.animate({left:(_width-750)/2+"px",top:(_height-550)/2+"px"},"fast")},fresh_quote:function(){$.getJSON("quote.json",{token:CLCM.token},function(a){CLCM.effect.fadeOut(function(){CLCM.quote.empty();if(true==a.completed){CLCM.quote.append(CLCM.banner);CLCM.sayer.empty();CLCM.effect.fadeIn("fast");CLCM.play_pause.text("restart")}else{if(true==a.charity){CLCM.quote.addClass("charity")}else{CLCM.quote.removeClass("charity")}CLCM.quote.append(a.content);CLCM.sayer.empty();if(null!=a.link){sayer=$('<a href="'+a.link+'" target="_blank">'+a.name+"</a>")}else{sayer=a.name}CLCM.sayer.append(sayer);CLCM.effect.fadeIn(function(){if(false!=CLCM.quote_timer){CLCM.quote_timer=setTimeout(CLCM.fresh_quote,7500)}})}})})},change_state:function(){if("restart"==CLCM.play_pause.text()){CLCM.play_pause.text("stop");CLCM.token=Math.random();CLCM.quote_timer=false}if(false==CLCM.quote_timer){CLCM.play_pause.text("pause");CLCM.quote_timer=null;CLCM.fresh_quote()}else{CLCM.play_pause.text("play");if(CLCM.quote_timer){clearTimeout(CLCM.quote_timer);CLCM.quote_timer=false}}},};
+var CLCM={box:null,quote:null,effect:null,sayer:null,link_box:null,body:null,play_pause:null,banner:null,debounce_resize:null,control_fader:null,control_fading_in:false,control_faded_in:false,token:"",quote_timer:null,init:function(){CLCM.token=Math.random();CLCM.box=$("#quote-box");CLCM.quote=$("#quote");CLCM.effect=$("#effect-wrapper");CLCM.sayer=$("#sayer");CLCM.body=$("body");CLCM.play_pause=$("#play-pause");CLCM.link_box=$("#link-box");CLCM.banner=CLCM.quote.children().clone();CLCM.link_box.hide();CLCM.play_pause.bind("click",CLCM.change_state);$(window).bind("resize",CLCM.window_resize).trigger("resize").bind("mousemove",CLCM.window_mousemove);CLCM.quote_timer=setTimeout(CLCM.fresh_quote,2500)},window_resize:function(){if(CLCM.debounce_resize){clearTimeout(CLCM.debounce_resize)}CLCM.debounce_resize=setTimeout(CLCM.reposition,50)},window_mousemove:function(){if(CLCM.control_fader){clearTimeout(CLCM.control_fader)}CLCM.control_fader=setTimeout(CLCM.fade_controls,2500);if(CLCM.control_fading_in&&CLCM.link_box.is(":animated")){return}if(CLCM.control_faded_in){return}CLCM.control_fading_in=true;CLCM.control_faded_in=false;CLCM.link_box.fadeIn("fast",function(){CLCM.control_faded_in=true})},fade_controls:function(){CLCM.control_faded_in=false;CLCM.control_fading_in=false;CLCM.link_box.stop().fadeOut("fast")},reposition:function(){_height=CLCM.body.height();_width=CLCM.body.width();CLCM.box.animate({left:(_width-750)/2+"px",top:(_height-550)/2+"px"},"fast")},fresh_quote:function(){$.getJSON("quote.json",{token:CLCM.token},function(a){CLCM.effect.fadeOut(function(){CLCM.quote.empty();if(true==a.completed){CLCM.quote.append(CLCM.banner);CLCM.sayer.empty();CLCM.effect.fadeIn("fast");CLCM.play_pause.text("restart")}else{if(true==a.charity){CLCM.quote.addClass("charity")}else{CLCM.quote.removeClass("charity")}CLCM.quote.append(a.content);CLCM.sayer.empty();if(null!=a.link){sayer=$('<a href="'+a.link+'" target="_blank">'+a.name+"</a>")}else{sayer=a.name}CLCM.sayer.append(sayer);CLCM.effect.fadeIn(function(){if(false!=CLCM.quote_timer){if(null!=a.showfor){show_for=a.showfor}else{show_for=7500}CLCM.quote_timer=setTimeout(CLCM.fresh_quote,show_for)}})}})})},change_state:function(){if("restart"==CLCM.play_pause.text()){CLCM.play_pause.text("stop");CLCM.token=Math.random();CLCM.quote_timer=false}if(false==CLCM.quote_timer){CLCM.play_pause.text("pause");CLCM.quote_timer=null;CLCM.fresh_quote()}else{CLCM.play_pause.text("play");if(CLCM.quote_timer){clearTimeout(CLCM.quote_timer);CLCM.quote_timer=false}}},};
View
2 index.html
@@ -17,7 +17,7 @@
<div id="quote-box">
<div id="effect-wrapper">
<div id="quote">
- <div style="font-size: 60px; padding-top: 50px; padding-left: 50px;">
+ <div style="font-size: 60px; padding-top: 50px; padding-left: 100px;">
<span style="color: #A44;">CONSUME LESS</span><br/>
CREATE MORE
</div>
View
21 quote.php
@@ -81,7 +81,6 @@
);
$quotes = array(
- // Create More
array(
"content" => "Our duty, as men and women, is to proceed as if limits to our ability did not exist. We are collaborators in creation.",
"name" => "Teilhard de Chardin",
@@ -136,14 +135,12 @@
"link" => null,
"source" => "http://www.wisdomquotes.com/cat_creativity.html"
),
- // Mixed
- array(
+ array(
"content" => "Happiness is not in the mere possession of money; it lies in the joy of achievement, in the thrill of creative effort.",
"name" => "Franklin D. Roosevelt",
"link" => null,
"source" => "http://www.wisdomquotes.com/cat_creativity.html"
),
- // Consume Less
array(
"content" => "Growth for the sake of growth is the ideology of the cancer cell.",
"name" => "Edward Abbey",
@@ -191,6 +188,22 @@
"name" => "Ludwig Wittgenstein",
"link" => null,
"source" => "http://en.wikiquote.org/wiki/Ludwig_Wittgenstein"
+ ),
+ // Courtesy of Jason Lefton - http://hellogylo.com/
+ array(
+ "content" => "I believe in technology, but I think we need to make it more human. I believe that the Internet is becoming a planetary meta-organism, but that it is up to us to guide its evolution, and to shape it into a space we actually want to inhabit - one that can understand and honor both the individual human and the human collective, just like real life does.",
+ "name" => "Jonathan Harris",
+ "link" => null,
+ "source" => null,
+ "showfor" => 15000
+ ),
+ // Courtesy of Jason Lefton - http://hellogylo.com/
+ array(
+ "content" => "This is something that I've said before and I'll say it again: I've spent five years on this. You should spend an hour on it. You know, spend two hours on it. That would be the decent, respectful thing to do, as opposed to writing a snarky five-minute thing that's making fun of me, or saying what other people have said.",
+ "name" => "Charlie Kaufman",
+ "link" => null,
+ "source" => null,
+ "showfor" => 15000
)
);
View
6 style.css
@@ -14,11 +14,11 @@ a {
#quote-box {
background: url(background.gif) no-repeat;
height: 250px;
- width: 550px;
+ width: 650px;
position: absolute;
- padding: 150px 100px;
+ padding: 150px 50px;
font-family: Helvetica, Geneva, Arial, sans-serif;
- font-size: 30px;
+ font-size: 28px;
display: inline-block;
text-shadow: 0 2px 3px #AAA;
}
View
2 style.min.css
@@ -1 +1 @@
-html,body{height:100%;margin:0;padding:0;overflow:hidden;}a{text-decoration:none;color:#444;}.charity{color:#A44;}#quote-box{background:url(background.gif) no-repeat;height:250px;width:550px;position:absolute;padding:150px 100px;font-family:Helvetica,Geneva,Arial,sans-serif;font-size:30px;display:inline-block;text-shadow:0 2px 3px #AAA;}#sayer{font-weight:bold;position:absolute;bottom:50px;right:200px;}#link-box{position:absolute;right:10px;bottom:10px;z-index:5;font-family:Helvetica,Geneva,Arial,sans-serif;font-size:10px;}
+html,body{height:100%;margin:0;padding:0;overflow:hidden;}a{text-decoration:none;color:#444;}.charity{color:#A44;}#quote-box{background:url(background.gif) no-repeat;height:250px;width:650px;position:absolute;padding:150px 50px;font-family:Helvetica,Geneva,Arial,sans-serif;font-size:28px;display:inline-block;text-shadow:0 2px 3px #AAA;}#sayer{font-weight:bold;position:absolute;bottom:50px;right:200px;}#link-box{position:absolute;right:10px;bottom:10px;z-index:5;font-family:Helvetica,Geneva,Arial,sans-serif;font-size:10px;}

0 comments on commit c9f8dfe

Please sign in to comment.