Add dark color scheme layout

1 files changed, 61 insertions, 0 deletions

diff --git a/slideshows/dark/template/events.js b/slideshows/dark/template/events.js
new file mode 100644
index 0000000..b0efe13
--- /dev/null
+++ b/slideshows/dark/template/events.js
@@ -0,0 +1,61 @@
+$(document).ready(function(){
+
+        var tot=$('.event').length;
+        
+        var screenWidth = $('.events').width();
+
+        var bord = $('.event').outerWidth() - $('.event').innerWidth();
+        var padd = $('.event').innerWidth() - $('.event').width();
+        var marg = $('.event').outerWidth(true) - $('.event').outerWidth();
+        $('.event').width((screenWidth-(tot * (bord+padd+marg)+1))/tot);
+
+        $('.eventDate').each(function(index, value) {
+		var colours = ['a', 'b', 'c', 'd', 'e', 'f'];
+		$(this).addClass(colours[index % 6]);
+	});
+
+
+        $('.eventField').each(function(index, value) {
+                var classStr = $(this).attr('class').split(/\s+/);
+                if(classStr.indexOf('start') != -1) {
+                        $(this).show();
+                } else if(classStr.indexOf('summary') != -1) {
+                        $(this).show();
+                }
+        });
+
+	$('.eventEl').click(function() {
+		showWindow($(this));
+	});
+
+});
+
+function showWindow(data) {
+           
+        var title = $('.summary',data).text();
+        var body = $('.description',data).html();
+
+        if(body == null) {
+                body = 'no description available';
+        }
+
+        $('<div id="overlay">').css({
+                width:$(document).width(),
+                height:$(document).height(),
+                opacity:0.6
+
+        }).appendTo('body').click(function(){
+                $(this).remove();
+                $('#windowBox').remove();
+        });
+
+        $('body').append('<div id="windowBox"><div id="titleDiv">'+title+'</div>'+body+'</div>');
+
+        $('#windowBox').css({
+                width:500,
+                height:350,
+                left: ($(window).width() - 500)/2,
+                top: ($(window).height() - 350)/2
+        });
+}
+