Merge branch 'master' of github.com:shower/shower

Gruntfile.js

@@ -11,19 +11,28 @@ module.exports = function(grunt) {
 				dest: 'shower.min.js'
 			}
 		},
+		connect: {
+			ribbon: {
+				options: {
+					port: 7497
+				}
+			}
+		},
 		dalek: {
-			test: {
+			options: {
+				browser: ['chrome']
+			},
 			src: [
-					'tests/shortcuts.js',
-					'tests/inner-nav.js'
+				'tests/*.js'
 			]
 		}
-		}
 	});
 
 	grunt.loadNpmTasks('grunt-contrib-uglify');
+	grunt.loadNpmTasks('grunt-contrib-connect');
 	grunt.loadNpmTasks('grunt-dalek');
 
 	grunt.registerTask('default', ['uglify']);
+	grunt.registerTask('test', ['connect', 'dalek']);
 
 };
\ No newline at end of file

package.json

@@ -6,9 +6,11 @@
   "private": true,
   "devDependencies": {
     "dalekjs": "0.0.8",
+    "dalek-browser-chrome": "0.0.9",
     "grunt": "~0.4.2",
-    "grunt-contrib-uglify": "~0.3.0",
+    "grunt-contrib-uglify": "~0.3.2",
     "grunt-dalek": "~0.2.0",
-    "grunt-contrib-watch": "~0.5.3"
+    "grunt-contrib-watch": "~0.5.3",
+    "grunt-contrib-connect": "~0.6.0"
   }
 }

shower.js

