kamishibai 0.6.2

data/public/js/tablet3.js

@@ -0,0 +1,241 @@
+/*!
+License: refer to LICENSE file
+ */
+
+ // global variables
+var hasTouch = 'ontouchstart' in window; //find out if device is touch device or not
+
+// for saving cycle when typing keyword, delay search instead send immediately
+var timerKeywordChange = 0;
+
+
+
+// page init
+$(function(e) {
+	/*
+	 *  Browse section
+	 */
+
+	// load the text localization
+	reload_locale();
+
+	/*
+		**** NOTE ****
+		Seems like ios uses the noclick delay to detect div drag, so if this is enabled, the div navi would not work. need to come up alternative method.
+	*/
+	// disable onclick delay on ipad/ios, it has dodgy handing on click event
+	if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) {
+		//new NoClickDelay(document.body);
+	}
+
+	// set cookies
+	// load the book search query
+	var sb = $('#searchbox');
+	if ($.cookie(uport() + '.keyword') != undefined) {
+		sb.val( $.cookie(uport() + '.keyword') );
+	}
+
+
+	// re-select the remembered menu selection
+	var i = $.cookie(uport() + '.last_menu_selection_number') || 1;
+
+	// select menu selection
+	$('#bc' + i).button('toggle');
+
+	var bcs = $('#bcs');
+	if (i == 5) {
+		// author selected, load author
+
+		sb.val( bcs.attr('author') || $.cookie(uport() + '.author') || '' );
+	}
+	else {
+		// non author selected, load normal keyword
+
+		sb.val( bcs.attr('keyword') || $.cookie(uport() + '.keyword') || '' );
+	}
+
+
+	// swipe event for the browse page
+	$(window).bind('scroll', function() {
+		$('#scroll-pos').text(window.pageYOffset);
+	});
+	$('#books').bind('onscroll', function() {
+		$('#scroll-pos').text(window.pageYOffset);
+	});
+
+
+
+	// #searchbox event
+	$("#searchbox").on('change', function(e) {
+
+		// reload the list with keyword matches
+		prepare_lists();
+
+	}).on('keydown', function(e) {
+
+		// save cycles, stop the timer to send query when key is pressed
+		clearTimeout( timerKeywordChange );
+
+	}).on('keyup', function(e) {
+		e = e || window.event;
+
+		if (e.keyCode == 13) {
+			// enter key, unfocus the searchbox
+			$("#searchbox").blur();
+			return true;
+		}
+
+		// save cycles, only sent query when search is truly finished typing
+		timerKeywordChange = setTimeout( function() {
+			prepare_lists();
+
+		}, 1200);
+	});
+
+
+
+	// run if book choice is selected, load with delay for the button group DOM to catch up
+	$('.btn-group > button').on('click', function(e) {
+
+		var sb  = $('#searchbox');
+		var bcs = $('#bcs');
+		// get menu selection
+		var i   = $(this).attr('id').replace('bc', '');
+
+
+		if (i == 5) {
+			// author selected, load author
+
+			sb.val( bcs.attr('author') || $.cookie(uport() + '.author') || '' );
+		}
+		else {
+			// non author selected, load normal keyword
+
+			sb.val( bcs.attr('keyword') || $.cookie(uport() + '.keyword') || '' );
+		}
+
+		// remember last menu selection number
+		$.cookie(uport() + '.last_menu_selection_number', i, { path: '/' });
+
+
+		// change button high light
+		$('.btn-group > button').removeClass('active');
+		$(this).addClass('active');
+
+		// save cycles if search text isnt changed
+		// if ( sb.val() === $.cookie(uport() + '.keyword') || sb.val() === $.cookie(uport() + '.author') ) {
+		// 	return false;
+		// }
+
+		prepare_lists();
+	});
+
+
+	if (getHashParams().book) {
+		// load book if already specified in hash
+
+		var p = getHashParams().page || 1;
+
+		readBook( getHashParams().book, p );
+	}
+	else {
+		// reload leftbox
+		// prepare_lists( get_menu_url() );
+	}
+
+
+
+
+
+	/*
+	 *  Reader section
+	 */
+
+	// disable other other tuochmove events from propagating causing issuing
+	// document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
+
+
+	// action when home button is pushed
+	$('#closeReader').on('click', function(event, ui) {
+		closeReader();
+	});
+
+	// show/hide menu
+	if (hasTouch) {
+		$('#wrapper').on('click', function(e) {
+			e.stopPropagation();
+			togglemenu();
+		});
+	}
+	else {
+
+		// prevent swipe triggering menu when using mouse
+		$('#wrapper').on('mousedown', function(e) {
+			window.wrapperMouseLastPos = {
+				x: e.originalEvent.pageX,
+				y: e.originalEvent.pageY
+			};
+		});
+		$('#wrapper').on('mouseup', function(e) {
+			var x = e.originalEvent.pageX;
+			var y = e.originalEvent.pageY;
+
+			// moved, so no menu
+			if (Math.abs(window.wrapperMouseLastPos.x - x) > 10) return;
+			if (Math.abs(window.wrapperMouseLastPos.y - y) > 10) return;
+
+			togglemenu();
+		});
+	}
+	
+	// change page when slider is moved
+	$('#pageslider').on('change', function() {
+		goToPage( $(this).val() );
+
+	}).on('input', function() {
+		$('#pageinput').val( $(this).val() );
+
+	}).on('touchstart', function(e) {
+
+		// change page when slider is moved (touch)
+		var i = sliderValue(this, e);
+
+		$('#pageinput').val( i );
+		$(this).val(i);
+
+	}).on('touchmove', function(e) {
+		// console.log('slider move');
+		var i = sliderValue(this, e);
+		
+		$('#pageinput').val( i );
+		$(this).val(i);
+
+	}).on('touchend', function(e) {
+		// goToPage( $(this).val() );
+	});
+
+	// change read direction when button is touched
+	$('#readdirection').change(function(e) {
+		destroyGallery();
+		createGallery();
+		// force trigger hashchange on load
+		window.dispatchEvent(new HashChangeEvent('hashchange'));
+	});
+
+	updateBatteryLevel();
+	updateDivCurrentInfo();
+	window.setInterval( function() {
+		// update battery level
+		updateBatteryLevel();
+
+		// show clock
+		updateDivCurrentInfo();
+	}, 1000 * 60);
+
+
+	// load full screen button if device supports it
+	if (!(/iphone|ipod|ipad/gi).test(navigator.appVersion)) {
+		$('#div-fs-btn').removeClass('hidden');
+	};
+
+});

