Commit b1e52a92 by Piotr Mitros

Moving static to its own directory

parent fccfbb7d
#coursenav {
background-color:#031634;
padding: 4px 8px 8px 0px;
margin: 4px 8px 8px 0px;
width: 100%;
text-align: right;
}
#left_nav {
border: 0;
padding: 0;
margin: 0;
float: left;
width: 276;
}
#hide_acc {
min-height:600;
}
#mainblock {
border: 0;
padding: 0;
margin: 0;
width: 200;
min-height:600px;
margin-left: 276px;
margin-right: 0px;
}
#bodyContent {
width: 100%;
}
.bordered { border: 1px solid #AAAAAA; border-style : dotted; }
.seq_problem_visited { background-color: #ccccaa;}
.seq_video_visited { background-color: #ccaacc;}
.seq_video_visited { background-color: #cccaac;}
.seq_html_visited { background-color: #caaccc;}
.seq_tab_visited { background-color: #aacccc;}
.seq_vertical_visited { background-color: #acaccc;}
.seq_sequential_visited { background-color: #cacacc;}
.seq_problem_visited { background-color: #ccacac;}
.seq_schematic_visited { background-color: #cccaca;}
.seq_problem_inactive { background-color: #aaaa99;}
.seq_video_inactive { background-color: #aa99aa;}
.seq_video_inactive { background-color: #aaa99a;}
.seq_html_inactive { background-color: #a99aaa;}
.seq_tab_inactive { background-color: #99aaaa;}
.seq_vertical_inactive { background-color: #9a9aab;}
.seq_sequential_inactive { background-color: #a9a9aa;}
.seq_problem_inactive { background-color: #aa9a9a;}
.seq_schematic_inactive { background-color: #aaa9a9;}
.seq_active { background-color: red;}
\ No newline at end of file
/*
----------------------------------------------------------------------------------------
Copyright 2010 - Thierry Ruiz - www.dotemplate.com - All rights reserved.
THIS TEMPLATE IS FREE AS LONG AS YOU KEEP THE LINK TO WWW.DOTEMPLATE.COM IN THE FOOTER
TO REMOVE THE LINK, PLEASE MAKE A 10 DOLLARS DONATION at www.dotemplate.com/#donate
pmitros donated $10
Colors:
Light blue: bddeff
Blue: 7fbcfd
Very dark blue: #031634
Dark blue: #023063;
Dark Greenish: #7a994c;
Greenish: #adcc80;
Very light greenish: #dae5c9;
Bright orange: #fa720a;
----------------------------------------------------------------------------------------
*/
html {
background: $bottomWrapper.bg.color;
margin:0 0 0 -1px;
padding:0;
overflow-Y: scroll;
}
body {
padding:0;
margin :0;
display:table;
width:100%;
}
body {
color:#023063;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.8em;
font-style: normal;
font-weight: normal;
text-transform: normal;
}
p {
letter-spacing: normal;
line-height: 20px;
}
h1 {
color:#adcc80;
font-size:1.6em;
margin:25px 0 10px 0;
clear:both;
}
h2 {
color:#adcc80;
font-size:1.1em;
margin:20px 0 10px 0;
clear:both;
}
h3 {
color:#adcc80;
font-size:1em;
margin:20px 0 5px 0;
clear:both;
}
a:link, a:visited {
color:#adcc80;
text-decoration:none;
}
a:hover {
color:#fa720a;
text-decoration:underline;
}
#sectiondesc {
font-size:8px;
}
#wrapper {
background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px;
margin:0 auto ;
width:100%;
}
body {
background-color:#FFFFFF;
}
#wrapper {
border-top: 1px solid #ffffff;
}
#topWrapper {
width:100%;
height:100px;
background-color:${topWrapper.bg.color};
background-image:url(images/css/topWrapper-bg.jpg);
background-position:center top ;
background-repeat:repeat-x;
}
#topBanner {
width:800px;
margin:0 auto;
height:100px;
background-image:url(images/css/topBanner.jpg);
background-repeat:no-repeat;
}
#topnav {
background:transparent url('images/css/hmenu.jpg') repeat-x top left;
}
#topnav {
height:20px;
margin:0 auto ;
text-align:center;
}
#topnav ul {
display:table;
margin:0 auto;
padding:0;
list-style-type:none;
position:relative;
height:20px;
text-transform:uppercase;
font-size:0.9em;
font-family:Arial,sans-serif;
}
#topnav ul li {
display:block;
float:left;
margin:0;
padding:0;
background:transparent url('images/css/hmenu.jpg') repeat-x top left;
}
#topnav ul li a {
display:block;
float:left;
color:#031634;
text-decoration:none;
padding:0px 50px ;
line-height:20px;
font-weight:bold;
}
#topnav ul li a:hover, #topnav li#current a {
color:#7a994c;
background:transparent url('images/css/hmenu-sel.jpg') repeat-x top left;
}
#topnav ul {
width:800px;
}
body {
background-position : center 120px;
}
#bg {
margin:0 auto;
padding:0;
background:transparent ;
background-image:url(images/css/hat.jpg);
background-repeat:no-repeat;
background-position: center top ;
}
#header {
margin: 0 auto;
min-height:0px;
height: 0px;
width: 800px;
}
#page {
background: transparent url( images/css/page-bg.jpg ) no-repeat center top;
}
#container {
margin:0 auto;
width:800px;
}
#content {
width:780px;
margin:0 auto ;
text-align:left;
min-height:800px;
}
#content p {
text-align:justify;
}
#footerWrapper {
margin:0 auto;
height:10px;
padding:0;
background:transparent url( images/css/footerWrapper-bg.jpg ) no-repeat scroll center top;
}
#footer {
margin:0 auto;
padding:0;
width:800px;
height:10px;
}
#right {
width:200px;
padding:10px 20px 20px 20px;
float:left;
}
#center {
width:500px;
padding:10px 20px 20px 20px;
float:left;
}
#content p {
margin-top:10px;
text-align:justify;
}
#sidebar ul.vmenu {
list-style: none;
text-align: left;
margin: 7px 0px 8px 0px;
padding: 0;
text-decoration: none;
border-top: 1px solid #eeeeee;
}
#sidebar ul.vmenu li {
list-style: none;
padding: 4px 0 4px 0px;
margin: 0 2px;
border-bottom: 1px solid #eeeeee;
}
#sidebar ul.vmenu li a {
text-decoration: none;
color:#023063;
}
#sidebar ul.vmenu li a:hover {
color:#adcc80;
}
#sidebar ul.vmenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar ul.vmenu ul li { border: none; }
#bottomWrapper {
height:140px;
background-color:#031634;
background-image:url(images/css/bottomWrapper-bg.jpg);
background-position:center top ;
background-repeat:repeat-x;
text-align:center;
color:#adcc80;
text-align:center;
}
#bottomWrapper a:link, #footer a:visited {
color:#dae5c9;
}
#bottomWrapper a:hover{
color:#adcc80;
text-decoration:none;
}
a img {
border:none;
}
.clear {
clear: both;
display: block;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}
// Things to abstract out to another file
function postJSON(url, data, callback, csrf) {
$.ajax({
url: url,
dataType: 'json',
data: data,
success: callback
});
}
var global=5;
// Video player
var load_id = 0;
var video_speed = 1.0;
function change_video_speed(speed, youtube_id) {
new_position = ytplayer.getCurrentTime() * video_speed / speed;
video_speed = speed;
ytplayer.loadVideoById(youtube_id, new_position);
}
function caption_at(index) {
if (captions==0)
return " ";
text_array=captions.text
if ((index>=text_array.length) || (index < 0))
return "&nbsp;";
return text_array[index];
}
function caption_time_at(index) {
if (captions==0)
return 0;
time_array=captions.start;
if (index < 0)
return 0;
if (index>=time_array.length)
return ytplayer.getDuration();
return time_array[index] / 1000.0 / video_speed;
}
function caption_index(now) {
// Returns the index of the current caption, given a time
now = now * video_speed;
if (captions==0)
return 0;
time_array=captions.start
// TODO: Bisection would be better, or something incremental
var i;
for(i=0;i<captions.start.length; i++) {
if(time_array[i]>(now*1000)) {
return i-1;
}
}
return i-1;
}
function update_captions(t) {
var i=caption_index(t);
$("#std_n5").html(caption_at(i-5));
$("#std_n4").html(caption_at(i-4));
$("#std_n3").html(caption_at(i-3));
$("#std_n2").html(caption_at(i-2));
$("#std_n1").html(caption_at(i-1));
$("#std_0").html(caption_at(i));
$("#std_p1").html(caption_at(i+1));
$("#std_p2").html(caption_at(i+2));
$("#std_p3").html(caption_at(i+3));
$("#std_p4").html(caption_at(i+4));
$("#std_p5").html(caption_at(i+5));
$("#std_p6").html(caption_at(i+6));
}
function title_seek(i) {
// Seek video forwards or backwards by i subtitles
current=caption_index(getCurrentTime());
new_time=caption_time_at(current+i);
ytplayer.seekTo(new_time, true);
}
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}
function setytplayerState(newState) {
// updateHTML("playerstate", newState);
}
// Updates server with location in video so we can resume from the same place
// IMPORTANT TODO: Load test
// POSSIBLE FIX: Move to unload() event and similar
var ajax_video=function(){};
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
setInterval(updateytplayerInfo, 1000);
setInterval(ajax_video,1000);
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
ytplayer.addEventListener("onError", "onPlayerError");
if((typeof load_id != "undefined") && (load_id != 0)) {
var id=load_id;
loadNewVideo(id, 0);
}
}
function videoDestroy() {
load_id = 0;
// TODO/BUG: Figure out why removeEventListener doesn't work
ytplayer.removeEventListener("onStateChange", "onytplayerStateChange");
ytplayer.removeEventListener("onError", "onPlayerError");
ytplayer = false;
}
function log_event(e, d) {
// CRITICAL TODO: Change to AJAX
//$("#eventlog").append("<br>");
//$("#eventlog").append(JSON.stringify(e));
// TODO: Figure out
// XMLHttpRequest cannot load http://localhost:7000/userlog. Origin http://localhost:8000 is not allowed by Access-Control-Allow-Origin.
/*window['console'].log(JSON.stringify(e));
$.get("http://localhost:7000/userlog",
{'user':'pmitros',
'key':'key',
'event_type':'unknown',
'data':'e'},
function(data) {
});*/
}
function seek_slide(type,oe,value) {
//log_event('video', [type, value]);
if(type=='slide') {
// HACK/TODO: Youtube recommends this be false for slide and true for stop.
// Works better on my system with true/true.
// We should test both configurations on low/high bandwidth
// connections, and different browsers
// One issue is that we query the Youtube window every 250ms for position/state
// With false, it returns the old one (ignoring the new seek), and moves the
// scroll bar to the wrong spot.
ytplayer.seekTo(value, true);
} else if (type=='stop') {
ytplayer.seekTo(value, true);
log_event('video', [type, value]);
}
update_captions(value);
}
function get_state() {
if (ytplayer)
return [ytplayer.getPlayerState(),
ytplayer.getVideoUrl(),
ytplayer.getDuration(), ytplayer.getCurrentTime(),
ytplayer.getVideoBytesLoaded(), ytplayer.getVideoBytesTotal(),
ytplayer.getVideoStartBytes(),
ytplayer.getVolume(),ytplayer.isMuted(),
ytplayer.getPlaybackQuality(),
ytplayer.getAvailableQualityLevels()];
return [];
}
function onytplayerStateChange(newState) {
setytplayerState(newState);
log_event('video', ['State Change',newState, get_state()]);
}
function onPlayerError(errorCode) {
alert("An error occured: " + errorCode);
}
function updateytplayerInfo() {
if(ytplayer.getPlayerState()!=3) {
$("#slider").slider("option","max",ytplayer.getDuration());
$("#slider").slider("option","value",ytplayer.getCurrentTime());
}
if (getPlayerState() == 1){
update_captions(getCurrentTime());
}
// updateHTML("videoduration", getDuration());
// updateHTML("videotime", getCurrentTime());
// updateHTML("startbytes", getStartBytes());
// updateHTML("volume", getVolume());
}
// functions for the api calls
function loadNewVideo(id, startSeconds) {
captions={"start":[0],"end":[0],"text":["Attempting to load captions..."]};
$.getJSON("/static/subs/"+id+".srt.sjson", function(data) {
captions=data;
});
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.
// TODO: Add try/catch
try {
ytplayer.loadVideoById(id, parseInt(startSeconds));
load_id=0;
}
catch(e) {
window['console'].log(JSON.stringify(e));
}
}
function cueNewVideo(id, startSeconds) {
if (ytplayer) {
ytplayer.cueVideoById(id, startSeconds);
}
}
function play() {
if (ytplayer) {
ytplayer.playVideo();
}
}
function pause() {
if (ytplayer) {
ytplayer.pauseVideo();
}
}
function stop() {
if (ytplayer) {
ytplayer.stopVideo();
}
}
function getPlayerState() {
if (ytplayer) {
return ytplayer.getPlayerState();
}
}
function seekTo(seconds) {
if (ytplayer) {
ytplayer.seekTo(seconds, true);
}
}
function getBytesTotal() {
if (ytplayer) {
return ytplayer.getVideoBytesTotal();
}
}
function getCurrentTime() {
if (ytplayer) {
return ytplayer.getCurrentTime();
}
}
function getDuration() {
if (ytplayer) {
return ytplayer.getDuration();
}
}
function getStartBytes() {
if (ytplayer) {
return ytplayer.getVideoStartBytes();
}
}
function mute() {
if (ytplayer) {
ytplayer.mute();
}
}
function unMute() {
if (ytplayer) {
ytplayer.unMute();
}
}
function getEmbedCode() {
alert(ytplayer.getVideoEmbedCode());
}
function getVideoUrl() {
alert(ytplayer.getVideoUrl());
}
function setVolume(newVolume) {
if (ytplayer) {
ytplayer.setVolume(newVolume);
}
}
function getVolume() {
if (ytplayer) {
return ytplayer.getVolume();
}
}
function clearVideo() {
if (ytplayer) {
ytplayer.clearVideo();
}
}
\ No newline at end of file
var load_id;
function caption_at(index) {
if (captions==0)
return "&nbsp;";
text_array=captions.text
if ((index>=text_array.length) || (index < 0))
return "&nbsp;";
return text_array[index];
}
function caption_time_at(index) {
if (captions==0)
return 0;
time_array=captions.start;
if (index < 0)
return 0;
if (index>=time_array.length)
return ytplayer.getDuration();
return time_array[index]/1000.0;
}
function caption_index(now) {
// Returns the index of the current caption, given a time
if (captions==0)
return 0;
time_array=captions.start
// TODO: Bisection would be better, or something incremental
var i;
for(i=0;i<captions.start.length; i++) {
if(time_array[i]>(now*1000)) {
return i-1;
}
}
return i-1;
}
function update_captions(t) {
var i=caption_index(t);
$("#std_n5").html(caption_at(i-5));
$("#std_n4").html(caption_at(i-4));
$("#std_n3").html(caption_at(i-3));
$("#std_n2").html(caption_at(i-2));
$("#std_n1").html(caption_at(i-1));
$("#std_0").html(caption_at(i));
$("#std_p1").html(caption_at(i+1));
$("#std_p2").html(caption_at(i+2));
$("#std_p3").html(caption_at(i+3));
$("#std_p4").html(caption_at(i+4));
$("#std_p5").html(caption_at(i+5));
$("#std_p6").html(caption_at(i+6));
}
function title_seek(i) {
// Seek video forwards or backwards by i subtitles
current=caption_index(getCurrentTime());
new_time=caption_time_at(current+i);
ytplayer.seekTo(new_time, true);
}
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}
function setytplayerState(newState) {
updateHTML("playerstate", newState);
}
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
setInterval(updateytplayerInfo, 250);
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
ytplayer.addEventListener("onError", "onPlayerError");
if((typeof load_id != "undefined") && (load_id != null)) {
var id=load_id;
load_id = null;
loadNewVideo(id);
}
}
function log_event(e) {
//$("#eventlog").append("<br>");
//$("#eventlog").append(JSON.stringify(e));
window['console'].log(JSON.stringify(e));
}
function seek_slide(type,oe,value) {
//log_event([type, value]);
if(type=='slide') {
// HACK/TODO: Youtube recommends this be false for slide and true for stop.
// Works better on my system with true/true.
// We should test both configurations on low/high bandwidth
// connections, and different browsers
// One issue is that we query the Youtube window every 250ms for position/state
// With false, it returns the old one (ignoring the new seek), and moves the
// scroll bar to the wrong spot.
ytplayer.seekTo(value, true);
} else if (type=='stop') {
ytplayer.seekTo(value, true);
log_event([type, value]);
}
update_captions(value);
}
function get_state() {
if (ytplayer)
return [ytplayer.getPlayerState(),
ytplayer.getVideoUrl(),
ytplayer.getDuration(), ytplayer.getCurrentTime(),
ytplayer.getVideoBytesLoaded(), ytplayer.getVideoBytesTotal(),
ytplayer.getVideoStartBytes(),
ytplayer.getVolume(),ytplayer.isMuted(),
ytplayer.getPlaybackQuality(),
ytplayer.getAvailableQualityLevels()];
return [];
}
function onytplayerStateChange(newState) {
setytplayerState(newState);
log_event(['State Change',newState, get_state()]);
}
function onPlayerError(errorCode) {
alert("An error occured: " + errorCode);
}
function updateytplayerInfo() {
if(ytplayer.getPlayerState()!=3) {
$("#slider").slider("option","max",ytplayer.getDuration());
$("#slider").slider("option","value",ytplayer.getCurrentTime());
}
update_captions(getCurrentTime());
updateHTML("videoduration", getDuration());
updateHTML("videotime", getCurrentTime());
updateHTML("startbytes", getStartBytes());
updateHTML("volume", getVolume());
}
// functions for the api calls
function loadNewVideo(id, startSeconds) {
if (typeof ytplayer != "undefined") {
ytplayer.loadVideoById(id, parseInt(startSeconds));
} else {
load_id = id;
}
$.getJSON("/static/subs/"+id+".srt.sjson", function(data) {
captions=data;
});
}
function cueNewVideo(id, startSeconds) {
if (ytplayer) {
ytplayer.cueVideoById(id, startSeconds);
}
}
function play() {
if (ytplayer) {
ytplayer.playVideo();
}
}
function pause() {
if (ytplayer) {
ytplayer.pauseVideo();
}
}
function stop() {
if (ytplayer) {
ytplayer.stopVideo();
}
}
function getPlayerState() {
if (ytplayer) {
return ytplayer.getPlayerState();
}
}
function seekTo(seconds) {
if (ytplayer) {
ytplayer.seekTo(seconds, true);
}
}
function getBytesTotal() {
if (ytplayer) {
return ytplayer.getVideoBytesTotal();
}
}
function getCurrentTime() {
if (ytplayer) {
return ytplayer.getCurrentTime();
}
}
function getDuration() {
if (ytplayer) {
return ytplayer.getDuration();
}
}
function getStartBytes() {
if (ytplayer) {
return ytplayer.getVideoStartBytes();
}
}
function mute() {
if (ytplayer) {
ytplayer.mute();
}
}
function unMute() {
if (ytplayer) {
ytplayer.unMute();
}
}
function getEmbedCode() {
alert(ytplayer.getVideoEmbedCode());
}
function getVideoUrl() {
alert(ytplayer.getVideoUrl());
}
function setVolume(newVolume) {
if (ytplayer) {
ytplayer.setVolume(newVolume);
}
}
function getVolume() {
if (ytplayer) {
return ytplayer.getVolume();
}
}
function clearVideo() {
if (ytplayer) {
ytplayer.clearVideo();
}
}
\ No newline at end of file
This diff is collapsed. Click to expand it.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment