kamishibai 0.6.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/.gitignore +1 -0
- data/LICENSE +29 -0
- data/README.md +91 -0
- data/bin/kamishibai +59 -0
- data/changelogs.txt +6 -0
- data/images/reading.jpg +0 -0
- data/images/settings.jpg +0 -0
- data/images/view_browse.jpg +0 -0
- data/images/view_dir.jpg +0 -0
- data/kamishibai.gemspec +31 -0
- data/lib/kamishibai.rb +35 -0
- data/lib/kamishibai/book.rb +97 -0
- data/lib/kamishibai/config.rb +90 -0
- data/lib/kamishibai/database.rb +330 -0
- data/lib/kamishibai/functions.rb +332 -0
- data/lib/kamishibai/patches.rb +58 -0
- data/lib/kamishibai/version.rb +7 -0
- data/lib/kamishibai/webserver.rb +502 -0
- data/lib/kamishibai/webserver_cmds.rb +26 -0
- data/lib/kamishibai/webserver_config.rb +91 -0
- data/lib/kamishibai/webserver_filemanager.rb +29 -0
- data/lib/kamishibai/webserver_tablet.rb +259 -0
- data/lib/kamishibai/workers.rb +39 -0
- data/public/css/browse.css +390 -0
- data/public/css/config.css +3 -0
- data/public/css/reader.css +119 -0
- data/public/css/styles.css +30 -0
- data/public/css/tablet_browse.css +247 -0
- data/public/css/tablet_reader.css +323 -0
- data/public/css/tablet_reader_input.css +191 -0
- data/public/images/ajax-loader.gif +0 -0
- data/public/images/delete.png +0 -0
- data/public/images/folder-mini-up.png +0 -0
- data/public/images/folder-mini.png +0 -0
- data/public/images/spinner.gif +0 -0
- data/public/images/trash-empty-mini.png +0 -0
- data/public/images/trash-full-mini.png +0 -0
- data/public/js/browse.js +391 -0
- data/public/js/config.js +190 -0
- data/public/js/reader.js +497 -0
- data/public/js/swipeview-k.js +478 -0
- data/public/js/tablet3.js +241 -0
- data/public/js/tablet3_browse.js +173 -0
- data/public/js/tablet3_reader.js +534 -0
- data/public/js/utilities.js +170 -0
- data/public/lang/k-cn.json +82 -0
- data/public/lang/k-en.json +82 -0
- data/public/lang/k-ja.json +82 -0
- data/public/vendor/css/bootstrap-slider.css +252 -0
- data/public/vendor/css/bootstrap-theme.css +476 -0
- data/public/vendor/css/bootstrap-theme.css.map +1 -0
- data/public/vendor/css/bootstrap-theme.min.css +5 -0
- data/public/vendor/css/bootstrap.css +6584 -0
- data/public/vendor/css/bootstrap.css.map +1 -0
- data/public/vendor/css/bootstrap.min.css +5 -0
- data/public/vendor/css/jquery-ui-1.10.0.custom.css +1614 -0
- data/public/vendor/css/jquery.mobile-1.3.1.min.css +3 -0
- data/public/vendor/css/jqueryFileTree.css +91 -0
- data/public/vendor/fonts/glyphicons-halflings-regular.eot +0 -0
- data/public/vendor/fonts/glyphicons-halflings-regular.svg +288 -0
- data/public/vendor/fonts/glyphicons-halflings-regular.ttf +0 -0
- data/public/vendor/fonts/glyphicons-halflings-regular.woff +0 -0
- data/public/vendor/fonts/glyphicons-halflings-regular.woff2 +0 -0
- data/public/vendor/images/application.png +0 -0
- data/public/vendor/images/code.png +0 -0
- data/public/vendor/images/css.png +0 -0
- data/public/vendor/images/db.png +0 -0
- data/public/vendor/images/dim.png +0 -0
- data/public/vendor/images/directory.png +0 -0
- data/public/vendor/images/doc.png +0 -0
- data/public/vendor/images/file.png +0 -0
- data/public/vendor/images/film.png +0 -0
- data/public/vendor/images/flash.png +0 -0
- data/public/vendor/images/folder_open.png +0 -0
- data/public/vendor/images/grey.png +0 -0
- data/public/vendor/images/html.png +0 -0
- data/public/vendor/images/icons-18-black.png +0 -0
- data/public/vendor/images/icons-18-white.png +0 -0
- data/public/vendor/images/icons-36-black.png +0 -0
- data/public/vendor/images/icons-36-white.png +0 -0
- data/public/vendor/images/java.png +0 -0
- data/public/vendor/images/linux.png +0 -0
- data/public/vendor/images/music.png +0 -0
- data/public/vendor/images/pdf.png +0 -0
- data/public/vendor/images/php.png +0 -0
- data/public/vendor/images/picture.png +0 -0
- data/public/vendor/images/ppt.png +0 -0
- data/public/vendor/images/psd.png +0 -0
- data/public/vendor/images/ruby.png +0 -0
- data/public/vendor/images/script.png +0 -0
- data/public/vendor/images/spinner.gif +0 -0
- data/public/vendor/images/txt.png +0 -0
- data/public/vendor/images/ui-bg_diagonals-thick_18_b81900_40x40.png +0 -0
- data/public/vendor/images/ui-bg_diagonals-thick_20_666666_40x40.png +0 -0
- data/public/vendor/images/ui-bg_flat_0_aaaaaa_40x100.png +0 -0
- data/public/vendor/images/ui-bg_flat_10_000000_40x100.png +0 -0
- data/public/vendor/images/ui-bg_flat_30_cccccc_40x100.png +0 -0
- data/public/vendor/images/ui-bg_flat_50_5c5c5c_40x100.png +0 -0
- data/public/vendor/images/ui-bg_flat_55_fbec88_40x100.png +0 -0
- data/public/vendor/images/ui-bg_flat_75_ffffff_40x100.png +0 -0
- data/public/vendor/images/ui-bg_glass_100_f6f6f6_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_100_fdf5ce_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_20_555555_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_40_0078a3_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_40_ffc73d_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_55_fbf9ee_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_65_ffffff_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_75_d0e5f5_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_75_dadada_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_75_e6e6e6_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_85_dfeffc_1x400.png +0 -0
- data/public/vendor/images/ui-bg_glass_95_fef1ec_1x400.png +0 -0
- data/public/vendor/images/ui-bg_gloss-wave_25_333333_500x100.png +0 -0
- data/public/vendor/images/ui-bg_gloss-wave_35_f6a828_500x100.png +0 -0
- data/public/vendor/images/ui-bg_gloss-wave_55_5c9ccc_500x100.png +0 -0
- data/public/vendor/images/ui-bg_highlight-soft_100_eeeeee_1x100.png +0 -0
- data/public/vendor/images/ui-bg_highlight-soft_75_cccccc_1x100.png +0 -0
- data/public/vendor/images/ui-bg_highlight-soft_75_ffe45c_1x100.png +0 -0
- data/public/vendor/images/ui-bg_highlight-soft_80_eeeeee_1x100.png +0 -0
- data/public/vendor/images/ui-bg_inset-hard_100_f5f8f9_1x100.png +0 -0
- data/public/vendor/images/ui-bg_inset-hard_100_fcfdfd_1x100.png +0 -0
- data/public/vendor/images/ui-bg_inset-soft_25_000000_1x100.png +0 -0
- data/public/vendor/images/ui-bg_inset-soft_30_f58400_1x100.png +0 -0
- data/public/vendor/images/ui-icons_217bc0_256x240.png +0 -0
- data/public/vendor/images/ui-icons_222222_256x240.png +0 -0
- data/public/vendor/images/ui-icons_228ef1_256x240.png +0 -0
- data/public/vendor/images/ui-icons_2e83ff_256x240.png +0 -0
- data/public/vendor/images/ui-icons_454545_256x240.png +0 -0
- data/public/vendor/images/ui-icons_469bdd_256x240.png +0 -0
- data/public/vendor/images/ui-icons_4b8e0b_256x240.png +0 -0
- data/public/vendor/images/ui-icons_6da8d5_256x240.png +0 -0
- data/public/vendor/images/ui-icons_888888_256x240.png +0 -0
- data/public/vendor/images/ui-icons_a83300_256x240.png +0 -0
- data/public/vendor/images/ui-icons_cccccc_256x240.png +0 -0
- data/public/vendor/images/ui-icons_cd0a0a_256x240.png +0 -0
- data/public/vendor/images/ui-icons_d8e7f3_256x240.png +0 -0
- data/public/vendor/images/ui-icons_ef8c08_256x240.png +0 -0
- data/public/vendor/images/ui-icons_f9bd01_256x240.png +0 -0
- data/public/vendor/images/ui-icons_ffd27a_256x240.png +0 -0
- data/public/vendor/images/ui-icons_ffffff_256x240.png +0 -0
- data/public/vendor/images/xls.png +0 -0
- data/public/vendor/images/zip.png +0 -0
- data/public/vendor/js/bootstrap-slider.js +1550 -0
- data/public/vendor/js/bootstrap.js +2317 -0
- data/public/vendor/js/bootstrap.min.js +7 -0
- data/public/vendor/js/jquery-2.1.4.js +9210 -0
- data/public/vendor/js/jquery-2.1.4.min.js +4 -0
- data/public/vendor/js/jquery-2.1.4.min.map +1 -0
- data/public/vendor/js/jquery-ui-1.10.2.custom.min.js +7 -0
- data/public/vendor/js/jquery.cookie.js +72 -0
- data/public/vendor/js/jquery.hammer.min.js +7 -0
- data/public/vendor/js/jquery.lazyload.min.js +15 -0
- data/public/vendor/js/jquery.localize.js +180 -0
- data/public/vendor/js/jquery.mobile-1.3.1.min.js +7 -0
- data/public/vendor/js/jquery.scrollTo-1.4.3.1.js +218 -0
- data/public/vendor/js/jqueryFileTree.js +95 -0
- data/public/vendor/js/swipeview.js +471 -0
- data/views/browse.haml +97 -0
- data/views/config.haml +115 -0
- data/views/layout.haml +12 -0
- data/views/login.haml +51 -0
- data/views/reader.haml +70 -0
- data/views/statistics.haml +108 -0
- data/views/tablet3.haml +80 -0
- metadata +334 -0
@@ -0,0 +1,478 @@
|
|
1
|
+
/*!
|
2
|
+
* SwipeView v1.0 ~ Copyright (c) 2012 Matteo Spinelli, http://cubiq.org
|
3
|
+
* Released under MIT license, http://cubiq.org/license
|
4
|
+
*
|
5
|
+
* with modification made by Mac
|
6
|
+
* to support manga reading and fixes positioning bug for swipeview-masterpage-(0,1,2) when reading in Android's Firefox
|
7
|
+
* also fixes bugs on loops
|
8
|
+
*/
|
9
|
+
var SwipeView = (function (window, document) {
|
10
|
+
var dummyStyle = document.createElement('div').style,
|
11
|
+
vendor = (function () {
|
12
|
+
var vendors = 't,webkitT,MozT,msT,OT'.split(','),
|
13
|
+
t,
|
14
|
+
i = 0,
|
15
|
+
l = vendors.length;
|
16
|
+
|
17
|
+
for ( ; i < l; i++ ) {
|
18
|
+
t = vendors[i] + 'ransform';
|
19
|
+
if ( t in dummyStyle ) {
|
20
|
+
return vendors[i].substr(0, vendors[i].length - 1);
|
21
|
+
}
|
22
|
+
}
|
23
|
+
|
24
|
+
return false;
|
25
|
+
})(),
|
26
|
+
cssVendor = vendor ? '-' + vendor.toLowerCase() + '-' : '',
|
27
|
+
|
28
|
+
// Style properties
|
29
|
+
transform = prefixStyle('transform'),
|
30
|
+
transitionDuration = prefixStyle('transitionDuration'),
|
31
|
+
|
32
|
+
// Browser capabilities
|
33
|
+
has3d = prefixStyle('perspective') in dummyStyle,
|
34
|
+
hasTouch = 'ontouchstart' in window,
|
35
|
+
hasTransform = !!vendor,
|
36
|
+
hasTransitionEnd = prefixStyle('transition') in dummyStyle,
|
37
|
+
|
38
|
+
// Helpers
|
39
|
+
translateZ = has3d ? ' translateZ(0)' : '',
|
40
|
+
|
41
|
+
// Events
|
42
|
+
resizeEvent = 'onorientationchange' in window ? 'orientationchange' : 'resize',
|
43
|
+
startEvent = hasTouch ? 'touchstart' : 'mousedown',
|
44
|
+
moveEvent = hasTouch ? 'touchmove' : 'mousemove',
|
45
|
+
endEvent = hasTouch ? 'touchend' : 'mouseup',
|
46
|
+
cancelEvent = hasTouch ? 'touchcancel' : 'mouseup',
|
47
|
+
transitionEndEvent = (function () {
|
48
|
+
if ( vendor === false ) return false;
|
49
|
+
|
50
|
+
var transitionEnd = {
|
51
|
+
'' : 'transitionend',
|
52
|
+
'webkit' : 'webkitTransitionEnd',
|
53
|
+
'Moz' : 'transitionend',
|
54
|
+
'O' : 'oTransitionEnd',
|
55
|
+
'ms' : 'MSTransitionEnd'
|
56
|
+
};
|
57
|
+
|
58
|
+
return transitionEnd[vendor];
|
59
|
+
})(),
|
60
|
+
|
61
|
+
SwipeView = function (el, options) {
|
62
|
+
var i,
|
63
|
+
div,
|
64
|
+
className,
|
65
|
+
pageIndex;
|
66
|
+
|
67
|
+
this.wrapper = typeof el == 'string' ? document.querySelector(el) : el;
|
68
|
+
this.options = {
|
69
|
+
text: null,
|
70
|
+
numberOfPages: 3,
|
71
|
+
snapThreshold: null,
|
72
|
+
hastyPageFlip: false,
|
73
|
+
loop: true
|
74
|
+
};
|
75
|
+
|
76
|
+
// User defined options
|
77
|
+
for (i in options) this.options[i] = options[i];
|
78
|
+
|
79
|
+
this.wrapper.style.overflow = 'hidden';
|
80
|
+
this.wrapper.style.position = 'relative';
|
81
|
+
|
82
|
+
this.masterPages = [];
|
83
|
+
|
84
|
+
div = document.createElement('div');
|
85
|
+
div.id = 'swipeview-slider';
|
86
|
+
div.style.cssText = 'position:relative;top:0;height:100%;width:100%;' + cssVendor + 'transition-duration:0;' + cssVendor + 'transform:translateZ(0);' + cssVendor + 'transition-timing-function:ease-out';
|
87
|
+
this.wrapper.appendChild(div);
|
88
|
+
this.slider = div;
|
89
|
+
|
90
|
+
this.refreshSize();
|
91
|
+
|
92
|
+
for (i=-1; i<2; i++) {
|
93
|
+
div = document.createElement('div');
|
94
|
+
div.id = 'swipeview-masterpage-' + (i+1);
|
95
|
+
div.style.cssText = cssVendor + 'transform:translateZ(0);position:absolute;top:0;height:100%;width:100%;left:' + i*window.innerWidth + 'px';
|
96
|
+
|
97
|
+
if (!div.dataset) div.dataset = {};
|
98
|
+
pageIndex = i == -1 ? this.options.numberOfPages - 1 : i;
|
99
|
+
div.dataset.pageIndex = pageIndex;
|
100
|
+
div.dataset.upcomingPageIndex = pageIndex;
|
101
|
+
|
102
|
+
// causing bug if the loop is turned off, making the third page invisible when navigated by goToPage(2)
|
103
|
+
//if (!this.options.loop && i == -1) div.style.visibility = 'hidden';
|
104
|
+
|
105
|
+
this.slider.appendChild(div);
|
106
|
+
this.masterPages.push(div);
|
107
|
+
}
|
108
|
+
|
109
|
+
className = this.masterPages[1].className;
|
110
|
+
this.masterPages[1].className = !className ? 'swipeview-active' : className + ' swipeview-active';
|
111
|
+
|
112
|
+
window.addEventListener(resizeEvent, this, false);
|
113
|
+
this.wrapper.addEventListener(startEvent, this, false);
|
114
|
+
this.wrapper.addEventListener(moveEvent, this, false);
|
115
|
+
this.wrapper.addEventListener(endEvent, this, false);
|
116
|
+
this.slider.addEventListener(transitionEndEvent, this, false);
|
117
|
+
// in Opera >= 12 the transitionend event is lowercase so we register both events
|
118
|
+
if ( vendor == 'O' ) this.slider.addEventListener(transitionEndEvent.toLowerCase(), this, false);
|
119
|
+
|
120
|
+
/* if (!hasTouch) {
|
121
|
+
this.wrapper.addEventListener('mouseout', this, false);
|
122
|
+
}*/
|
123
|
+
};
|
124
|
+
|
125
|
+
SwipeView.prototype = {
|
126
|
+
currentMasterPage: 1,
|
127
|
+
x: 0,
|
128
|
+
page: 0,
|
129
|
+
pageIndex: 0,
|
130
|
+
customEvents: [],
|
131
|
+
|
132
|
+
onFlip: function (fn) {
|
133
|
+
this.wrapper.addEventListener('swipeview-flip', fn, false);
|
134
|
+
this.customEvents.push(['flip', fn]);
|
135
|
+
},
|
136
|
+
|
137
|
+
onMoveOut: function (fn) {
|
138
|
+
this.wrapper.addEventListener('swipeview-moveout', fn, false);
|
139
|
+
this.customEvents.push(['moveout', fn]);
|
140
|
+
},
|
141
|
+
|
142
|
+
onMoveIn: function (fn) {
|
143
|
+
this.wrapper.addEventListener('swipeview-movein', fn, false);
|
144
|
+
this.customEvents.push(['movein', fn]);
|
145
|
+
},
|
146
|
+
|
147
|
+
onTouchStart: function (fn) {
|
148
|
+
this.wrapper.addEventListener('swipeview-touchstart', fn, false);
|
149
|
+
this.customEvents.push(['touchstart', fn]);
|
150
|
+
},
|
151
|
+
|
152
|
+
destroy: function () {
|
153
|
+
while ( this.customEvents.length ) {
|
154
|
+
this.wrapper.removeEventListener('swipeview-' + this.customEvents[0][0], this.customEvents[0][1], false);
|
155
|
+
this.customEvents.shift();
|
156
|
+
}
|
157
|
+
|
158
|
+
// Remove the event listeners
|
159
|
+
window.removeEventListener(resizeEvent, this, false);
|
160
|
+
this.wrapper.removeEventListener(startEvent, this, false);
|
161
|
+
this.wrapper.removeEventListener(moveEvent, this, false);
|
162
|
+
this.wrapper.removeEventListener(endEvent, this, false);
|
163
|
+
this.slider.removeEventListener(transitionEndEvent, this, false);
|
164
|
+
|
165
|
+
/* if (!hasTouch) {
|
166
|
+
this.wrapper.removeEventListener('mouseout', this, false);
|
167
|
+
}*/
|
168
|
+
},
|
169
|
+
|
170
|
+
refreshSize: function () {
|
171
|
+
this.wrapperWidth = this.wrapper.clientWidth;
|
172
|
+
this.wrapperHeight = this.wrapper.clientHeight;
|
173
|
+
this.pageWidth = this.wrapperWidth;
|
174
|
+
this.maxX = -this.options.numberOfPages * this.pageWidth + this.wrapperWidth;
|
175
|
+
this.snapThreshold = this.options.snapThreshold === null ?
|
176
|
+
Math.round(this.pageWidth * 0.15) :
|
177
|
+
/%/.test(this.options.snapThreshold) ?
|
178
|
+
Math.round(this.pageWidth * this.options.snapThreshold.replace('%', '') / 100) :
|
179
|
+
this.options.snapThreshold;
|
180
|
+
},
|
181
|
+
|
182
|
+
updatePageCount: function (n) {
|
183
|
+
this.options.numberOfPages = n;
|
184
|
+
this.maxX = -this.options.numberOfPages * this.pageWidth + this.wrapperWidth;
|
185
|
+
},
|
186
|
+
|
187
|
+
goToPage: function (p) {
|
188
|
+
var i;
|
189
|
+
|
190
|
+
this.masterPages[this.currentMasterPage].className = this.masterPages[this.currentMasterPage].className.replace(/(^|\s)swipeview-active(\s|$)/, '');
|
191
|
+
for (i=0; i<3; i++) {
|
192
|
+
className = this.masterPages[i].className;
|
193
|
+
/(^|\s)swipeview-loading(\s|$)/.test(className) || (this.masterPages[i].className = !className ? 'swipeview-loading' : className + ' swipeview-loading');
|
194
|
+
}
|
195
|
+
|
196
|
+
p = p < 0 ? 0 : p > this.options.numberOfPages-1 ? this.options.numberOfPages-1 : p;
|
197
|
+
this.page = p;
|
198
|
+
this.pageIndex = p;
|
199
|
+
this.slider.style[transitionDuration] = '0s';
|
200
|
+
this.__pos(-p * this.pageWidth);
|
201
|
+
|
202
|
+
this.currentMasterPage = (this.page + 1) - Math.floor((this.page + 1) / 3) * 3;
|
203
|
+
|
204
|
+
this.masterPages[this.currentMasterPage].className = this.masterPages[this.currentMasterPage].className + ' swipeview-active';
|
205
|
+
|
206
|
+
if (this.currentMasterPage === 0) {
|
207
|
+
this.masterPages[2].style.left = window.innerWidth * (this.page - 1) + 'px';
|
208
|
+
this.masterPages[0].style.left = window.innerWidth * (this.page ) + 'px';
|
209
|
+
this.masterPages[1].style.left = window.innerWidth * (this.page + 1) + 'px';
|
210
|
+
|
211
|
+
this.masterPages[2].dataset.upcomingPageIndex = this.page === 0 ? this.options.numberOfPages-1 : this.page - 1;
|
212
|
+
this.masterPages[0].dataset.upcomingPageIndex = this.page;
|
213
|
+
this.masterPages[1].dataset.upcomingPageIndex = this.page == this.options.numberOfPages-1 ? 0 : this.page + 1;
|
214
|
+
} else if (this.currentMasterPage == 1) {
|
215
|
+
this.masterPages[0].style.left = window.innerWidth * (this.page - 1) + 'px';
|
216
|
+
this.masterPages[1].style.left = window.innerWidth * (this.page ) + 'px';
|
217
|
+
this.masterPages[2].style.left = window.innerWidth * (this.page + 1) + 'px';
|
218
|
+
|
219
|
+
this.masterPages[0].dataset.upcomingPageIndex = this.page === 0 ? this.options.numberOfPages-1 : this.page - 1;
|
220
|
+
this.masterPages[1].dataset.upcomingPageIndex = this.page;
|
221
|
+
this.masterPages[2].dataset.upcomingPageIndex = this.page == this.options.numberOfPages-1 ? 0 : this.page + 1;
|
222
|
+
} else {
|
223
|
+
this.masterPages[1].style.left = window.innerWidth * (this.page - 1) + 'px';
|
224
|
+
this.masterPages[2].style.left = window.innerWidth * (this.page ) + 'px';
|
225
|
+
this.masterPages[0].style.left = window.innerWidth * (this.page + 1) + 'px';
|
226
|
+
|
227
|
+
this.masterPages[1].dataset.upcomingPageIndex = this.page === 0 ? this.options.numberOfPages-1 : this.page - 1;
|
228
|
+
this.masterPages[2].dataset.upcomingPageIndex = this.page;
|
229
|
+
this.masterPages[0].dataset.upcomingPageIndex = this.page == this.options.numberOfPages-1 ? 0 : this.page + 1;
|
230
|
+
}
|
231
|
+
|
232
|
+
this.__flip();
|
233
|
+
},
|
234
|
+
|
235
|
+
next: function () {
|
236
|
+
if (!this.options.loop && this.x == this.maxX) return;
|
237
|
+
|
238
|
+
this.directionX = -1;
|
239
|
+
this.x -= 1;
|
240
|
+
this.__checkPosition();
|
241
|
+
},
|
242
|
+
|
243
|
+
prev: function () {
|
244
|
+
if (!this.options.loop && this.x === 0) return;
|
245
|
+
|
246
|
+
this.directionX = 1;
|
247
|
+
this.x += 1;
|
248
|
+
this.__checkPosition();
|
249
|
+
},
|
250
|
+
|
251
|
+
handleEvent: function (e) {
|
252
|
+
switch (e.type) {
|
253
|
+
case startEvent:
|
254
|
+
this.__start(e);
|
255
|
+
break;
|
256
|
+
case moveEvent:
|
257
|
+
this.__move(e);
|
258
|
+
break;
|
259
|
+
case cancelEvent:
|
260
|
+
case endEvent:
|
261
|
+
this.__end(e);
|
262
|
+
break;
|
263
|
+
case resizeEvent:
|
264
|
+
this.__resize();
|
265
|
+
break;
|
266
|
+
case transitionEndEvent:
|
267
|
+
case 'otransitionend':
|
268
|
+
if (e.target == this.slider && !this.options.hastyPageFlip) this.__flip();
|
269
|
+
break;
|
270
|
+
}
|
271
|
+
},
|
272
|
+
|
273
|
+
|
274
|
+
/**
|
275
|
+
*
|
276
|
+
* Pseudo private methods
|
277
|
+
*
|
278
|
+
*/
|
279
|
+
__pos: function (x) {
|
280
|
+
this.x = x;
|
281
|
+
this.slider.style[transform] = 'translate(' + x + 'px,0)' + translateZ;
|
282
|
+
},
|
283
|
+
|
284
|
+
__resize: function () {
|
285
|
+
this.refreshSize();
|
286
|
+
this.slider.style[transitionDuration] = '0s';
|
287
|
+
this.__pos(-this.page * this.pageWidth);
|
288
|
+
},
|
289
|
+
|
290
|
+
__start: function (e) {
|
291
|
+
//e.preventDefault();
|
292
|
+
|
293
|
+
if (this.initiated) return;
|
294
|
+
|
295
|
+
var point = hasTouch ? e.touches[0] : e;
|
296
|
+
|
297
|
+
this.initiated = true;
|
298
|
+
this.moved = false;
|
299
|
+
this.thresholdExceeded = false;
|
300
|
+
this.startX = point.pageX;
|
301
|
+
this.startY = point.pageY;
|
302
|
+
this.pointX = point.pageX;
|
303
|
+
this.pointY = point.pageY;
|
304
|
+
this.stepsX = 0;
|
305
|
+
this.stepsY = 0;
|
306
|
+
this.directionX = 0;
|
307
|
+
this.directionLocked = false;
|
308
|
+
|
309
|
+
/* var matrix = getComputedStyle(this.slider, null).webkitTransform.replace(/[^0-9-.,]/g, '').split(',');
|
310
|
+
this.x = matrix[4] * 1;*/
|
311
|
+
|
312
|
+
this.slider.style[transitionDuration] = '0s';
|
313
|
+
|
314
|
+
this.__event('touchstart');
|
315
|
+
},
|
316
|
+
|
317
|
+
__move: function (e) {
|
318
|
+
if (!this.initiated) return;
|
319
|
+
|
320
|
+
var point = hasTouch ? e.touches[0] : e,
|
321
|
+
deltaX = point.pageX - this.pointX,
|
322
|
+
deltaY = point.pageY - this.pointY,
|
323
|
+
newX = this.x + deltaX,
|
324
|
+
dist = Math.abs(point.pageX - this.startX);
|
325
|
+
|
326
|
+
this.moved = true;
|
327
|
+
this.pointX = point.pageX;
|
328
|
+
this.pointY = point.pageY;
|
329
|
+
this.directionX = deltaX > 0 ? 1 : deltaX < 0 ? -1 : 0;
|
330
|
+
this.stepsX += Math.abs(deltaX);
|
331
|
+
this.stepsY += Math.abs(deltaY);
|
332
|
+
|
333
|
+
// We take a 10px buffer to figure out the direction of the swipe
|
334
|
+
if (this.stepsX < 10 && this.stepsY < 10) {
|
335
|
+
// e.preventDefault();
|
336
|
+
return;
|
337
|
+
}
|
338
|
+
|
339
|
+
// We are scrolling vertically, so skip SwipeView and give the control back to the browser
|
340
|
+
if (!this.directionLocked && this.stepsY > this.stepsX) {
|
341
|
+
this.initiated = false;
|
342
|
+
return;
|
343
|
+
}
|
344
|
+
|
345
|
+
e.preventDefault();
|
346
|
+
|
347
|
+
this.directionLocked = true;
|
348
|
+
|
349
|
+
if (!this.options.loop && (newX > 0 || newX < this.maxX)) {
|
350
|
+
newX = this.x + (deltaX / 2);
|
351
|
+
}
|
352
|
+
|
353
|
+
if (!this.thresholdExceeded && dist >= this.snapThreshold) {
|
354
|
+
this.thresholdExceeded = true;
|
355
|
+
this.__event('moveout');
|
356
|
+
} else if (this.thresholdExceeded && dist < this.snapThreshold) {
|
357
|
+
this.thresholdExceeded = false;
|
358
|
+
this.__event('movein');
|
359
|
+
}
|
360
|
+
|
361
|
+
/* if (newX > 0 || newX < this.maxX) {
|
362
|
+
newX = this.x + (deltaX / 2);
|
363
|
+
}*/
|
364
|
+
|
365
|
+
this.__pos(newX);
|
366
|
+
},
|
367
|
+
|
368
|
+
__end: function (e) {
|
369
|
+
if (!this.initiated) return;
|
370
|
+
|
371
|
+
var point = hasTouch ? e.changedTouches[0] : e,
|
372
|
+
dist = Math.abs(point.pageX - this.startX);
|
373
|
+
|
374
|
+
this.initiated = false;
|
375
|
+
|
376
|
+
if (!this.moved) return;
|
377
|
+
|
378
|
+
if (!this.options.loop && (this.x > 0 || this.x < this.maxX)) {
|
379
|
+
dist = 0;
|
380
|
+
this.__event('movein');
|
381
|
+
}
|
382
|
+
|
383
|
+
// Check if we exceeded the snap threshold
|
384
|
+
if (dist < this.snapThreshold) {
|
385
|
+
this.slider.style[transitionDuration] = Math.floor(300 * dist / this.snapThreshold) + 'ms';
|
386
|
+
this.__pos(-this.page * this.pageWidth);
|
387
|
+
return;
|
388
|
+
}
|
389
|
+
|
390
|
+
this.__checkPosition();
|
391
|
+
},
|
392
|
+
|
393
|
+
__checkPosition: function () {
|
394
|
+
var pageFlip,
|
395
|
+
pageFlipIndex,
|
396
|
+
className;
|
397
|
+
|
398
|
+
this.masterPages[this.currentMasterPage].className = this.masterPages[this.currentMasterPage].className.replace(/(^|\s)swipeview-active(\s|$)/, '');
|
399
|
+
|
400
|
+
// Flip the page
|
401
|
+
if (this.directionX > 0) {
|
402
|
+
this.page = -Math.ceil(this.x / this.pageWidth);
|
403
|
+
this.currentMasterPage = (this.page + 1) - Math.floor((this.page + 1) / 3) * 3;
|
404
|
+
this.pageIndex = this.pageIndex === 0 ? this.options.numberOfPages - 1 : this.pageIndex - 1;
|
405
|
+
|
406
|
+
pageFlip = this.currentMasterPage - 1;
|
407
|
+
pageFlip = pageFlip < 0 ? 2 : pageFlip;
|
408
|
+
this.masterPages[pageFlip].style.left = window.innerWidth * (this.page - 1) + 'px';
|
409
|
+
|
410
|
+
pageFlipIndex = this.page - 1;
|
411
|
+
} else {
|
412
|
+
this.page = -Math.floor(this.x / this.pageWidth);
|
413
|
+
this.currentMasterPage = (this.page + 1) - Math.floor((this.page + 1) / 3) * 3;
|
414
|
+
this.pageIndex = this.pageIndex == this.options.numberOfPages - 1 ? 0 : this.pageIndex + 1;
|
415
|
+
|
416
|
+
pageFlip = this.currentMasterPage + 1;
|
417
|
+
pageFlip = pageFlip > 2 ? 0 : pageFlip;
|
418
|
+
this.masterPages[pageFlip].style.left = window.innerWidth * (this.page + 1) + 'px';
|
419
|
+
|
420
|
+
pageFlipIndex = this.page + 1;
|
421
|
+
}
|
422
|
+
|
423
|
+
// Add active class to current page
|
424
|
+
className = this.masterPages[this.currentMasterPage].className;
|
425
|
+
/(^|\s)swipeview-active(\s|$)/.test(className) || (this.masterPages[this.currentMasterPage].className = !className ? 'swipeview-active' : className + ' swipeview-active');
|
426
|
+
|
427
|
+
// Add loading class to flipped page
|
428
|
+
className = this.masterPages[pageFlip].className;
|
429
|
+
/(^|\s)swipeview-loading(\s|$)/.test(className) || (this.masterPages[pageFlip].className = !className ? 'swipeview-loading' : className + ' swipeview-loading');
|
430
|
+
|
431
|
+
pageFlipIndex = pageFlipIndex - Math.floor(pageFlipIndex / this.options.numberOfPages) * this.options.numberOfPages;
|
432
|
+
this.masterPages[pageFlip].dataset.upcomingPageIndex = pageFlipIndex; // Index to be loaded in the newly flipped page
|
433
|
+
|
434
|
+
newX = -this.page * this.pageWidth;
|
435
|
+
|
436
|
+
this.slider.style[transitionDuration] = Math.floor(500 * Math.abs(this.x - newX) / this.pageWidth) + 'ms';
|
437
|
+
|
438
|
+
// causing bug if the loop is turned off, making the third page invisible when navigated by goToPage(2)
|
439
|
+
// Hide the next page if we decided to disable looping
|
440
|
+
// if (!this.options.loop) {
|
441
|
+
// this.masterPages[pageFlip].style.visibility = newX === 0 || newX == this.maxX ? 'hidden' : '';
|
442
|
+
// }
|
443
|
+
|
444
|
+
if (this.x == newX) {
|
445
|
+
this.__flip(); // If we swiped all the way long to the next page (extremely rare but still)
|
446
|
+
} else {
|
447
|
+
this.__pos(newX);
|
448
|
+
if (this.options.hastyPageFlip) this.__flip();
|
449
|
+
}
|
450
|
+
},
|
451
|
+
|
452
|
+
__flip: function () {
|
453
|
+
this.__event('flip');
|
454
|
+
|
455
|
+
for (var i=0; i<3; i++) {
|
456
|
+
this.masterPages[i].className = this.masterPages[i].className.replace(/(^|\s)swipeview-loading(\s|$)/, ''); // Remove the loading class
|
457
|
+
this.masterPages[i].dataset.pageIndex = this.masterPages[i].dataset.upcomingPageIndex;
|
458
|
+
}
|
459
|
+
},
|
460
|
+
|
461
|
+
__event: function (type) {
|
462
|
+
var ev = document.createEvent("Event");
|
463
|
+
|
464
|
+
ev.initEvent('swipeview-' + type, true, true);
|
465
|
+
|
466
|
+
this.wrapper.dispatchEvent(ev);
|
467
|
+
}
|
468
|
+
};
|
469
|
+
|
470
|
+
function prefixStyle (style) {
|
471
|
+
if ( vendor === '' ) return style;
|
472
|
+
|
473
|
+
style = style.charAt(0).toUpperCase() + style.substr(1);
|
474
|
+
return vendor + style;
|
475
|
+
}
|
476
|
+
|
477
|
+
return SwipeView;
|
478
|
+
})(window, document);
|