function fullscreenIt(id){
var elem = jQuery('#'+id).parent()[0];
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
}
}
function loadPage(page,adj) {
jQuery.ajax({url: "/component/html5flippingbook/?publication=95&task=publication.loadSpecPage&number="+ (page-(adj-1))}).
done(function(pageHtml) {
jQuery('.flipbook .p' + page).html(pageHtml);
});
}
var flipbook = jQuery('.flipbook');
(function ($) {
function zoomIn(book){
$('.tbicon.zoom-out').show();
book.turn('zoom',2);
$(book).css({"font-size": 0.016*Math.pow($(book).turn('size').width,1.0145) + "px"});
//book.turn('disable', true);
/* add mouse move scroll */
// http://stackoverflow.com/questions/6518600/scroll-window-when-mouse-moves
// http://stackoverflow.com/questions/27924066/scroll-div-content-on-mouse-move
}
function zoomOut(book){
$('.tbicon.zoom-out').hide();
book.turn('zoom',1);
$(book).css({"font-size": 0.016*Math.pow($(book).turn('size').width,1.0145) + "px"});
//book.turn('disable', false);
}
function zoomHandle(book) {
if(book.turn('zoom')!=1){
zoomOut(book);
}else{
zoomIn(book);
}
}
var onfullscreenchange = function(e){
var fullscreenElement =
document.fullscreenElement ||
document.mozFullscreenElement ||
document.webkitFullscreenElement;
return fullscreenElement;
};
'use strict';
var module = {
ratio: 1.6,
init: function (id) {
var me = this;
// if older browser then don't run javascript
if (document.addEventListener) {
this.el = document.getElementById(id);
this.resize();
this.plugins();
$(me.el).css({"font-size": 0.016*Math.pow($(me.el).turn('size').width,1.0145) + "px"});
// on window resize, update the plugin size
window.addEventListener('resize', function (e) {
var size = me.resize();
zoomOut($(me.el));
$(me.el).turn('size',size.width,size.height);
$(me.el).css({"font-size": 0.016*Math.pow(size.width,1.0145) + "px"});
});
}
$(me.el).find('img').each(function(index){
var src = $(this).attr('src');
$('body').append("
");
});
},
resize: function () {
// reset the width and height to the css defaults
this.el.style.width = '';
this.el.style.height = '';
var width = this.el.clientWidth,
height = Math.round(width / this.ratio),
padded = Math.round(document.documentElement.clientHeight * 0.9),
screenHeight = Math.round(document.documentElement.clientHeight),
fullscreen = onfullscreenchange(this.el);
// if the height is too big for the window, constrain it
if (height > padded) {
height = padded;
width = Math.round(height * this.ratio);
}
if (fullscreen) {
if (height > screenHeight) {
height = screenHeight * 0.9;
width = Math.round(height * this.ratio);
}
}
// set the width and height matching the aspect ratio
this.el.style.width = width + 'px';
/*
if($('.html-content').length){
// hard calculation (html pages is in)
// recalculate height
height = parseInt($(this.el).css('min-height'),10);
$('.html-content').each(function(i){
var el_h = parseInt($(this).height(),10)+parseInt($(this).css('padding-top'),10)+parseInt($(this).css('padding-bottom').replace('px',''),10);
if(el_h > height) height = el_h;
});
if(width/height > this.ratio){
height = Math.round(width / this.ratio);
}
}
*/
this.el.style.height = height + 'px';
return {
width: width,
height: height
};
},
plugins: function () {
var me = this;
var slider = flipbook.parent().next().find('.turnjs-slider #slider');
var thumb_file = '/media/com_html5flippingbook//thumbs/preview_95.gif';
// URIs
Hash.on('^page\/([0-9]*)$', {
yep: function(path, parts) {
var page = parts[1];
if (page!==undefined) {
if (flipbook.turn('is'))
flipbook.turn('page', page);
}
},
nop: function(path) {
if (flipbook.turn('is'))
flipbook.turn('page', 1);
}
});
// Arrows
$(document).keydown(function(e){
var previous = 37, next = 39;
switch (e.keyCode) {
case previous:
flipbook.turn('previous');
break;
case next:
flipbook.turn('next');
break;
}
});
flipbook.find(".next-button,.previous-button").on('click',function(e){
switch ($(this).attr('class')) {
case 'previous-button':
flipbook.turn('previous');
break;
case 'next-button':
flipbook.turn('next');
break;
}
});
// Slider
slider.slider({
min: 1,
max: 100,
start: function(event, ui) {
if (!window._thumbPreview) {
_thumbPreview = $('
', {'class': 'thumbnail'}).html('
');
setPreview(ui.value, thumb_file);
_thumbPreview.appendTo($(ui.handle));
} else
setPreview(ui.value, thumb_file);
moveBar(false);
},
slide: function(event, ui) {
setPreview(ui.value, thumb_file);
},
stop: function() {
console.log(_thumbPreview);
if (window._thumbPreview)
_thumbPreview.removeClass('show');
flipbook.turn('page', Math.max(1, $(this).slider('value')*2 - 2));
}
});
// Flipbook
/* choose other events!!! */
//flipbook.bind(($.isTouch) ? 'doubletap' : 'dblclick', function(e){zoomHandle(flipbook);});
$('.tbicon.zoom-out').on('click',function(e){
zoomOut(flipbook);
return false;
});
$('.fa-search-plus').on('click',function(e){
zoomIn(flipbook);
return false;
});
$('.fa-list').on('click',function(e){
flipbook.turn('page',$(this).attr('rel'));
return false;
});
$('#goto_page_input_button').on('click',function(e){
var input = $(this).parent().find('#goto_page_input');
var val = parseInt(input.val(),10) + 0;
flipbook.turn('page', val);
input.val('').prop('placeholder',(val-0)+' page is opened');
return false;
});
flipbook.find('.double').scissor();
flipbook.turn({
elevation: 50,
acceleration: !isChrome(),
autoCenter: true,
gradients: true,
duration: 1000,
pages: 52,
when: {
turning: function(e, page, view) {
var book = $(this),
currentPage = book.turn('page'),
pages = book.turn('pages');
/*
if (currentPage>3 && currentPage
3 && page1){
book.find('.p2').addClass('fixed');
book.find('.next-button').show();
}else{
updateDepth(book, 0);
book.find('.p2').removeClass('fixed');
}
if (page!=pages){
book.find('.p'+(pages-1)).addClass('fixed');
book.find('.previous-button').show();
}else{
updateDepth(book, pages);
book.find('.p'+(pages-1)).removeClass('fixed');
}
Hash.go('page/'+page).update();
},
turned: function(e, page, view) {
var book = $(this);
/* for what? */
/*
if($('.html-content').length){
var size = me.resize();
zoomOut(flipbook);
flipbook.turn('size',size.width,size.height);
}
*/
book.turn('center');
},
zooming: function(e, newFactor, current) {
if(newFactor!=1){
$('.flip-hide-overflow').css('overflow','scroll');
}else{
$('.flip-hide-overflow').css('overflow','');
}
},
start: function(e, pageObj) {
moveBar(true);
},
end: function(e, pageObj) {
var book = $(this);
setTimeout(function() {
slider.slider('value', getViewNumber(book));
}, 1);
moveBar(false);
},
last: function(e) {
var book = $(this);
book.find('.next-button').hide();
book.find('.previous-button').show();
zoomOut(book);
},
first: function(e) {
var book = $(this);
book.find('.previous-button').hide();
book.find('.next-button').show();
zoomOut(book);
},
missing: function (e, pages) {
for (var i = 0; i < pages.length; i++) {
addPage(pages[i], $(this),2);
}
}
}
});
flipbook.turn("peel", "tr");
updateDepth(flipbook, flipbook.turn('page'));
slider.slider('option', 'max', numberOfViews(flipbook));
flipbook.addClass('animated')
flipbook.closest('.flipbook-viewport').animate({"opacity": "1"}, 800);
}
};
function loadApp() {
// Check if the CSS was already loaded
module.init('flipbook');
if (flipbook.width()==0 || flipbook.height()==0) {
setTimeout(loadApp, 10);
return;
}
}
// Load the HTML4 version if there's not CSS transform
yepnope({
test : Modernizr.csstransforms,
yep: ['/components/com_html5flippingbook/assets/lib/turn.min.js'],
nope: ['/components/com_html5flippingbook/assets/lib/turn.html4.min.js', '/components/com_html5flippingbook/assets/css/jquery.ui.html4.css'],
both: ['/components/com_html5flippingbook/assets/js/cust.js', '/components/com_html5flippingbook/assets/lib/scissor.min.js', '/components/com_html5flippingbook/assets/css/jquery.ui.css', '/components/com_html5flippingbook/assets/css/double-page.css'],
complete: loadApp
});
}(jQuery));