From 97b2a05f1b9fb02c7033f461278f5322eba02d76 Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Tue, 6 Mar 2012 16:01:15 -0500 Subject: [PATCH 1/6] Added official badge styling for Askbot --- css/application.css | 80 +++++++++++++++++++++++++++++++-------------- 1 file changed, 55 insertions(+), 25 deletions(-) diff --git a/css/application.css b/css/application.css index 9385aa836d..ecb5dc52a5 100644 --- a/css/application.css +++ b/css/application.css @@ -2523,6 +2523,16 @@ div.course-wrapper section.course-content ol.vert-mod > li { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } +div.course-wrapper section.course-content section.tutorials ul { + list-style: disc outside none; + margin-left: 22.652px; } +div.course-wrapper section.course-content div.staff_info { + white-space: pre-wrap; + border-top: 1px solid #ccc; + padding-top: 22.652px; + margin-top: 22.652px; + line-height: 22.652px; + font-family: Consolas, "Lucida Console", Monaco, "Courier New", Courier, monospace; } div.course-wrapper.closed section.course-index { width: 3.077%; } div.course-wrapper.closed section.course-index header#open_close_accordion { @@ -2739,6 +2749,8 @@ section.course-content div.video-subtitles { zoom: 1; *display: inline; *vertical-align: auto; } + section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls div.speeds ol#video_speeds li.active { + font-weight: bold; } section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles { float: left; display: block; @@ -2999,31 +3011,33 @@ div.book-wrapper section.book-sidebar { -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } - div.book-wrapper section.book-sidebar ul#booknav a { - color: #000; } - div.book-wrapper section.book-sidebar ul#booknav a:hover { - color: #666; } - div.book-wrapper section.book-sidebar ul#booknav li { - background: none; - padding-left: 30px; } - div.book-wrapper section.book-sidebar ul#booknav li div.hitarea { - margin-left: -22px; - background-image: url("/static/images/treeview-default.gif"); - position: relative; - top: 4px; } - div.book-wrapper section.book-sidebar ul#booknav li div.hitarea:hover { - opacity: 0.6; - filter: alpha(opacity=60); } - div.book-wrapper section.book-sidebar ul#booknav li ul { - background: none; } - div.book-wrapper section.book-sidebar ul#booknav > li { - border-bottom: 1px solid #d3d3d3; - -webkit-box-shadow: 0 1px 0 #eeeeee; - -moz-box-shadow: 0 1px 0 #eeeeee; - -ms-box-shadow: 0 1px 0 #eeeeee; - -o-box-shadow: 0 1px 0 #eeeeee; - box-shadow: 0 1px 0 #eeeeee; - padding: 7px 7px 7px 30px; } + div.book-wrapper section.book-sidebar ul#booknav { + font-size: 12px; } + div.book-wrapper section.book-sidebar ul#booknav a { + color: #000; } + div.book-wrapper section.book-sidebar ul#booknav a:hover { + color: #666; } + div.book-wrapper section.book-sidebar ul#booknav li { + background: none; + padding-left: 30px; } + div.book-wrapper section.book-sidebar ul#booknav li div.hitarea { + margin-left: -22px; + background-image: url("/static/images/treeview-default.gif"); + position: relative; + top: 4px; } + div.book-wrapper section.book-sidebar ul#booknav li div.hitarea:hover { + opacity: 0.6; + filter: alpha(opacity=60); } + div.book-wrapper section.book-sidebar ul#booknav li ul { + background: none; } + div.book-wrapper section.book-sidebar ul#booknav > li { + border-bottom: 1px solid #d3d3d3; + -webkit-box-shadow: 0 1px 0 #eeeeee; + -moz-box-shadow: 0 1px 0 #eeeeee; + -ms-box-shadow: 0 1px 0 #eeeeee; + -o-box-shadow: 0 1px 0 #eeeeee; + box-shadow: 0 1px 0 #eeeeee; + padding: 7px 7px 7px 30px; } div.book-wrapper section.book nav a { padding: 0 22.652px; } div.book-wrapper section.book nav ul li.last { @@ -5397,6 +5411,8 @@ div.question-header div.question-container, div.answer-block div.question-contai display: block; } div.question-header div.question-container div.comments-container div.comments-content .block:first-child, div.answer-block div.question-container div.comments-container div.comments-content .block:first-child, div.paginator div.question-container div.comments-container div.comments-content .block:first-child, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content .block:first-child, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content .block:first-child, div.answer-block div.answer-container div.comments-container div.comments-content .block:first-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block:first-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block:first-child, div.question-header div.paginator div.answer-container div.comments-container div.comments-content .block:first-child, div.paginator div.question-header div.answer-container div.comments-container div.comments-content .block:first-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block:first-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block:first-child, div.paginator div.answer-container div.comments-container div.comments-content .block:first-child { border-top: 0; } + div.question-header div.question-container div.comments-container div.comments-content .block.official, div.answer-block div.question-container div.comments-container div.comments-content .block.official, div.paginator div.question-container div.comments-container div.comments-content .block.official, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.question-header div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.question-header div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-container div.comments-container div.comments-content .block.official { + padding-top: 10px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-container div.comments-container div.comments-content form.post-comments, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments { padding: 15px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child { @@ -5545,6 +5561,20 @@ div.answer-block, div.paginator { float: left; padding-top: 20px; width: 100%; } + div.answer-block div.official-stamp, div.paginator div.official-stamp, div.answer-block span.official-comment, div.paginator div.answer-block span.official-comment, div.answer-block div.paginator span.official-comment, div.answer-block div.paginator span.official-comment, div.paginator div.answer-block span.official-comment, div.paginator span.official-comment { + background: #993333; + color: #fff; + font-size: 12px; + margin-top: 10px; + padding: 2px 5px; + text-align: center; + margin-left: -1px; } + div.answer-block span.official-comment, div.paginator span.official-comment { + display: block; + margin: 0 0 10px -5%; + padding-left: 5%; + text-align: left; + width: 120px; } div.answer-block img.answer-img-accept, div.paginator img.answer-img-accept { margin: 10px 0px 10px 16px; } div.answer-block div.answered-by-owner p, div.paginator div.answered-by-owner p { From 5baddf53666bc78cc03bb26139ea1f3ea480cc78 Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Tue, 6 Mar 2012 16:21:26 -0500 Subject: [PATCH 2/6] Made the official comment style apply to question comments as well --- css/application.css | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/css/application.css b/css/application.css index ecb5dc52a5..fba0f674b3 100644 --- a/css/application.css +++ b/css/application.css @@ -5413,6 +5413,15 @@ div.question-header div.question-container, div.answer-block div.question-contai border-top: 0; } div.question-header div.question-container div.comments-container div.comments-content .block.official, div.answer-block div.question-container div.comments-container div.comments-content .block.official, div.paginator div.question-container div.comments-container div.comments-content .block.official, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.question-header div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.question-header div.answer-container div.comments-container div.comments-content .block.official, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official, div.paginator div.answer-container div.comments-container div.comments-content .block.official { padding-top: 10px; } + div.question-header div.question-container div.comments-container div.comments-content .block.official span.official-comment, div.answer-block div.question-container div.comments-container div.comments-content .block.official span.official-comment, div.paginator div.question-container div.comments-container div.comments-content .block.official span.official-comment, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.answer-block div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.question-header div.paginator div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.paginator div.question-header div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content .block.official span.official-comment, div.paginator div.answer-container div.comments-container div.comments-content .block.official span.official-comment { + background: #993333; + color: #fff; + display: block; + font-size: 12px; + margin: 0 0 10px -5%; + padding: 2px 5px 2px 5%; + text-align: left; + width: 120px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-container div.comments-container div.comments-content form.post-comments, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments { padding: 15px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child { @@ -5561,7 +5570,7 @@ div.answer-block, div.paginator { float: left; padding-top: 20px; width: 100%; } - div.answer-block div.official-stamp, div.paginator div.official-stamp, div.answer-block span.official-comment, div.paginator div.answer-block span.official-comment, div.answer-block div.paginator span.official-comment, div.answer-block div.paginator span.official-comment, div.paginator div.answer-block span.official-comment, div.paginator span.official-comment { + div.answer-block div.official-stamp, div.paginator div.official-stamp { background: #993333; color: #fff; font-size: 12px; @@ -5569,12 +5578,6 @@ div.answer-block, div.paginator { padding: 2px 5px; text-align: center; margin-left: -1px; } - div.answer-block span.official-comment, div.paginator span.official-comment { - display: block; - margin: 0 0 10px -5%; - padding-left: 5%; - text-align: left; - width: 120px; } div.answer-block img.answer-img-accept, div.paginator img.answer-img-accept { margin: 10px 0px 10px 16px; } div.answer-block div.answered-by-owner p, div.paginator div.answered-by-owner p { From 174f50c575608286edf7d8d4e8c39d8fdfde6a30 Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Tue, 6 Mar 2012 17:15:59 -0500 Subject: [PATCH 3/6] Small visual adjustment for official badges --- css/application.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/application.css b/css/application.css index fba0f674b3..38a055d571 100644 --- a/css/application.css +++ b/css/application.css @@ -5421,7 +5421,7 @@ div.question-header div.question-container, div.answer-block div.question-contai margin: 0 0 10px -5%; padding: 2px 5px 2px 5%; text-align: left; - width: 120px; } + width: 100px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-container div.comments-container div.comments-content form.post-comments, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments { padding: 15px; } div.question-header div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.question-header div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.question-header div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.answer-block div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-block div.answer-container div.comments-container div.comments-content form.post-comments button:last-child, div.paginator div.answer-container div.comments-container div.comments-content form.post-comments button:last-child { From 40e52cb96e74551f4fbfecf792ffe18784d7c6fa Mon Sep 17 00:00:00 2001 From: Ernie Park Date: Wed, 7 Mar 2012 02:25:33 -0500 Subject: [PATCH 4/6] update video player to accommodate remembering video speeds when switching in sequences and fix bug where play button gets out of sync when switching speeds --HG-- branch : ernie-static-video-fixes --- js/video_player.js | 23 +++++++++++++++++------ 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/js/video_player.js b/js/video_player.js index 507596f8a6..772b35a5c6 100644 --- a/js/video_player.js +++ b/js/video_player.js @@ -77,8 +77,8 @@ function submit_circuit(circuit_id) { // Video player var load_id = 0; - -var video_speed = 1.0; +var caption_id; +var video_speed = "1.0"; var updateytPlayerInterval; var ajax_videoInterval; @@ -86,7 +86,8 @@ var ajax_videoInterval; function change_video_speed(speed, youtube_id) { new_position = ytplayer.getCurrentTime() * video_speed / speed; video_speed = speed; - ytplayer.loadVideoById(youtube_id, new_position); + ytplayer.loadVideoById(youtube_id, new_position); + syncPlayButton(); log_event("speed", {"new_speed":speed, "clip":youtube_id}); } @@ -190,7 +191,7 @@ function onYouTubePlayerReady(playerId) { ytplayer.addEventListener("onError", "onPlayerError"); if((typeof load_id != "undefined") && (load_id != 0)) { var id=load_id; - loadNewVideo(id, 0); + loadNewVideo(caption_id, id, 0); } } @@ -357,11 +358,12 @@ function updateytplayerInfo() { } // functions for the api calls -function loadNewVideo(id, startSeconds) { +function loadNewVideo(cap_id, id, startSeconds) { captions={"start":[0],"end":[0],"text":["Attempting to load captions..."]}; - $.getJSON("/static/subs/"+id+".srt.sjson", function(data) { + $.getJSON("/static/subs/"+cap_id+".srt.sjson", function(data) { captions=data; }); + caption_id = cap_id; load_id = id; //if ((typeof ytplayer != "undefined") && (ytplayer.type=="application/x-shockwave-flash")) { // Try it every time. If we fail, we want the error message for now. @@ -378,6 +380,15 @@ function loadNewVideo(id, startSeconds) { //seekTo(startSeconds); } +function syncPlayButton(){ + var state = getPlayerState(); + if (state == 1 || state == 3) { + $("#video_control").removeClass().addClass("pause"); + } else if (state == 2 || state == -1 || state == 0){ + $("#video_control").removeClass().addClass("play"); + } +} + function cueNewVideo(id, startSeconds) { if (ytplayer) { ytplayer.cueVideoById(id, startSeconds); From 90a70e661f3cbc776dbae1ef1ad813e1a4f019f1 Mon Sep 17 00:00:00 2001 From: Ernie Park Date: Wed, 7 Mar 2012 14:52:01 -0500 Subject: [PATCH 5/6] include kyles changes to bold the video speed --HG-- branch : ernie-static-video-fixes --- css/application.css | 58 ++++++++++++++++++++++++++------------------- 1 file changed, 33 insertions(+), 25 deletions(-) diff --git a/css/application.css b/css/application.css index 9385aa836d..630871eba9 100644 --- a/css/application.css +++ b/css/application.css @@ -1,3 +1,4 @@ +@charset "UTF-8"; /* html5doctor.com Reset Stylesheet v1.6.1 @@ -2523,6 +2524,9 @@ div.course-wrapper section.course-content ol.vert-mod > li { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } +div.course-wrapper section.course-content section.tutorials ul { + list-style: disc outside none; + margin-left: 22.652px; } div.course-wrapper.closed section.course-index { width: 3.077%; } div.course-wrapper.closed section.course-index header#open_close_accordion { @@ -2739,6 +2743,8 @@ section.course-content div.video-subtitles { zoom: 1; *display: inline; *vertical-align: auto; } + section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls div.speeds ol#video_speeds li.active { + font-weight: bold; } section.course-content div.video-subtitles div.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles { float: left; display: block; @@ -2999,31 +3005,33 @@ div.book-wrapper section.book-sidebar { -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } - div.book-wrapper section.book-sidebar ul#booknav a { - color: #000; } - div.book-wrapper section.book-sidebar ul#booknav a:hover { - color: #666; } - div.book-wrapper section.book-sidebar ul#booknav li { - background: none; - padding-left: 30px; } - div.book-wrapper section.book-sidebar ul#booknav li div.hitarea { - margin-left: -22px; - background-image: url("/static/images/treeview-default.gif"); - position: relative; - top: 4px; } - div.book-wrapper section.book-sidebar ul#booknav li div.hitarea:hover { - opacity: 0.6; - filter: alpha(opacity=60); } - div.book-wrapper section.book-sidebar ul#booknav li ul { - background: none; } - div.book-wrapper section.book-sidebar ul#booknav > li { - border-bottom: 1px solid #d3d3d3; - -webkit-box-shadow: 0 1px 0 #eeeeee; - -moz-box-shadow: 0 1px 0 #eeeeee; - -ms-box-shadow: 0 1px 0 #eeeeee; - -o-box-shadow: 0 1px 0 #eeeeee; - box-shadow: 0 1px 0 #eeeeee; - padding: 7px 7px 7px 30px; } + div.book-wrapper section.book-sidebar ul#booknav { + font-size: 12px; } + div.book-wrapper section.book-sidebar ul#booknav a { + color: #000; } + div.book-wrapper section.book-sidebar ul#booknav a:hover { + color: #666; } + div.book-wrapper section.book-sidebar ul#booknav li { + background: none; + padding-left: 30px; } + div.book-wrapper section.book-sidebar ul#booknav li div.hitarea { + margin-left: -22px; + background-image: url("/static/images/treeview-default.gif"); + position: relative; + top: 4px; } + div.book-wrapper section.book-sidebar ul#booknav li div.hitarea:hover { + opacity: 0.6; + filter: alpha(opacity=60); } + div.book-wrapper section.book-sidebar ul#booknav li ul { + background: none; } + div.book-wrapper section.book-sidebar ul#booknav > li { + border-bottom: 1px solid #d3d3d3; + -webkit-box-shadow: 0 1px 0 #eeeeee; + -moz-box-shadow: 0 1px 0 #eeeeee; + -ms-box-shadow: 0 1px 0 #eeeeee; + -o-box-shadow: 0 1px 0 #eeeeee; + box-shadow: 0 1px 0 #eeeeee; + padding: 7px 7px 7px 30px; } div.book-wrapper section.book nav a { padding: 0 22.652px; } div.book-wrapper section.book nav ul li.last { From 5db419d2114d5336cc7d619eac39f7c9706a6cad Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Wed, 7 Mar 2012 15:27:47 -0500 Subject: [PATCH 6/6] Used cookies to store speed --HG-- branch : ernie-static-video-fixes --- js/jquery.cookie.js | 47 +++++++++++++++++++++++++++++++++++++++++++++ js/video_player.js | 8 ++++++-- 2 files changed, 53 insertions(+), 2 deletions(-) create mode 100644 js/jquery.cookie.js diff --git a/js/jquery.cookie.js b/js/jquery.cookie.js new file mode 100644 index 0000000000..6d5974a2c5 --- /dev/null +++ b/js/jquery.cookie.js @@ -0,0 +1,47 @@ +/*! + * jQuery Cookie Plugin + * https://github.com/carhartl/jquery-cookie + * + * Copyright 2011, Klaus Hartl + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://www.opensource.org/licenses/mit-license.php + * http://www.opensource.org/licenses/GPL-2.0 + */ +(function($) { + $.cookie = function(key, value, options) { + + // key and at least value given, set cookie... + if (arguments.length > 1 && (!/Object/.test(Object.prototype.toString.call(value)) || value === null || value === undefined)) { + options = $.extend({}, options); + + if (value === null || value === undefined) { + options.expires = -1; + } + + if (typeof options.expires === 'number') { + var days = options.expires, t = options.expires = new Date(); + t.setDate(t.getDate() + days); + } + + value = String(value); + + return (document.cookie = [ + encodeURIComponent(key), '=', options.raw ? value : encodeURIComponent(value), + options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE + options.path ? '; path=' + options.path : '', + options.domain ? '; domain=' + options.domain : '', + options.secure ? '; secure' : '' + ].join('')); + } + + // key and possibly options given, get cookie... + options = value || {}; + var decode = options.raw ? function(s) { return s; } : decodeURIComponent; + + var pairs = document.cookie.split('; '); + for (var i = 0, pair; pair = pairs[i] && pairs[i].split('='); i++) { + if (decode(pair[0]) === key) return decode(pair[1] || ''); // IE saves cookies with empty string as "c; ", e.g. without "=" as opposed to EOMB, thus pair[1] may be undefined + } + return null; + }; +})(jQuery); diff --git a/js/video_player.js b/js/video_player.js index 772b35a5c6..fbf529a8ee 100644 --- a/js/video_player.js +++ b/js/video_player.js @@ -89,6 +89,10 @@ function change_video_speed(speed, youtube_id) { ytplayer.loadVideoById(youtube_id, new_position); syncPlayButton(); log_event("speed", {"new_speed":speed, "clip":youtube_id}); + console.log("setting"); + console.log(speed); + + $.cookie("video_speed", speed, {'expires':3650, 'path':'/'}); } function caption_at(index) { @@ -383,9 +387,9 @@ function loadNewVideo(cap_id, id, startSeconds) { function syncPlayButton(){ var state = getPlayerState(); if (state == 1 || state == 3) { - $("#video_control").removeClass().addClass("pause"); + $("#video_control").removeClass("play").addClass("pause"); } else if (state == 2 || state == -1 || state == 0){ - $("#video_control").removeClass().addClass("play"); + $("#video_control").removeClass("pause").addClass("play"); } }