data/public/js/tablet3_browse.js

@@ -0,0 +1,173 @@
+/*!
+License: refer to LICENSE file
+ */
+
+
+// global search result list
+function reload_leftbox(url, keyword) {
+	// retrive data
+	$.post(url, { keyword: keyword }, function(data) {
+		var el = $('#leftbox');
+		el.empty();
+		el.append(data);
+
+		$('.li-title').on('click', function() {
+			// set the last title selected on cookie
+			$.cookie(uport() + '.lasttitle', $(this).text(), { path: '/' });
+
+			reload_books( $(this).attr('bookcodes'), $(this).attr('options') );
+		});
+
+		var elem = $('.li-title:contains("' + $.cookie(uport() + '.lasttitle') + '")');
+		if (elem.length > 0) {
+			// scroll to last selected title
+			$('#leftbox').scrollTo( elem.eq(0) );
+
+			// show books
+			var bookcodes = elem.eq(0).attr('bookcodes');
+			reload_books( bookcodes, elem.eq(0).attr('options') );
+		}
+		else {
+			// last selected title don't exist, select first available title
+			var el = $('.li-title');
+			if (el.length > 0) {
+				$('#leftbox').scrollTo( el.eq(0) );
+
+				var bookcodes = el.eq(0).attr('bookcodes');
+				reload_books( bookcodes, el.eq(0).attr('options') );
+			}
+			else {
+				reload_books();
+			}
+		}
+	});
+}
+
+
+
+// load books from the bookcodes
+function reload_books( bookcodes, options ) {
+	if (bookcodes === undefined) {
+		$('#bookinfo').empty();
+		$('#books').empty();
+		return false;
+	}
+
+	var bookcode = bookcodes.split(',')[0];
+
+	$.get('/listbooks', { bookcodes: bookcodes, options: options }, function(jData) {
+
+		// show book title and author
+		var el = $('#bookinfo');
+		el.empty();
+		el.attr('bookcodes', bookcodes); // remember requested bookcodes
+		for (var bookcode in jData) {
+			var book = jData[bookcode];
+
+			var title = $('<div>');
+			title.html(book.title);
+			el.append(title);
+
+			var author = $('<div>');
+			author.html(book.author);
+			author.on('click', function() {
+				exe_show_author(book.author);
+			});
+			el.append(author);
+			break;
+		}
+
+		// list books
+		var el = $('#books');
+		el.empty();
+		for (var bookcode in jData) {
+			var book = jData[bookcode];
+
+			var li = $('<li>');
+			li.addClass('book');
+
+			var a = $('<a>');
+			a.attr('href', '#book=' + bookcode + '&page=' + book.page || 1);
+			a.on('click', { bookcode: bookcode }, function(event) {
+				// console.log(event.data.bookcode);
+				readBook(event.data.bookcode);
+			});
+
+			var img = $('<img>');
+			img.attr('src', '/thumbnail/' + bookcode);
+			img.attr('alt', 'Loading...');
+			a.append(img);
+
+			var span = $('<span>');
+			span.html(book.sname);
+			// set page progress
+			var page  = book.page || 0;
+			var pages = book.pages;
+			var pc    = Math.round(page / pages * 100); // percentage read
+			var pc2   = pc === 0 ? 0 : pc + 1; // if never read, then make it all 0
+			span.css('background', 'linear-gradient(to right, rgba(51,204,102,1) ' + pc + '%,rgba(234,234,234,1) ' + pc2 + '%)');
+			a.append(span);
+
+			li.append(a);
+			el.append(li);
+		}
+	});
+
+}
+
+
+function exe_show_author( author ) {
+
+	var sb  = $('#searchbox');
+	var bcs = $('#bcs');
+
+	// save author and keyword
+	bcs.attr('keyword', sb.val());
+	bcs.attr('author',  author);
+
+	// change search to author
+	sb.val(author);
+
+	$('#bc5').trigger('click');
+}
+
+function prepare_lists(url) {
+
+	if (typeof url === 'undefined') url = get_menu_url();
+
+
+	var sb  = $('#searchbox');
+	var bcs = $('#bcs');
+	var i   = get_menu_selection_number();
+
+	// remember keyword
+	var keyword;
+	if (i === 5) {
+		keyword = sb.val();
+		bcs.attr('author', keyword);
+		$.cookie(uport() + '.author', keyword, { path: '/' });
+	}
+	else {
+		keyword = sb.val();
+		bcs.attr('keyword', keyword);
+		$.cookie(uport() + '.keyword', keyword, { path: '/' });
+	}
+
+	// reload leftbox
+	reload_leftbox(url, keyword);
+}
+
+function get_menu_selection_number() {
+	var id = $('#bcs > button.active').attr('id');
+
+	var n;
+	if (id) {
+		n = parseInt( id.replace('bc','') );
+	}
+
+	return n || 1;
+}
+
+function get_menu_url() {
+	return $('#bcs > button.active').attr('link');
+}

