PLPeeters/FlipClock_Tests.html

## FlipClock_Tests.html
<html>
	<head>
		<link rel="stylesheet" href="compiled/flipclock.css">
	</head>
	<body>
		<h1>FlipClock.js tests</h1>
		<div id="countdown1"></div>
		<div id="countdown2"></div>
		<div id="countdown3"></div>
		<div id="countdown4"></div>
		<div id="countdown5"></div>
		<div id="countdown6"></div>
		<div id="countdown7"></div>
		<div id="countdown8"></div>
		<div id="countdown9"></div>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
		<script src="compiled/flipclock.js"></script>
		<script>
			var now = new Date();

			// Test 1: 01d 00h 00m 10s, down using Date
			// Result: does random stuff, guess it's still expected.
			var clock1 = $('#countdown1').FlipClock({
				clockFace: 'DailyCounter',
				clockFaceOptions: {
					countdown: true
				}
			});

			var end = new Date();
			end.setTime(end.getTime() + (24 * 60 * 60 * 1000) + (10 * 1000));

			clock1.setTime(end);
			clock1.start();

			// Test 2: 01d 00h 00m 10s, down
			// Result: counts down two by two (counts down one before flip and one during flip) and displays 60 seconds when it should display 00
			var clock2 = $('#countdown2').FlipClock({
				clockFace: 'DailyCounter',
				clockFaceOptions: {
					countdown: true
				}
			});

			var end = new Date();
			end.setTime(end.getTime() + (24 * 60 * 60 * 1000) + (10 * 1000));

			clock2.setTime((end.getTime() - now.getTime()) / 1000);
			clock2.start();

			// Test 3: 01h 00m 10s, down
			// Result: counts down two by two and displays 60 seconds when it should display 00
			var clock3 = $('#countdown3').FlipClock({
				clockFace: 'DailyCounter',
				clockFaceOptions: {
					countdown: true
				}
			});

			var end = new Date();
			end.setTime(end.getTime() + (60 * 60 * 1000) + (10 * 1000)); // Month and 10 seconds

			clock3.setTime((end.getTime() - now.getTime()) / 1000);
			clock3.start();

			// Test 4: 01m 10s, down
			// Result: counts down two by two and displays 60 seconds when it should display 00
			var clock4 = $('#countdown4').FlipClock({
				clockFace: 'DailyCounter',
				clockFaceOptions: {
					countdown: true
				}
			});

			var end = new Date();
			end.setTime(end.getTime() + (60 * 1000) + (10 * 1000));

			clock4.setTime((end.getTime() - now.getTime()) / 1000);
			clock4.start();

			// Test 5: 10s, down
			// Result: counts down two by two, then continues to count down in negatives
			var clock5 = $('#countdown5').FlipClock({
				clockFace: 'DailyCounter',
				clockFaceOptions: {
					countdown: true
				}
			});

			var end = new Date();
			end.setTime(end.getTime() + (10 * 1000));

			clock5.setTime((end.getTime() - now.getTime()) / 1000);
			clock5.start();

			// Test 6: 50s, up
			// Result: counts up normally, but displays 60 seconds when it should display 00
			var clock6 = $('#countdown6').FlipClock({
				clockFace: 'DailyCounter'
			});

			var start = new Date();
			start.setTime(start.getTime() - (50 * 1000));

			clock6.setTime((now.getTime() - start.getTime()) / 1000);
			clock6.start();

			// Test 7: 1h 59m 50s, up
			// Result: counts up normally, but displays 60 seconds when it should display 00
			var clock7 = $('#countdown7').FlipClock({
				clockFace: 'DailyCounter'
			});

			var start = new Date();
			start.setTime(start.getTime() - (60 * 60 * 1000) - (59 * 60 * 1000) - (50 * 1000));

			clock7.setTime((now.getTime() - start.getTime()) / 1000);
			clock7.start();

			// Test 8: 23h 59m 50s, up
			// Result: counts up normally, but displays 60 seconds when it should display 00
			var clock8 = $('#countdown8').FlipClock({
				clockFace: 'DailyCounter'
			});

			var start = new Date();
			start.setTime(start.getTime() - (23 * 60 * 60 * 1000) - (59 * 60 * 1000) - (50 * 1000));

			clock8.setTime((now.getTime() - start.getTime()) / 1000);
			clock8.start();

			// Test 9: up using Date
			// Result: flips only once, guess it's expected
			var clock9 = $('#countdown9').FlipClock({
				clockFace: 'DailyCounter'
			});

			clock9.setTime(now);
			clock9.start();
		</script>
	</body>
