123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122 |
- $(document).ready(function() {
- console.log("ready");
- var _current_pages = 0,
- _page_left_bg, _page_right_bg,
- _$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/";
- // ____ _ __
- // / _/___ (_) /_
- // / // __ \/ / __/
- // _/ // / / / / /_
- // /___/_/ /_/_/\__/
- function init(){
- console.log("init", _PAGES[0].bg);
- initkeyboard();
- changePages();
- };
- // ____
- // / __ \____ _____ ____ _____
- // / /_/ / __ `/ __ `/ _ \/ ___/
- // / ____/ /_/ / /_/ / __(__ )
- // /_/ \__,_/\__, /\___/____/
- // /____/
- function nextPages(){
- if(_current_pages < _PAGES.length-2){
- _current_pages+=2;
- changePages();
- }
- };
- function prevPages(){
- if(_current_pages > -1){
- _current_pages-=2;
- changePages();
- }
- };
- function changePages(){
- console.log("changePages");
- _page_left_bg = _bgs_prefix+_PAGES[_current_pages].bg;
- _page_right_bg = _bgs_prefix+_PAGES[_current_pages+1].bg;
- console.log(_page_left_bg+" | "+_page_right_bg);
- _$page_left
- .css({'background-image': "url("+_page_left_bg+")"})
- .removeClass(pageClassToRemove)
- .addClass('page-'+_current_pages);
- _$page_right
- .css({'background-image': "url("+_page_right_bg+")"})
- .removeClass(pageClassToRemove)
- .addClass('page-'+(_current_pages+1));
- updatePagesOverlays();
- };
- function pageClassToRemove(){
- var c = $(this).attr('class').match(/page-+\d+/);
- if(c && c.length)
- return c[0];
- };
- function updatePagesOverlays(){
- console.log("updatePagesOverlays");
- // remove all pages overlays
- $('.overlay, .maps',_$page_left).children().remove();
- $('.overlay, .maps',_$page_right).children().remove();
- console.log("Overlays", _PAGES[_current_pages].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];
- console.log("Map",map);
- _$maps_left.append(
- $('<div>')
- .addClass("map")
- .attr('overlay', map.over)
- .css({
- "left":map.x,
- "top":map.y,
- "width":map.w,
- "height":map.h
- })
- .bind("mouseover", function(e){
- $(this)
- .parents('.page').find('.overlay')
- .css({
- // 'background-color':"red",
- 'background-image':'url(images/vectos/'+$(this).attr('overlay')+')'
- });
- })
- );
- }
- }
- };
- // __ __ __ __
- // / //_/__ __ __/ /_ ____ ____ __________/ /
- // / ,< / _ \/ / / / __ \/ __ \/ __ `/ ___/ __ /
- // / /| / __/ /_/ / /_/ / /_/ / /_/ / / / /_/ /
- // /_/ |_\___/\__, /_.___/\____/\__,_/_/ \__,_/
- // /____/
- function initkeyboard(){
- keyboardJS.bind('right', function(event) {
- // console.log(event);
- nextPages();
- });
- keyboardJS.bind('left', function(event) {
- // console.log(event);
- prevPages();
- });
- };
- init();
- });
|