Skip to content

Commit

Permalink
Add a plethora of automated screenshots
Browse files Browse the repository at this point in the history
  • Loading branch information
@eternicode
eternicode committed Jan 26, 2014
1 parent 6a22b44 commit 2a78fe1
Show file tree
Hide file tree
Showing 60 changed files with 530 additions and 9 deletions.
31 changes: 31 additions & 0 deletions docs/_screenshots/demo_head.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('.popup > input').datepicker();
$('.popup > input').data('datepicker').picker.find('td:nth(15)').trigger('hover');
$('.component > div').datepicker({
format: 'mm-dd-yyyy'
});
$('.inline').datepicker();
};
</script>
</head>
<body data-capture=".popup, .component, .inline > div, .datepicker">
<div class="row">
<div class="span4 popup">
<input type="text" value="08/03/2013" class="form-control">
</div>
<div class="span4 component">
<div class="input-append date">
<input type="text" value="10-05-2003" readonly>
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<div class="span4 inline" data-date="01/03/2004"></div>
</div>
</body>
</html>
20 changes: 20 additions & 0 deletions docs/_screenshots/markup_component.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy'
});
};
</script>
</head>
<body data-capture=".date, .datepicker">
<div class="input-append date">
<input type="text" value="12-02-2012">
<span class="add-on"><i class="icon-th"></i></span>
</div>
</body>
</html>
28 changes: 28 additions & 0 deletions docs/_screenshots/markup_daterange.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('.input-daterange').datepicker({
format: 'yyyy-mm-dd'
});
};
</script>
</head>
<body data-capture=".input-daterange, .datepicker" data-show="input:first, input:last">
<form class="form-horizontal">
<div class="input-daterange span5">
<input type="text" class="input-small" value="2012-04-05" />
<span class="add-on">to</span>
<input type="text" class="input-small" value="2012-04-19" />
</div>
<div class="input-daterange span5">
<input type="text" class="input-small" value="2012-04-05" />
<span class="add-on">to</span>
<input type="text" class="input-small" value="2012-04-19" />
</div>
</form>
</body>
</html>
15 changes: 15 additions & 0 deletions docs/_screenshots/markup_inline.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('div').datepicker();
};
</script>
</head>
<body data-capture=".datepicker">
<div data-date="12/03/2012"></div>
</body>
</html>
17 changes: 17 additions & 0 deletions docs/_screenshots/markup_input.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy'
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="02-16-2012">
</body>
</html>
23 changes: 23 additions & 0 deletions docs/_screenshots/option_calendarweeks.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy',
calendarWeeks: true
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<div class="span6">
<input type="text" value="01-16-2012">
</div>
<div class="span6">
<input type="text" value="12-16-2012">
</div>
</body>
</html>
18 changes: 18 additions & 0 deletions docs/_screenshots/option_clearbtn.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy',
clearBtn: true
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="03-03-2013">
</body>
</html>
18 changes: 18 additions & 0 deletions docs/_screenshots/option_daysofweekdisabled.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy',
daysOfWeekDisabled: [0, 6]
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="03-05-2013">
</body>
</html>
18 changes: 18 additions & 0 deletions docs/_screenshots/option_enddate.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy',
endDate: '03-14-2013'
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="03-03-2013">
</body>
</html>
31 changes: 31 additions & 0 deletions docs/_screenshots/option_language.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script src="../../js/locales/bootstrap-datepicker.es.js" charset="UTF-8"></script>
<script src="../../js/locales/bootstrap-datepicker.fr.js" charset="UTF-8"></script>
<script src="../../js/locales/bootstrap-datepicker.zh-TW.js" charset="UTF-8"></script>
<script src="../../js/locales/bootstrap-datepicker.ru.js" charset="UTF-8"></script>
<script src="../../js/locales/bootstrap-datepicker.ja.js" charset="UTF-8"></script>
<script>
function setup(){
$('[data-date]').datepicker({
format: "mm/dd/yyyy" // To override locale-specific formats
});
};
</script>
</head>
<body data-capture=".row">
<div class="row">
<div class="span4" data-date="03/03/2013" data-date-language="en"></div>
<div class="span4" data-date="03/03/2013" data-date-start-view="1" data-date-language="es"></div>
<div class="span4" data-date="03/03/2013" data-date-language="fr"></div>
</div>
<div class="row">
<div class="span4" data-date="03/03/2013" data-date-start-view="1" data-date-language="zh-TW"></div>
<div class="span4" data-date="03/03/2013" data-date-language="ja"></div>
<div class="span4" data-date="03/03/2013" data-date-start-view="1" data-date-language="ru"></div>
</div>
</body>
</html>
27 changes: 27 additions & 0 deletions docs/_screenshots/option_multidate.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
multidate: true
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<div class="row">
<div class="span4">
<input type="text" value="03/03/2013,03/16/2013">
</div>
<div class="span4">
<input type="text" value="03/03/2013,06/16/2013" data-date-start-view="1">
</div>
<div class="span4">
<input type="text" value="03/03/2013,03/16/2014" data-date-start-view="2">
</div>
</div>
</body>
</html>
18 changes: 18 additions & 0 deletions docs/_screenshots/option_startdate.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
format: 'mm-dd-yyyy',
startDate: '03-14-2013'
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="03-18-2013">
</body>
</html>
17 changes: 17 additions & 0 deletions docs/_screenshots/option_todaybtn.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker({
todayBtn: true
});
};
</script>
</head>
<body data-capture="input, .datepicker">
<input type="text" value="03/03/2013">
</body>
</html>
45 changes: 45 additions & 0 deletions docs/_screenshots/option_todayhighlight.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function patch_date(f){
var NativeDate = window.Date;
var date = function date(y,m,d,h,i,s,j){
switch(arguments.length){
case 0: return date.now ? new NativeDate(date.now) : new NativeDate();
case 1: return new NativeDate(y);
case 2: return new NativeDate(y,m);
case 3: return new NativeDate(y,m,d);
case 4: return new NativeDate(y,m,d,h);
case 5: return new NativeDate(y,m,d,h,i);
case 6: return new NativeDate(y,m,d,h,i,s);
case 7: return new NativeDate(y,y,m,d,h,i,s,j);
}
};
date.UTC = NativeDate.UTC;
return function(){
Array.prototype.push.call(arguments, date);
window.Date = date;
res = f.apply(this, arguments);
window.Date = NativeDate;
}
}
var setup = patch_date(function setup(Date){
Date.now = new Date(2013, 2, 18);
$('input').datepicker({
todayHighlight: true
});
});
</script>
</head>
<body data-capture="input, .datepicker">
<div class="span4">
<input type="text" value="03/03/2013">
</div>
<div class="span4">
<input type="text" value="03/18/2013">
</div>
</body>
</html>
23 changes: 23 additions & 0 deletions docs/_screenshots/option_weekstart.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/common.css">
<script src="script/common.js"></script>
<script>
function setup(){
$('input').datepicker();
};
</script>
</head>
<body data-capture="input, .datepicker">
<div class="span4">
<input type="text" value="03/03/2013" data-date-week-start="2">
</div>
<div class="span4">
<input type="text" value="03/03/2013" data-date-week-start="4">
</div>
<div class="span4">
<input type="text" value="03/03/2013" data-date-week-start="6">
</div>
</body>
</html>
9 changes: 9 additions & 0 deletions docs/_screenshots/script/common.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
@import url('http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css');
@import url('../../../css/datepicker.css');

body {
/* Padding around all elements to allow space for screenshots */
padding: 10px;
/* Transparent background for PNG screenshots */
background: none;
}
2 changes: 2 additions & 0 deletions docs/_screenshots/script/common.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
document.write("<script src='http://code.jquery.com/jquery-1.10.2.min.js'></script>");
document.write("<script src='../../js/bootstrap-datepicker.js'></script>");
21 changes: 21 additions & 0 deletions docs/_screenshots/script/debug.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
/*
Usage: $ phantomjs --remote-debugger-port=9001 --remote-debugger-autorun=yes debug.js page.html
Open Chrome tab to http://localhost:9001/; open second link (ie, path to page.html)
*/
var system = require('system' ), fs = require('fs'), webpage = require('webpage');

(function(phantom){
var page=webpage.create();

function debugPage(){
console.log("Refresh a second debugger-port page and open a second webkit inspector for the target page.");
console.log("Letting this page continue will then trigger a break in the target page.");
debugger; // pause here in first web browser tab for steps 5 & 6
page.open(system.args[1]);
page.evaluateAsync(function() {
debugger; // step 7 will wait here in the second web browser tab
});
}
debugPage();
}(phantom));
Loading

0 comments on commit 2a78fe1

Please sign in to comment.