</html>
	<html>
	<head>
	<link rel="stylesheet" href="compiled/flipclock.css">
	</head>
	<body>
	<h1>FlipClock.js tests</h1>
	<div id="countdown1"></div>
	<div id="countdown2"></div>
	<div id="countdown3"></div>
	<div id="countdown4"></div>
	<div id="countdown5"></div>
	<div id="countdown6"></div>
	<div id="countdown7"></div>
	<div id="countdown8"></div>
	<div id="countdown9"></div>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
	<script src="compiled/flipclock.js"></script>
	<script>
	var now = new Date();

	// Test 1: 01d 00h 00m 10s, down using Date
	// Result: does random stuff, guess it's still expected.
	var clock1 = $('#countdown1').FlipClock({
	clockFace: 'DailyCounter',
	clockFaceOptions: {
	countdown: true
	}
	});

	var end = new Date();
	end.setTime(end.getTime() + (24 * 60 * 60 * 1000) + (10 * 1000));

	clock1.setTime(end);
	clock1.start();

	// Test 2: 01d 00h 00m 10s, down
	// Result: counts down two by two (counts down one before flip and one during flip) and displays 60 seconds when it should display 00
	var clock2 = $('#countdown2').FlipClock({
	clockFace: 'DailyCounter',
	clockFaceOptions: {
	countdown: true
	}
	});

	var end = new Date();
	end.setTime(end.getTime() + (24 * 60 * 60 * 1000) + (10 * 1000));

	clock2.setTime((end.getTime() - now.getTime()) / 1000);
	clock2.start();

	// Test 3: 01h 00m 10s, down
	// Result: counts down two by two and displays 60 seconds when it should display 00
	var clock3 = $('#countdown3').FlipClock({
	clockFace: 'DailyCounter',
	clockFaceOptions: {
	countdown: true
	}
	});

	var end = new Date();
	end.setTime(end.getTime() + (60 * 60 * 1000) + (10 * 1000)); // Month and 10 seconds

	clock3.setTime((end.getTime() - now.getTime()) / 1000);
	clock3.start();

	// Test 4: 01m 10s, down
	// Result: counts down two by two and displays 60 seconds when it should display 00
	var clock4 = $('#countdown4').FlipClock({
	clockFace: 'DailyCounter',
	clockFaceOptions: {
	countdown: true
	}
	});

	var end = new Date();
	end.setTime(end.getTime() + (60 * 1000) + (10 * 1000));

	clock4.setTime((end.getTime() - now.getTime()) / 1000);
	clock4.start();

	// Test 5: 10s, down
	// Result: counts down two by two, then continues to count down in negatives
	var clock5 = $('#countdown5').FlipClock({
	clockFace: 'DailyCounter',
	clockFaceOptions: {
	countdown: true
	}
	});

	var end = new Date();
	end.setTime(end.getTime() + (10 * 1000));

	clock5.setTime((end.getTime() - now.getTime()) / 1000);
	clock5.start();

	// Test 6: 50s, up
	// Result: counts up normally, but displays 60 seconds when it should display 00
	var clock6 = $('#countdown6').FlipClock({
	clockFace: 'DailyCounter'
	});

	var start = new Date();
	start.setTime(start.getTime() - (50 * 1000));

	clock6.setTime((now.getTime() - start.getTime()) / 1000);
	clock6.start();

	// Test 7: 1h 59m 50s, up
	// Result: counts up normally, but displays 60 seconds when it should display 00
	var clock7 = $('#countdown7').FlipClock({
	clockFace: 'DailyCounter'
	});

	var start = new Date();
	start.setTime(start.getTime() - (60 * 60 * 1000) - (59 * 60 * 1000) - (50 * 1000));

	clock7.setTime((now.getTime() - start.getTime()) / 1000);
	clock7.start();

	// Test 8: 23h 59m 50s, up
	// Result: counts up normally, but displays 60 seconds when it should display 00
	var clock8 = $('#countdown8').FlipClock({
	clockFace: 'DailyCounter'
	});

	var start = new Date();
	start.setTime(start.getTime() - (23 * 60 * 60 * 1000) - (59 * 60 * 1000) - (50 * 1000));

	clock8.setTime((now.getTime() - start.getTime()) / 1000);
	clock8.start();

	// Test 9: up using Date
	// Result: flips only once, guess it's expected
	var clock9 = $('#countdown9').FlipClock({
	clockFace: 'DailyCounter'
	});

	clock9.setTime(now);
	clock9.start();
	</script>
	</body>
	</html>