@@ -493,7 +493,7 @@ window.shower = window.shower || (function(window, document, undefined) {
 	shower.first = function(callback) {
 		var slide = shower.slideList[shower.getCurrentSlideNumber()];
 
-		slide.timing && slide.stopTimer();
+		slide && slide.timing && slide.stopTimer();
 		shower.go(0);
 
 		if (typeof(callback) === 'function') {
@@ -508,7 +508,7 @@ window.shower = window.shower || (function(window, document, undefined) {
 	shower.last = function(callback) {
 		var slide = shower.slideList[shower.getCurrentSlideNumber()];
 
-		slide.timing && slide.stopTimer();
+		slide && slide.timing && slide.stopTimer();
 		shower.go(shower.slideList.length - 1);
 
 		if (typeof(callback) === 'function') {
@@ -599,13 +599,18 @@ window.shower = window.shower || (function(window, document, undefined) {
 	/**
 	* Get current slide number. Starts from zero. Warning: when you have
 	* slide number 1 in URL this method will return 0.
-	* If something is wrong return 0 to get the first slide.
+	* If there is no slide number in url, return -1.
+	* If there is a slide number in url, but the slide does not exist, return 0.
 	* @returns {Number}
 	*/
 	shower.getCurrentSlideNumber = function() {
 		var i = shower.slideList.length - 1,
 			currentSlideId = url.hash.substr(1);
 
+		if (currentSlideId === '') {
+			return -1;
+		}
+
 		// As fast as you can ;-)
 		// http://jsperf.com/for-vs-foreach/46
 		for (; i >= 0; --i) {
@@ -634,6 +639,11 @@ window.shower = window.shower || (function(window, document, undefined) {
 			throw new Error('You can\'t scroll to because you in slide mode. Please, switch to list mode.');
 		}
 
+		// @TODO: WTF?
+		if (-1 === slideNumber) {
+			return ret;
+		}
+
 		if (shower.slideList[slideNumber]) {
 			currentSlide = document.getElementById(shower.slideList[slideNumber].id);
 			window.scrollTo(0, currentSlide.offsetTop);
@@ -804,13 +814,27 @@ window.shower = window.shower || (function(window, document, undefined) {
 	// Event handlers
 
 	window.addEventListener('DOMContentLoaded', function() {
-		if (body.classList.contains('full') || shower.isSlideMode()) {
-			shower.go(shower.getCurrentSlideNumber());
+		var currentSlideNumber = shower.getCurrentSlideNumber(),
+			isSlideMode = body.classList.contains('full') || shower.isSlideMode();
+
+		if (currentSlideNumber === -1 && isSlideMode) {
+			shower.go(0);
+		} else if (currentSlideNumber ===  0 || isSlideMode) {
+			shower.go(currentSlideNumber);
+		}
+
+		if (isSlideMode) {
 			shower.enterSlideMode();
 		}
 	}, false);
 
 	window.addEventListener('popstate', function() {
+		var currentSlideNumber = shower.getCurrentSlideNumber();
+
+		if (currentSlideNumber !== -1) {
+			shower.go(currentSlideNumber);
+		}
+
 		if (shower.isListMode()) {
 			shower.enterListMode();
 		} else {
@@ -826,7 +850,7 @@ window.shower = window.shower || (function(window, document, undefined) {
 
 	document.addEventListener('keydown', function(e) {
 		var currentSlideNumber = shower.getCurrentSlideNumber(),
-			slide = shower.slideList[currentSlideNumber],
+			slide = shower.slideList[ currentSlideNumber !== -1 ? currentSlideNumber : 0 ],
 			slideNumber;
 
 		switch (e.which) {
@@ -860,7 +884,7 @@ window.shower = window.shower || (function(window, document, undefined) {
 			break;
 
 			case 13: // Enter
-				if (shower.isListMode() && currentSlideNumber) {
+				if (shower.isListMode() && -1 !== currentSlideNumber) {
 					e.preventDefault();
 
 					shower.enterSlideMode();

tests/index.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<title>Test page for Shower</title>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=792, user-scalable=no">
+	<meta http-equiv="x-ua-compatible" content="ie=edge">
+	<link rel="stylesheet" href="../themes/ribbon/styles/screen.css">
+</head>
+<body class="list">
+	<section class="slide"><div>
+		<h2>1</h2>
+	</div></section>
+	<section class="slide"><div>
+		<h2>2</h2>
+	</div></section>
+	<section class="slide" data-timing="00:03"><div>
+		<h2>3</h2>
+	</div></section>
+	<section class="slide"><div>
+		<h2>4</h2>
+	</div></section>
+	<section class="slide"><div>
+		<h2>5</h2>
+		<div class="next">1</div>
+		<div class="next">2</div>
+		<div class="next">3</div>
+	</div></section>
+	<section class="slide"><div>
+		<h2>6</h2>
+	</div></section>
+	<script src="../shower.js"></script>
+</body>
+</html>
\ No newline at end of file

tests/inner-nav.js

-module.exports = {
-	// Right
-	'Right Arrow key is switching .next to .active': function (test) {
-		test
-			.open('themes/ribbon/index.html?full#20')
-			.sendKeys('body', '\uE014') // Right
-			.assert.attr('[id="20"] li:nth-child(2)', 'class', 'next active', 'First .next is .active')
-		.done();
-	}
-};
\ No newline at end of file

tests/navigation.js

+module.exports = {
+	'Right Arrow key is switching first Next item to Active': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#5')
+			.sendKeys('body', '\uE014') // Right
+			.assert.attr('[id="5"] .next:first-of-type', 'class').to.contain('active', 'First Next item is Active')
+		.done();
+	},
+	'Left Arrow key is switching Active items back to Next': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#5')
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE012') // Left
+			.sendKeys('body', '\uE012') // Left
+			.assert.numberOfElements('[id="5"] .next.active', 0, 'There are no Active items')
+		.done();
+	},
+	'Right Arrow key is switching to next slide once all Next items becomes Active': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#5')
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.assert.attr('[id="6"]', 'class').to.contain('active', 'Next slide is Active')
+		.done();
+	},
+	'Left Arrow key is switching to previous slide when all Next items becomes Active': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#5')
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE014') // Right
+			.sendKeys('body', '\uE012') // Left
+			// Not sure why it’s failing. It works fine manually
+			.assert.attr('[id="4"]', 'class').to.contain('active', 'Previous slide is Active')
+		.done();
+	},
+	'Reload reset navigation': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#5')
+			.sendKeys('body', '\uE014') // Right
+			.reload()
+			.assert.numberOfElements('[id="5"] .next.active', 0, 'There are no Active items')
+		.done();
+	}
+};
\ No newline at end of file

tests/timer.js

+module.exports = {
+	'Timer is switching to the next slide when finished': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#3')
+			.wait(5000)
+			.assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active')
+		.done();
+	},
+	'Timer becomes Active and switching to the next slide when finished': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#4')
+			.sendKeys('body', '\uE012') // Left
+			.wait(5000)
+			.assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active')
+		.done();
+	},
+	'Left Arrow key is skipping timer while it’s not finished': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#3')
+			.sendKeys('body', '\uE012') // Left
+			.assert.attr('[id="2"]', 'class').to.contain('active', 'Previous slide is Active')
+		.done();
+	},
+	'Right Arrow key is skipping timer while it’s not finished': function (test) {
+		test
+			.open('http://localhost:7497/tests/?full#3')
+			.sendKeys('body', '\uE014') // Right
+			.assert.attr('[id="4"]', 'class').to.contain('active', 'Next slide is Active')
+		.done();
+	}
+};
\ No newline at end of file