data/public/js/tablet3_reader.js

@@ -0,0 +1,534 @@
+/*!
+License: refer to LICENSE file
+ */
+
+
+// last time the toggleMenu is called
+var lastToggleMenu = (new Date()).getTime();
+
+// initialize book object
+var book;
+
+// set gallery global variable so it can be accessed outside
+var gallery;
+
+// set date
+var date = new Date();
+
+// set battery
+var battery_level = '-1';
+
+// how long it takes to trigger actions in ms
+var onFlipActionDelay = 1000;
+
+
+function readBook(bc, bp) {
+	console.log('readBook', arguments)
+	// bc, bookcode
+	// bp, bookpage
+
+	// destroy exiting gallery already exists
+	destroyGallery(false);
+
+	// set screen size so if the image is resized, server remember the screen size
+	setScreenSize();
+
+	$.get('/listbooks', { bookcodes: bc }, function(jData) {
+		$('#container').removeClass('hidden');
+
+		book = jData[bc];
+
+		book.bookcode = bc;
+		book.lastpage = bp || book.page || 1;
+
+		$('#booktitle').html('<div>' + book.title + '</div>');
+
+		// set #pageslider max
+		$('#pageslider').attr('max', book.pages);
+		$('#pageslider').val(book.lastpage);
+
+		// set location hash if not set or diff
+		var hstr = '#book=' + book.bookcode + '&page=' + book.lastpage;
+		if (window.location.hash !== hstr) window.location.hash = hstr;
+
+		// create gallery
+		createGallery(bp);
+
+		// force trigger hashchange to load correct page
+		// window.dispatchEvent(new HashChangeEvent('hashchange'));
+	});
+}
+
+
+function updateDivCurrentInfo(page) {
+
+	if (typeof page === 'number') {
+		$('#pageCounter').html( gallery.pageIndex + '/' + book.pages );
+	}
+	$('#clock').html( date.toTimeString().slice(0,5) );
+	$('#battery').html( '&#128267;' + battery_level);
+}
+
+function sliderValue(el, e) {
+	var el = $(el);
+	var min = Number(el.attr('min'));
+	var max = Number(el.attr('max'));
+	var t;
+	if (e.originalEvent.touches) {
+		t = e.originalEvent.touches[0];
+	}
+	// else { 
+	// 	t = e.originalEvent;
+	// }
+	var w = Number(el.width());
+	var x = w / max;
+	var l = el.position().left;
+
+	// approximate value on the slider position
+	var i = Math.ceil((t.pageX - l)/x );
+
+	if (i < min) {
+		i = min;
+	}
+	else if (i > max) {
+		i = max;
+	}
+
+	return i;
+}
+
+
+// destroy and remove the gallery
+function destroyGallery(resetHash) {
+	if (gallery) gallery.destroy;
+	$('#wrapper').empty();
+
+	// remove listener
+	$(window).unbind('hashchange');
+	$(window).unbind('keydown');
+
+	if (resetHash === false) return;
+
+	// clear hash
+	window.location.hash = '';
+}
+
+// create the gallery
+function createGallery(goPage) {
+	//document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
+
+	// initialize gallery
+	var el,
+		i,
+		page;
+		//dots = document.querySelectorAll('.thumbnails ul li');
+
+	// initialize pages
+	var slides = [];
+	for (i=1; i<=book.pages; i++) {
+
+		if (isEasternBook()) {
+			// eastern book
+			slides.push( {
+				img: "/cbz/" + book.bookcode + "/" + (book.pages - i + 1),
+				page: book.pages - i + 1
+			} );
+		}
+		else {
+			// western book
+			slides.push( {
+				img: "/cbz/" + book.bookcode + "/" + i,
+				page: i
+			} );
+		}
+	}
+
+	gallery = new SwipeView('#wrapper', { numberOfPages: slides.length, loop: false, zoom: true });
+
+	// Load initial data
+	for (i=0; i<3; i++) {
+		page = i==0 ? slides.length-1 : i-1;
+
+		el = document.createElement('div');
+		el.id = 'swipeview-div-' + i;
+		el.className = 'loading';
+		// el.innerHTML = i + 1;
+		gallery.masterPages[i].appendChild(el);
+
+		el = document.createElement('img');
+		el.id = 'swipeview-img-' + i;
+		el.className = 'loading';
+		el.removeAttribute('src');
+		// el.src = '';
+		// el.src = slides[page].img;
+		el.onload = function () {
+			this.className = '';
+			this.previousSibling.className = '';
+		}
+		gallery.masterPages[i].appendChild(el);
+	}
+	// stagger loading image to reduce load
+	staggerImages(goPage);
+
+	gallery.onFlip(function () {
+		console.log('flip event!');
+		// global
+		if (!window.timerOnFlipSlide) window.window.timerOnFlipSlide = {};
+
+		var el,
+			upcoming,
+			i;
+
+		for (i=0; i<3; i++) {
+			upcoming = gallery.masterPages[i].dataset.upcomingPageIndex;
+
+			if (upcoming != gallery.masterPages[i].dataset.pageIndex) {
+				el = gallery.masterPages[i].querySelector('div');
+				el.className = 'loading';
+				el.innerHTML = slides[upcoming].page;
+
+				el = gallery.masterPages[i].querySelector('img');
+				el.className = 'loading';
+
+				// called by staggerImages
+				if (window.stopOnFlipImg) {
+					el.removeAttribute('src');
+				}
+				// normal flip
+				else {
+					// if (window.timerOnFlipSlide[i]) {
+					// 	console.log('stop load image!', i)
+					// 	clearTimeout(window.timerOnFlipSlide[i]);
+					// 	window.timerOnFlipSlide[i] = false;
+					// }
+
+					// window.timerOnFlipSlide[i] = setTimeout(function() {
+					// 	console.log('load image!', this.src)
+					// 	this.el.src = this.src;
+					// }.bind({
+					// 	el: el,
+					// 	src: slides[upcoming].img
+					// }), onFlipActionDelay);
+
+					el.src = slides[upcoming].img;
+				}
+			}
+			// else {
+			// 	if (window.timerOnFlipSlide[i]) {
+			// 		console.log('stop load image!!!', i)
+			// 		clearTimeout(window.timerOnFlipSlide[i]);
+			// 		window.timerOnFlipSlide[i] = false;
+			// 	}
+			// }
+		}
+		// reset
+		window.stopOnFlipImg = false;
+
+		// get current page
+		var pg = gallery.pageIndex;
+		if (isEasternBook()) {
+			pg = book.pages - gallery.pageIndex;
+		}
+
+		// update div current info
+		updateDivCurrentInfo(pg);
+
+		// change title according to page
+		document.title = "(" + pg + "/" + book.pages + ")";
+
+		// set the page hash
+		window.noHashchange = true; // make sure no hashchange is triggered
+		window.location.hash = fullhash(pg);
+
+		// set bookmark only if stopped at page
+		if (window.timerOnFlipSlide.bookmark) {
+			clearTimeout(window.timerOnFlipSlide.bookmark);
+			window.timerOnFlipSlide.bookmark = false;
+		}
+		window.timerOnFlipSlide.bookmark = setTimeout(function() {
+			setBookmark(this.bookcode, this.pg);
+		}.bind({
+			bookcode: book.bookcode,
+			pg: pg
+		}), onFlipActionDelay);
+
+		// set the slider displayed page
+		$('#pageinput').val(pg);
+		$('#pageslider').val(pg);
+	});
+
+	gallery.onMoveOut(function () {
+		console.log('moveout');
+		gallery.masterPages[gallery.currentMasterPage].className = gallery.masterPages[gallery.currentMasterPage].className.replace(/(^|\s)swipeview-active(\s|$)/, '');
+
+		// get current page
+		var pg = gallery.pageIndex;
+		if (isEasternBook()) {
+			pg = book.pages - gallery.pageIndex;
+		}
+
+		var el = gallery.masterPages[gallery.currentMasterPage].querySelector('div');
+		el.innerHTML = pg;
+		el.className += 'loading';
+
+		// update current info
+		updateDivCurrentInfo(pg);
+	});
+
+	gallery.onMoveIn(function () {
+		console.log('movein');
+		var className = gallery.masterPages[gallery.currentMasterPage].className;
+		/(^|\s)swipeview-active(\s|$)/.test(className) || (gallery.masterPages[gallery.currentMasterPage].className = !className ? 'swipeview-active' : className + ' swipeview-active');
+	});
+	// end of gallery code
+
+	// go to page if specified
+	if (goPage) {
+		// launch a moment later, to go around loading issue
+		window.setTimeout( function(e) { goToPage(goPage); }, 300);
+	}
+
+	// now add listener
+
+	// hash change
+	$(window).bind('hashchange', function() {
+		// do no trigger, because of onFlip
+		if (window.noHashchange) {
+			// reset
+			window.noHashchange = false;
+			return;
+		}
+
+		// replace the history
+		if (getpage() < 1) {
+			window.location.replace( '#' + fullhash( 1 ) );
+		}
+		else if (getpage() > book.pages) {
+			window.location.replace( '#' + fullhash( book.pages ) );
+		}
+
+		// launch a moment later, to go around loading issue
+		window.setTimeout( function(e) { goToPage(getpage()); }, 50);
+	});
+
+	// // keyboard commands
+	$(window).bind('keydown', function h_kd(e) {
+		e = e || window.event;
+
+		switch (e.keyCode) {
+			case 37:
+				// left button, previous page
+				goToPage( getpage() - 1 );
+				break;
+			case 39:
+				// right button, next page
+				goToPage( getpage() + 1 );
+				break;
+			case 27:
+				// escape button, go back to browse
+				closeReader();
+				return false;
+				break;
+			case 13:
+				// enter key, show/hide menu
+				togglemenu();
+				break;
+		}
+	});
+}
+
+// set the bookmark
+function setBookmark(bookcode, page) {
+	var page = getpage();
+
+	if (book.lastpage == page || page < 1 || page > book.pages) return false;
+
+	$.ajax({
+		url: "/setbookmark/" + bookcode + "/" + page,
+		beforeSend: function ( xhr ) {
+		xhr.overrideMimeType("text/plain; charset=x-user-defined");
+	}
+	}).done(function ( data ) {
+		if( 1==2 && console && console.log ) {
+			console.log("Sample of data:", data);
+		}
+	});
+
+	// update last rendered page
+	book.lastpage = page;
+}
+
+
+function closeReader() {
+	$('#container').addClass('hidden');
+
+	destroyGallery();
+
+	reload_books( $('#bookinfo').attr('bookcodes') );
+}
+
+function isEasternBook() {
+	return ( $('#readdirection :radio:checked').attr('id') == 'readtoleft' ) ? true : false;
+}
+
+// go to particular page
+// in relative to book
+// not relative to gallery, which u can find out by page - 1
+function goToPage(page) {
+	page = Number(page);
+	console.log('going to page', page);
+	if (page < 1) return false;
+
+	if (isEasternBook()) {
+		gallery.goToPage(book.pages - page);
+	}
+	else {
+		gallery.goToPage(page - 1);
+	}
+
+	staggerImages(page);
+}
+
+function staggerImages(page) {
+	var i;
+	if (isEasternBook()) {
+		i = book.pages - page;
+	}
+	else {
+		i = page - 1;
+	}
+
+	// global
+	window.stopOnFlipImg = true;
+	window.imageQueue = [
+		// current page
+		{
+			igal: '[data-page-index=' + i + ']',
+			url: "/cbz/" + book.bookcode + "/" + page
+		},
+		// next page
+		{
+			igal: '[data-page-index=' + (i+1) + ']',
+			url: "/cbz/" + book.bookcode + "/" + (page + 1)
+		},
+		// prev page
+		{
+			igal: '[data-page-index=' + (i-1) + ']',
+			url: "/cbz/" + book.bookcode + "/" + (page - 1)
+		},
+	];
+
+	// do first image
+	loadImage();
+}
+
+function loadImage() {
+	var dat = window.imageQueue.shift();
+	
+	// double trigger, stop
+	if (window.currentImage && window.currentImage.url === dat.url) return;
+
+	window.currentImage = dat;
+
+	var img = el = $('<img>');
+	img.on('load', function() {
+		console.log('loaded image in background', this.dat)
+
+		// change img src
+		var el = $(this.dat.igal);
+		el.find('img').attr('src', this.dat.url).removeClass('loading');
+		el.find('div').removeClass('loading');
+		el.css('visibility','visible');
+
+		// do more if exists
+		if (window.imageQueue && window.imageQueue.length > 0) {
+			loadImage();
+		}
+		// all done, clear
+		else {
+			window.currentImage = false;
+		}
+	}.bind({
+		dat: dat
+	}));
+	// exec
+	console.log('starting image', dat)
+	img.attr('src', dat.url);
+}
+
+// get the page from hash
+function getpage() {
+	var i = parseInt( getHashParams()['page'] );
+	if (typeof i == "number" && ! isNaN(i) ) {
+		return i;
+	}
+
+	return -1;
+}
+
+// toggle menu
+function togglemenu() {
+	if ($('#readermenu').hasClass('showtop')) {
+		hidemenu();
+	}
+	else {
+		showmenu();
+	}
+
+	var t = new Date();
+	lastToggleMenu = t.getTime();
+}
+
+// show menu
+function showmenu() {
+	// show the menu
+	$('#booktitle').addClass('showtop');
+	$('#readermenu').addClass('showtop');
+}
+
+function hidemenu() {
+	// set header & footer hidden
+	$('#booktitle').removeClass('showtop');
+	$('#readermenu').removeClass('showtop');
+}
+
+// show/hide menu when touch the page
+function hasMoved(b,e) {
+	// move threshold
+	var mt = 5;
+
+	// shortcut for getting object
+	//var b = begin.originalEvent.changedTouches[0];
+	//var e = end.originalEvent.changedTouches[0];
+
+	// **hack**
+	// changed to array form because iOS+jQuery dont handle originalEvent and changedTouches correctly
+	// it doesn't store the last_touchstart correctly (it holds current one instead, so touchstart and touchend always ended up same value)
+	if (Math.abs(b[0] - e[0]) > mt || Math.abs(b[1] - e[1]) > mt) {
+		//console.log('moved');
+		return true;
+	}
+	else {
+		//console.log('not moved');
+		return false;
+	}
+}
+
+function toggleFullScreen(id) {
+	var elem = document.getElementById(id);
+	var btn = $('#gofullscreen'); // button for toggle full screen
+
+	if (isFullScreen()) {
+		btn.text('full screen');
+
+		exitFullScreen();
+	}
+	else {
+		btn.text('exit full screen');
+
+		goFullScreen(id);
+	}
+
+	// refresh button text
+	btn.button('refresh');
+}