Initial commit

sorenlouv · Mar 31, 2012 · 8a0f409 · 8a0f409
commit 8a0f409
Show file tree

Hide file tree

Showing 12 changed files with 979 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+!songs/*
+!commands/*
diff --git a/images/grid.png b/images/grid.png
diff --git a/index.php b/index.php
@@ -0,0 +1,42 @@
+<?php
+	include("lib.php");
+
+	// get list of files
+	$commands = readFolder("commands");	
+	$songs = readFolder("songs");
+?>
+
+<!DOCTYPE html>
+<html>
+<head>
+	<title></title>
+	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
+	<link rel="stylesheet" type="text/css" href="stylesheets/screen.css">
+	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+	<script src="screen.js"></script>
+	<script type="text/javascript">
+
+		$(document).ready(function() {
+			startCountDown(<?php echo $songs ?>, <?php echo $commands ?>);
+			pissList.init();
+
+		});	
+	</script>
+</head>
+<body class="bp">
+	<div class="container">
+
+		<h1 class="title">Club 101</h1>
+		<p class="sub-title">En club sejere</p>
+
+		<div class="progress-bar">
+			<div class="progress-bar-inside"></div>
+			<p class="timer-seconds">53</p>
+		</div>
+
+		<div class="club-number">Club #<span>0</span></div>
+		<div class="current-song">Introsang</div>
+
+	</div>
+</body>
+</html>
diff --git a/lib.php b/lib.php
@@ -0,0 +1,16 @@
+<?php
+function readFolder($type){
+	if($type == "commands"){
+		$files = scandir("commands/");
+	}else{
+		$files = scandir("songs/");
+	}
+	$key_parent_dir = array_search("..", $files);
+	$key_current_dir = array_search(".", $files);		
+	unset($files[$key_current_dir]);
+	unset($files[$key_parent_dir]);		
+	shuffle($files);
+
+	return json_encode($files);
+}
+?>
diff --git a/sass/ie.sass b/sass/ie.sass
@@ -0,0 +1,16 @@
+@import blueprint
+
+// To generate css equivalent to the blueprint css but with your configuration applied, uncomment:
+// @include blueprint-ie
+
+//Recommended Blueprint configuration with scoping and semantic layout:
+body.bp
+  +blueprint-ie(true)
+  // Note: Blueprint centers text to fix IE6 container centering.
+  // This means all your texts will be centered under all version of IE by default.
+  // If your container does not have the .container class, don't forget to restore
+  // the correct behavior to your main container (but not the body tag!)
+  // Example:
+  // .my-container
+  //   text-align: left
+
diff --git a/sass/partials/_base.sass b/sass/partials/_base.sass
@@ -0,0 +1,11 @@
+// Here is where you can define your constants for your application and to configure the blueprint framework.
+// Feel free to delete these if you want keep the defaults:
+
+$blueprint-grid-columns   : 10
+$blueprint-container-size : 920px
+$blueprint-grid-margin    : 24px
+
+// Use this to calculate the width based on the total width.
+// Or you can set $blueprint-grid-width to a fixed value and unset $blueprint-container-size -- it will be calculated for you.
+$blueprint-grid-width: ($blueprint-container-size + $blueprint-grid-margin) / $blueprint-grid-columns - $blueprint-grid-margin
+
diff --git a/sass/print.sass b/sass/print.sass
@@ -0,0 +1,8 @@
+@import blueprint
+
+// To generate css equivalent to the blueprint css but with your configuration applied, uncomment:
+// @include blueprint-print
+
+//Recommended Blueprint configuration with scoping and semantic layout:
+body.bp
+  +blueprint-print(true)
diff --git a/sass/screen.sass b/sass/screen.sass
@@ -0,0 +1,90 @@
+// This import applies a global reset to any page that imports this stylesheet.
+@import blueprint/reset
+// To configure blueprint, edit the partials/base.sass file.
+@import partials/base
+// Import all the default blueprint modules so that we can access their mixins.
+@import blueprint
+// Import the non-default scaffolding module.
+@import blueprint/scaffolding
+
+// To generate css equivalent to the blueprint css but with your
+// configuration applied, uncomment:
+// @include blueprint
+
+// If you are doing a lot of stylesheet concatenation, it is suggested
+// that you scope your blueprint styles, so that you can better control
+// what pages use blueprint when stylesheets are concatenated together.
+body.bp
+  +blueprint-typography(true)
+  +blueprint-utilities
+  +blueprint-debug
+  +blueprint-interaction
+  // Remove the scaffolding when you're ready to start doing visual design.
+  // Or leave it in if you're happy with how blueprint looks out-of-the-box
+
+.container
+  +container
+  min-height: 500px
+  padding-top: 100px
+  //+showgrid
+
+  .title
+    color: #CCC
+    font-size: 7em
+    font-weight: bold
+    line-height: 0.6em
+    margin-bottom: 10px
+    text-align: center
+    text-transform: uppercase
+    width: 100%
+
+  .sub-title
+    color: #CCC
+    font-size: 4em
+    margin-top: 0px
+    text-align: center
+    text-transform: uppercase
+    width: 100%
+
+.progress-bar
+  box-sizing: border-box
+  border: 3px solid #000
+  +column(10, true)
+  height: 300px
+  margin-bottom: 10px
+  position: relative
+  z-index: 0
+
+  .progress-bar-inside
+    +background(linear-gradient(top, green * 1.5, green))
+    width: 100%
+    height: 100%
+    position: absolute
+    top: 0
+    left: 0
+    z-index: 1
+
+  .timer-seconds
+    +column(10, true)
+    color: #000
+    font-size: 10em
+    height: 1em
+    left: 50%
+    line-height: 1em
+    margin-top: -0.5em
+    margin-left: -0.75em
+    position: absolute
+    text-align: center
+    top: 50%
+    width: 1.5em
+    z-index: 2
+
+.club-number, .current-song
+  color: #666
+  font-size: 2em
+
+.club-number
+  float: left
+
+.current-song
+  float: right
diff --git a/screen.js b/screen.js
@@ -0,0 +1,133 @@
+var timerSeconds = 60;
+
+
+var pissList = {
+	init: function(){
+
+	},
+	add: function(name){
+		console.log("name: " + name);
+	},
+	start: function(){
+
+	},
+	stop: function(){
+
+	}
+}
+
+/*
+/* Play object
+ ********************************************/
+var player = {
+	current: null,
+	track_number: 0,
+	playlist: [],
+
+	init: function(playlist, folder, update_label){
+		this.folder = folder;
+		this.playlist = playlist;
+		this.current = new Audio(this.folder + this.playlist[this.track_number]);
+		this.update_label = update_label;
+	},
+	start: function(){
+		this.current.play();
+	},
+	stop: function(){
+		if(this.current.paused == false){
+			this.current.pause();
+		}
+	},
+	next: function(){
+		this.stop();
+
+		// if last song restart list
+		if(this.track_number == (this.playlist.length - 1)){
+			this.track_number = 0;
+		// next song
+		}else{
+			this.track_number++;
+		}
+
+		var filename = this.playlist[this.track_number];
+
+		// set song label
+		if(this.update_label){
+			var filename_human = filename.substring(0, filename.length - 4);
+			$('.current-song').html(filename_human);
+		}	
+
+		this.current.src = this.folder + filename;		
+		this.start();
+
+		console.log("Changed song to: " + filename);
+	},
+	setVolume: function(volume){
+		this.current.volume = volume;
+	}
+};
+
+/*
+/* Start countdown
+ ********************************************/
+var startCountDown = function(songs, commands){
+	var commandSecond;
+	var clubNumber = 0;
+
+	// create and start songplayer
+	var songPlayer = jQuery.extend(true, {}, player);
+	songPlayer.init(songs, "songs/", true);
+	songPlayer.start();
+
+	// create commandPlayer
+	var commandPlayer = jQuery.extend(true, {}, player);
+	commandPlayer.init(commands, "commands/");
+
+	// countdown 1 second
+	setInterval(function(){
+		// decrement second
+		timerSeconds--;
+		$('.timer-seconds').html(timerSeconds);
+		var progressBarWidth = (timerSeconds/60)*100;
+		$('.progress-bar-inside').css('width', progressBarWidth + '%');
+
+		// say skååål
+		if(timerSeconds == 3){
+
+		}
+
+		// new song
+		if(timerSeconds == 0){
+			songPlayer.next();
+			timerSeconds = 60;
+
+			// set command at random second in time number
+			commandSecond = Math.floor(37*Math.random()) + 13;
+			console.log("Command will be played at " + commandSecond);
+
+			// update club number
+			clubNumber++;
+			$('.club-number span').html(clubNumber);
+		}		
+
+		// attempt to play command
+		var commandProbability = Math.random();
+		if(timerSeconds == commandSecond){
+			console.log("Command probability: " + commandProbability);
+			//if(commandProbability < 0.3){
+
+				// decrease volume for song
+				songPlayer.setVolume(0.2);
+
+				// play command
+				commandPlayer.next();
+
+				// increase volume again for song
+				setTimeout(function(){
+					songPlayer.setVolume(1)					
+					commandPlayer.stop();
+				}, 10000);
+			//}
+		}
+	}, 1000);
+}