bachir/archeo010110-ananthology
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

big refactoring

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2017-01-29 14:57:01 +01:00
parent dfc62f63fe
commit 599c25c390
6 changed files with 343 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files
js/main.js
+109 -78
View File
@@ -6,17 +6,17 @@ $(document).ready(function() {
h:$(document).height()
},
_$root = $('#root'),
_pl = 58,
_active_pages = {},
_current_pages = 0,
_page_left_bg, _page_right_bg,
_total_dp_len = 58,
_active_pages_keys = [],
_current_dp_key = "0", _current_dp_ob, _first_dp = true, _last_dp = false,
_$page_left = $('#page-left'), _$page_right = $('#page-right'),
_$overlay_left = $('#page-left .overlay'), _$overlay_right = $('#page-right .overlay'),
_$maps_left = $('#page-left .maps'), _$maps_right = $('#page-right .maps'),
_bgs_prefix = "images/pages/",
_$railway = $('#railway'),
_$pagination = $('#pagination');
_$pagi_l = $('#pagination .wrapper-l .p'), _$pagi_r = $('#pagination .wrapper-r .p');
_$pagination = $('#pagination'),
_$pagi_l_arrow = $('.wrapper-l .l', _$pagination), _$pagi_r_arrow = $('.wrapper-r .l', _$pagination),
_$pagi_l_txt = $('.wrapper-l .p', _$pagination), _$pagi_r_txt = $('.wrapper-r .p', _$pagination);
// ____ _ __
// / _/___ (_) /_
@@ -25,7 +25,7 @@ $(document).ready(function() {
// /___/_/ /_/_/\__/
function init(){
// console.log("init", _PAGES[0].bg);
// console.log("init", _ACTIVE_PAGES[0].bg);
initLayout();
initData();
initRailway();
@@ -42,15 +42,16 @@ $(document).ready(function() {
};
function initData(){
for (var p = 0; p < _PAGES.length; p++) {
if(typeof _PAGES[p][0].page !== "undefined"){
_active_pages[(_PAGES[p][0].page+1)/2] = p;
}
else if(typeof _PAGES[p][1].page !== "undefined"){
_active_pages[_PAGES[p][1].page/2] = p;
}
}
console.log("_active_pages", _active_pages);
_active_pages_keys = Object.keys(_ACTIVE_PAGES);
console.log("_active_pages_keys", _active_pages_keys);
// for (var p = 0; p < _ACTIVE_PAGES.length; p++) {
// if(typeof _ACTIVE_PAGES[p][0].page !== "undefined"){
// _active_pages[(_ACTIVE_PAGES[p][0].page+1)/2] = p;
// }
// else if(typeof _ACTIVE_PAGES[p][1].page !== "undefined"){
// _active_pages[_ACTIVE_PAGES[p][1].page/2] = p;
// }
// }
};
// _ __
@@ -60,53 +61,61 @@ $(document).ready(function() {
// /_/ |_/\__,_/ |___/
function initRailway(){
var $ul = $('<ul>');
var ap, bgl, bgr;
for (var dp = 0; dp <= _pl; dp++) {
var $ul = $('<ul>').appendTo(_$railway);
var $li, adp, bgl, bgr, pl, pr;
// loop through double pages
for (var dp = 0; dp <= _total_dp_len; dp++) {
// console.log("-- DOUBLE PAGE --", dp);
ap = typeof _active_pages[dp] !== "undefined" ? _active_pages[dp] : false;
// console.log("ap",ap);
if(ap !== false){
bgl = typeof _PAGES[ap][0].bg !== "undefined" ? _bgs_prefix+"thumbs/"+_PAGES[ap][0].bg : false;
bgr = typeof _PAGES[ap][1].bg !== "undefined" ? _bgs_prefix+"thumbs/"+_PAGES[ap][1].bg : false;
$li = $('<li>')
.addClass('double-page-'+dp)
.appendTo($ul);
// check if current double page is active or not by checking if we have info for it in pages.json
// adp = typeof _active_pages[dp] !== "undefined" ? _active_pages[dp] : false;
adp = typeof _ACTIVE_PAGES[dp] !== "undefined" ? dp : false;
// console.log("adp",adp);
if(adp !== false){
// if active double page
$li.addClass('active');
// find for left and right pages if we have background info
bgl = typeof _ACTIVE_PAGES[adp][0].bg !== "undefined" ? _bgs_prefix+"thumbs/"+_ACTIVE_PAGES[adp][0].bg : false;
bgr = typeof _ACTIVE_PAGES[adp][1].bg !== "undefined" ? _bgs_prefix+"thumbs/"+_ACTIVE_PAGES[adp][1].bg : false;
}else{
// if not active double page, no background
bgl = bgr = false;
}
// console.log("_PAGES[ap][1].bg", _PAGES[ap][1].bg);
// console.log("bgl", bgl);
// console.log("bgr", bgr);
var p = dp*2;
// get the real page left and right numbers from double page number
pr = dp*2;
pl = pr -1;
// add left page only if not first page (cover)
if(dp!=0)
$('<li>')
.addClass('page page-'+(p-1)+' double-page-'+dp+' page-left')
$('<span>')
.addClass('page page-'+(pl)+' double-page-'+dp+' page-left')
.addClass(bgl ? 'active' : 0)
.css({'background-image': bgl ? "url("+bgl+")" : "none"})
.appendTo($ul);
.appendTo($li);
if(dp<_pl)
$('<li>')
.addClass('page page-'+p+' double-page-'+dp+' page-right')
// add right page only if not last page (backcover)
if(dp<_total_dp_len)
$('<span>')
.addClass('page page-'+pr+' double-page-'+dp+' page-right')
.addClass(bgr ? 'active' : 0)
.css({'background-image': bgr ? "url("+bgr+")" : "none"})
.appendTo($ul);
.appendTo($li);
}
$ul.appendTo(_$railway);
$('li', _$railway).on('click', function(event) {
var p = $(this).attr('class').match(/page-(\d+)/)[1];
console.log('page', p);
console.log(p%2);
// check if page is pair ou impair and calculate de double_page number
var dp = p%2 ? (p*1+1)/2 : p/2;
_current_pages = _active_pages[dp];
$('li.active', _$railway).on('click', function(event) {
dp = $(this).attr('class').match(/double-page-(\d+)/)[1];
_current_dp_key = dp; //_active_pages[dp];
changePages();
});
}
// TODO: next page arrow
// ____
// / __ \____ _____ ____ _____
// / /_/ / __ `/ __ `/ _ \/ ___/
@@ -115,50 +124,72 @@ $(document).ready(function() {
// /____/
function nextPages(){
if(_current_pages < _PAGES.length-1){
_current_pages+=1;
var i = _active_pages_keys.indexOf(_current_dp_key) +1;
if(i <= _active_pages_keys.length-1){
_current_dp_key = _active_pages_keys[i];
changePages();
}
};
function prevPages(){
if(_current_pages > 0){
_current_pages-=1;
var i = _active_pages_keys.indexOf(_current_dp_key)-1;
if(i >= 0){
_current_dp_key = _active_pages_keys[i];
changePages();
}
};
function changePages(){
console.log("changePages", _current_pages);
console.log("changePages", _current_dp_key);
$('li',_$railway).removeClass('current');
if (typeof _PAGES[_current_pages][0].bg !== "undefined") {
var pl = _PAGES[_current_pages][0];
_$page_left
.css({'background-image': "url("+_bgs_prefix+pl.bg+")"})
.removeClass(pageClassToRemove)
.addClass('page-'+pl.page);
_$pagi_l.text(pl.page);
$('li.page-'+pl.page).addClass('current');
}else{
_$page_left.css({'background-image': "none"});
_$pagi_l.text("");
}
if(typeof _ACTIVE_PAGES[_current_dp_key] !== "undefined"){
_current_dp_ob = _ACTIVE_PAGES[_current_dp_key];
if (typeof _PAGES[_current_pages][1].bg !== "undefined") {
var pr = _PAGES[_current_pages][1];
_$page_right
.css({'background-image': "url("+_bgs_prefix+pr.bg+")"})
.removeClass(pageClassToRemove)
.addClass('page-'+pr.page);
_$pagi_r.text(pr.page);
$('li.page-'+pr.page).addClass('current');
}else{
_$page_right.css({'background-image': "none"});
_$pagi_r.text("");
}
if (typeof _current_dp_ob[0].bg !== "undefined") {
var pl = _current_dp_ob[0];
// change display of main page left
_$page_left
.css({'background-image': "url("+_bgs_prefix+pl.bg+")"})
.removeClass(pageClassToRemove)
.addClass('page-'+pl.page);
// change pagination
_$pagi_l_txt.text(pl.page);
}else{
_$page_left.css({'background-image': "none"});
_$pagi_l_txt.text("");
}
if (typeof _current_dp_ob[1].bg !== "undefined") {
var pr = _current_dp_ob[1];
_$page_right
.css({'background-image': "url("+_bgs_prefix+pr.bg+")"})
.removeClass(pageClassToRemove)
.addClass('page-'+pr.page);
_$pagi_r_txt.text(pr.page);
}else{
_$page_right.css({'background-image': "none"});
_$pagi_r_txt.text("");
}
// hide or show nav arrows for first annd last double page
var i = _active_pages_keys.indexOf(_current_dp_key);
if( i == 0){
_$pagi_l_arrow.addClass('hidden');
}else{
_$pagi_l_arrow.removeClass('hidden')
}
if(i == _active_pages_keys.length-1){
_$pagi_r_arrow.addClass('hidden');
}else{
_$pagi_r_arrow.removeClass('hidden')
}
// make railway db thumb current
$('li.double-page-'+_current_dp_key).addClass('current');
}
// updatePagesOverlays();
};
@@ -175,11 +206,11 @@ $(document).ready(function() {
$('.overlay, .maps',_$page_left).children().remove();
$('.overlay, .maps',_$page_right).children().remove();
console.log("Overlays", _PAGES[_current_pages].overlays);
console.log("Overlays", _ACTIVE_PAGES[_current_dp_key].overlays);
// build page_left overlays
for (var map in _PAGES[_current_pages].overlays) {
if (_PAGES[_current_pages].overlays.hasOwnProperty(map)) {
map = _PAGES[_current_pages].overlays[map];
for (var map in _ACTIVE_PAGES[_current_dp_key].overlays) {
if (_ACTIVE_PAGES[_current_dp_key].overlays.hasOwnProperty(map)) {
map = _ACTIVE_PAGES[_current_dp_key].overlays[map];
console.log("Map",map);
_$maps_left.append(
$('<div>')