diff --git a/lib/flippy.js b/lib/flippy.js index 3a8e8b6..135ff46 100644 --- a/lib/flippy.js +++ b/lib/flippy.js @@ -1,7 +1,7 @@ // Copyright Notice: All rights reserved. © 2016 - 2017 Marvin Danig // FLIPPY VERSION::0.0.1' -import viewer from '../modules/mode.js' +import currentViewer from '../modules/mode.js' import '../modules/graph.js' // import events from '../modules/events.js' @@ -12,13 +12,17 @@ import '../modules/graph.js' class Book { constructor() { - this.mode = viewer.getMatch('(orientation: landscape)') ? 'landscape' : 'portrait' + this.mode = currentViewer.getMatch('(orientation: landscape)') ? 'landscape' : 'portrait' } getLength() { return _book.pages.length } + view() { + return _book.currentView + } + flip(page_no) { _book.currentPage = page_no console.log(_book.currentPage) @@ -49,20 +53,24 @@ import '../modules/graph.js' _removeChildren(node) - console.log('STARTPAGE', settings.start_page) - _book.currentPage = (settings.start_page === undefined) ? 1 : parseInt(settings.start_page) > 0 ? parseInt(settings.start_page) % parseInt(_book.pages.length) : (parseInt(settings.start_page) % parseInt(_book.pages.length) !== 0) ? parseInt(_book.pages.length) + 1 + parseInt(settings.start_page) % parseInt(_book.pages.length) : 1 - _setViewAndRange(_book.currentPage) + _setView(_book.currentPage) + + _setRange(_book.currentPage) - _printBook() + // _printBook() return } - viewer.onChange('(orientation: landscape)', match => { + currentViewer.onChange('(orientation: landscape)', match => { _book.mode = match ? 'landscape' : 'portrait' - // _applyMode(_book.node) + + // _setViewAndRange(_book.currentPage) + + // _printBook() + // _applyMode(_book.node) }) @@ -94,7 +102,24 @@ import '../modules/graph.js' return newWrapper } - function _setViewAndRange(currentPage = 1) { + function _setView(currentPage = 1) { + switch (_book.mode) { + case 'portrait': + _book.currentView = [parseInt(currentPage)] + break + + case 'landscape': + if (isEven(parseInt(currentPage))) { _book.currentView = [parseInt(currentPage), parseInt(currentPage + 1)] } + if (isOdd(parseInt(currentPage))) { _book.currentView = [parseInt(currentPage - 1), parseInt(currentPage)] } + break + } + + return + + } + + + function _setRange(currentPage = 1) { /*** @range = _book.pages.slice(P , Q) where: @@ -102,27 +127,13 @@ import '../modules/graph.js' P & Q may or may not lie in the range 0 < VALUES < 2N (_book.length) ***/ - switch (_book.mode) { case 'portrait': - _book.view = [parseInt(currentPage)] - - // _book.range = _book.pages.slice(parseInt(_book.view[0]) - 3, parseInt(_book.view[0]) + 3) - - let p = 'a' - let q = 'b' - - console.log('P, Q= ' + p + ' , ' + q) - - // _book.range = _book.pages.slice(parseInt(p, q)) - + _book.range = _book.pages.slice(parseInt(_book.currentView[0]) - 3, parseInt(_book.currentView[0]) + 3) break case 'landscape': - if (isEven(parseInt(currentPage))) { _book.view = [parseInt(currentPage), parseInt(currentPage + 1)] } - if (isOdd(parseInt(currentPage))) { _book.view = [parseInt(currentPage - 1), parseInt(currentPage)] } - - _book.range = _book.pages.slice(parseInt(_book.view[0]) - 3, parseInt(_book.view[1]) + 2) + _book.range = _book.pages.slice(parseInt(_book.currentView[0]) - 3, parseInt(_book.currentView[1]) + 2) break } @@ -143,13 +154,13 @@ import '../modules/graph.js' // _printView(_book.node) - console.log('CURRENT PAGE', _book.currentPage) + // console.log('CURRENT PAGE', _book.currentPage) - console.log('VIEW', _book.view) + // console.log('VIEW', _book.currentView) - console.log('RANGE', _book.range) + // console.log('RANGE', _book.range) - console.log('BOOK', _book.pages) + // console.log('BOOK', _book.pages) return } diff --git a/lib/script.js b/lib/script.js index 31d5ad1..e491a80 100644 --- a/lib/script.js +++ b/lib/script.js @@ -6,72 +6,76 @@ import '../lib/flippy.js' -// document.addEventListener('DOMContentLoaded', function(event) { +document.addEventListener('DOMContentLoaded', function(event) { -/**********************************/ -/****** Initialize Flippy ********/ -/**********************************/ + /**********************************/ + /****** Initialize Flippy ********/ + /**********************************/ -let settings = { duration: 100, animation: true, curl: true, peel: true, zoom: false, start_page: -1 } + let settings = { duration: 100, animation: true, curl: true, peel: true, zoom: false, start_page: 5 } -let node = document.getElementById('book') + let node = document.getElementById('book') -const superbook = Flippy.init(node, settings) + const superbook = Flippy.init(node, settings) -/**********************************/ -/******** Work in progress ********/ -/**********************************/ + /**********************************/ + /******** Work in progress ********/ + /**********************************/ -// superbook.flipping = false + // superbook.flipping = false -// superbook.flipped = true // Custom event? + // superbook.flipped = true // Custom event? -// superbook.zooming = false // boolean state + // superbook.zooming = false // boolean state -// superbook.zoomed = true // boolean state + // superbook.zoomed = true // boolean state -// superbook.page = () => 'current_page' + // superbook.page = () => 'current_page' -// superbook.area = () => '[height, width]' + // superbook.area = () => '[height, width]' -// superbook.direction = 'forward' + // superbook.direction = 'forward' -// superbook.next = () => { -// superbook.direction = 'forward' -// return superbook.direction -// } + // superbook.next = () => { + // superbook.direction = 'forward' + // return superbook.direction + // } -// superbook.prev = () => { -// superbook.direction = 'backward' -// return superbook.direction -// } + // superbook.prev = () => { + // superbook.direction = 'backward' + // return superbook.direction + // } -// superbook.hasPage = pageNo => { -// console.log('Returns if page exist: ', pageNo) -// } + // superbook.hasPage = pageNo => { + // console.log('Returns if page exist: ', pageNo) + // } -// superbook.addPage = (pageNo, content) => { -// console.log('Adding page number: ', content, 'at', pageNo) -// } + // superbook.addPage = (pageNo, content) => { + // console.log('Adding page number: ', content, 'at', pageNo) + // } -// superbook.removePage = pageNo => { -// console.log('Remove page number: ', pageNo) -// } + // superbook.removePage = pageNo => { + // console.log('Remove page number: ', pageNo) + // } -/**********************************/ -/******** Implemented API ********/ -/**********************************/ + /**********************************/ + /******** Implemented API ********/ + /**********************************/ -// let booklength = superbook.flippy('length') -// console.log('Book length', booklength) + // PROPERTIES: -// superbook.flippy('flip', 7); + // let booklength = superbook.flippy('length') + // console.log('Book length', booklength) + // let view = superbook.flippy('view') + // console.log('Current view', view) + // superbook.flippy('flip', 7) -// }); -/***********Z' END **************/ +}) + +/***********Z' END **************/ diff --git a/modules/mode.js b/modules/mode.js index d84c56f..baa64ca 100644 --- a/modules/mode.js +++ b/modules/mode.js @@ -1,8 +1,6 @@ ((w, d, undefined) => { module.exports = { getMatch(query, usePolyfill) { - // TODO: Consider d.addEventListener('DOMContentLoaded', function(event) { } - return testMedia(query, usePolyfill).matches }, @@ -33,17 +31,20 @@ +// console.log(Math.max(document.documentElement.clientWidth, window.innerWidth || 0)) + // let mode = (window.innerWidth > window.innerHeight) ? 'landscape' : 'portrait' // console.log('FIRSTMODE', mode, 'innerWidth=', window.innerWidth, 'innerHeight=', window.innerHeight) -// window.addEventListener('resize', e => { + + +// window.addEventListener('resize', e => { // let newMode = (window.innerWidth > window.innerHeight) ? 'landscape' : 'portrait' -// if(newMode !== mode) { +// if (newMode !== mode) { // console.log('RESIZEDMODE', mode, 'innerWidth=', window.innerWidth, 'innerHeight=', window.innerHeight) // } // }, true); -