From 3d00ed3c40e5eadff2d16df0b2f9486c90dd01af Mon Sep 17 00:00:00 2001 From: Travis Weston Date: Sat, 7 Feb 2015 11:19:37 -0500 Subject: [PATCH 1/3] Add scrolling via keyboard --- script/engine.js | 15 +++++++++--- script/outside.js | 60 ++++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 71 insertions(+), 4 deletions(-) diff --git a/script/engine.js b/script/engine.js index 45423e994..f6fdf528b 100644 --- a/script/engine.js +++ b/script/engine.js @@ -593,10 +593,16 @@ switch(e.which) { case 38: // Up case 87: + if(Engine.activeModule == Outside){ + Engine.activeModule.scrollSidebar('up'); + } Engine.log('up'); break; case 40: // Down case 83: + if(Engine.activeModule == Outside){ + Engine.activeModule.scrollSidebar('down'); + } Engine.log('down'); break; case 37: // Left @@ -605,17 +611,20 @@ Engine.travelTo(Path); else if(Engine.activeModule == Path && Outside.tab) Engine.travelTo(Outside); - else if(Engine.activeModule == Outside && Room.tab) + else if(Engine.activeModule == Outside && Room.tab){ + Engine.activeModule.scrollSidebar('left', true); Engine.travelTo(Room); + } Engine.log('left'); break; case 39: // Right case 68: if(Engine.activeModule == Room && Outside.tab) Engine.travelTo(Outside); - else if(Engine.activeModule == Outside && Path.tab) + else if(Engine.activeModule == Outside && Path.tab){ + Engine.activeModule.scrollSidebar('right', true); Engine.travelTo(Path); - else if(Engine.activeModule == Path && Ship.tab) + }else if(Engine.activeModule == Path && Ship.tab) Engine.travelTo(Ship); Engine.log('right'); break; diff --git a/script/outside.js b/script/outside.js index d01ed718a..a91fba4fd 100644 --- a/script/outside.js +++ b/script/outside.js @@ -4,6 +4,7 @@ var Outside = { name: _("Outside"), + _STORES_OFFSET: 0, _GATHER_DELAY: 60, _TRAPS_DELAY: 90, _POP_DELAY: [0.5, 3], @@ -439,7 +440,7 @@ var Outside = { this.setTitle(); if(!ignoreStores && Engine.activeModule === Outside && village.children().length > 1) { - $('#storesContainer').css({top: village.height() + 26 + 'px'}); + $('#storesContainer').css({top: village.height() + 26 + Outside._STORES_OFFSET + 'px'}); } }, @@ -611,5 +612,62 @@ var Outside = { Outside.updateWorkersView(); Outside.updateVillageIncome(); }; + }, + + scrollSidebar: function(direction, reset) { + + if( typeof reset != "undefined" ){ + $('#village').css('top', '0px'); + $('#storesContainer').css('top', '224px'); + Outside._STORES_OFFSET = 0; + return false; + } + + var momentum = 10; + + // If they hit up, we scroll everything down + if( direction == 'up' ) + momentum = momentum * -1; + + /* Let's stop scrolling if the top or bottom bound is in the viewport, based on direction */ + if( direction == 'down' && inView( direction, $('#village') ) ){ + console.log(direction); + console.log('IN VIEW'); + return false; + }else if( direction == 'up' && inView( direction, $('#storesContainer') ) ){ + console.log(direction); + console.log('IN VIEW'); + return false; + } + + scrollByX( $('#village'), momentum ); + scrollByX( $('#storesContainer'), momentum ); + Outside._STORES_OFFSET += momentum; + } }; +function inView(dir, elem){ + + var scTop = $('#main').offset().top; + var scBot = scTop + $('#main').height(); + + var elTop = elem.offset().top; + var elBot = elTop + elem.height(); + + if( dir == 'up' ){ + // STOP MOVING IF BOTTOM OF ELEMENT IS VISIBLE IN SCREEN + return ( elBot < scBot ); + }else if( dir == 'down' ){ + return ( elTop > scTop ); + }else{ + return ( ( elBot <= scBot ) && ( elTop >= scTop ) ); + } + +} + +function scrollByX(elem, x){ + + var elTop = parseInt( elem.css('top'), 10 ); + elem.css( 'top', ( elTop + x ) + "px" ); + +} From 2d3daa572d409e56f14e320bb0b0b4260f14ed1e Mon Sep 17 00:00:00 2001 From: Travis Weston Date: Sat, 7 Feb 2015 14:00:32 -0500 Subject: [PATCH 2/3] Move movement functions to Engine. Create scrollable Path sidebar --- script/engine.js | 42 ++++++++++++++++++++++++++++++++++++------ script/outside.js | 33 ++++----------------------------- script/path.js | 34 ++++++++++++++++++++++++++++++++-- 3 files changed, 72 insertions(+), 37 deletions(-) diff --git a/script/engine.js b/script/engine.js index f6fdf528b..09ee52076 100644 --- a/script/engine.js +++ b/script/engine.js @@ -593,14 +593,14 @@ switch(e.which) { case 38: // Up case 87: - if(Engine.activeModule == Outside){ + if(Engine.activeModule == Outside || Engine.activeModule == Path) Engine.activeModule.scrollSidebar('up'); - } + Engine.log('up'); break; case 40: // Down case 83: - if(Engine.activeModule == Outside){ + if(Engine.activeModule == Outside || Engine.activeModule == Path){ Engine.activeModule.scrollSidebar('down'); } Engine.log('down'); @@ -609,9 +609,10 @@ case 65: if(Engine.activeModule == Ship && Path.tab) Engine.travelTo(Path); - else if(Engine.activeModule == Path && Outside.tab) + else if(Engine.activeModule == Path && Outside.tab){ + Engine.activeModule.scrollSidebar('left', true); Engine.travelTo(Outside); - else if(Engine.activeModule == Outside && Room.tab){ + }else if(Engine.activeModule == Outside && Room.tab){ Engine.activeModule.scrollSidebar('left', true); Engine.travelTo(Room); } @@ -624,8 +625,10 @@ else if(Engine.activeModule == Outside && Path.tab){ Engine.activeModule.scrollSidebar('right', true); Engine.travelTo(Path); - }else if(Engine.activeModule == Path && Ship.tab) + }else if(Engine.activeModule == Path && Ship.tab){ + Engine.activeModule.scrollSidebar('right', true); Engine.travelTo(Ship); + } Engine.log('right'); break; } @@ -703,6 +706,33 @@ })(); +function inView(dir, elem){ + + var scTop = $('#main').offset().top; + var scBot = scTop + $('#main').height(); + + var elTop = elem.offset().top; + var elBot = elTop + elem.height(); + + if( dir == 'up' ){ + // STOP MOVING IF BOTTOM OF ELEMENT IS VISIBLE IN SCREEN + return ( elBot < scBot ); + }else if( dir == 'down' ){ + return ( elTop > scTop ); + }else{ + return ( ( elBot <= scBot ) && ( elTop >= scTop ) ); + } + +} + +function scrollByX(elem, x){ + + var elTop = parseInt( elem.css('top'), 10 ); + elem.css( 'top', ( elTop + x ) + "px" ); + +} + + //create jQuery Callbacks() to handle object events $.Dispatch = function( id ) { var callbacks, topic = id && Engine.topics[ id ]; diff --git a/script/outside.js b/script/outside.js index a91fba4fd..9aa0dceba 100644 --- a/script/outside.js +++ b/script/outside.js @@ -631,13 +631,13 @@ var Outside = { /* Let's stop scrolling if the top or bottom bound is in the viewport, based on direction */ if( direction == 'down' && inView( direction, $('#village') ) ){ - console.log(direction); - console.log('IN VIEW'); + return false; + }else if( direction == 'up' && inView( direction, $('#storesContainer') ) ){ - console.log(direction); - console.log('IN VIEW'); + return false; + } scrollByX( $('#village'), momentum ); @@ -646,28 +646,3 @@ var Outside = { } }; -function inView(dir, elem){ - - var scTop = $('#main').offset().top; - var scBot = scTop + $('#main').height(); - - var elTop = elem.offset().top; - var elBot = elTop + elem.height(); - - if( dir == 'up' ){ - // STOP MOVING IF BOTTOM OF ELEMENT IS VISIBLE IN SCREEN - return ( elBot < scBot ); - }else if( dir == 'down' ){ - return ( elTop > scTop ); - }else{ - return ( ( elBot <= scBot ) && ( elTop >= scTop ) ); - } - -} - -function scrollByX(elem, x){ - - var elTop = parseInt( elem.css('top'), 10 ); - elem.css( 'top', ( elTop + x ) + "px" ); - -} diff --git a/script/path.js b/script/path.js index e1cbb593a..d36c22b15 100644 --- a/script/path.js +++ b/script/path.js @@ -1,7 +1,7 @@ var Path = { DEFAULT_BAG_SPACE: 10, - + _STORES_OFFSET: 0, // Everything not in this list weighs 1 Weight: { 'bone spear': 2, @@ -116,7 +116,7 @@ var Path = { } if(!ignoreStores && Engine.activeModule === Path) { - $('#storesContainer').css({top: perks.height() + 26 + 'px'}); + $('#storesContainer').css({top: perks.height() + 26 + Path._STORES_OFFSET + 'px'}); } } }, @@ -313,5 +313,35 @@ var Path = { if(e.category == 'character' && e.stateName.indexOf('character.perks') == 0 && Engine.activeModule == Path){ Path.updatePerks(); }; + }, + + scrollSidebar: function(direction, reset){ + + if( typeof reset != "undefined" ){ + $('#perks').css('top', '0px'); + $('#storesContainer').css('top', '206px'); + Path._STORES_OFFSET = 0; + return; + } + + var momentum = 10; + + if( direction == 'up' ) + momentum = momentum * -1 + + if( direction == 'down' && inView( direction, $('#perks') ) ){ + + return false; + + }else if( direction == 'up' && inView( direction, $('#storesContainer') ) ){ + + return false; + + } + + scrollByX( $('#perks'), momentum ); + scrollByX( $('#storesContainer'), momentum ); + Path._STORES_OFFSET += momentum; + } }; From 340851a99d4f4fc7d06b32c7f2e96d00a3d308d0 Mon Sep 17 00:00:00 2001 From: Travis Weston Date: Wed, 11 Feb 2015 18:21:08 -0500 Subject: [PATCH 3/3] Updated against suggestions --- script/engine.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/script/engine.js b/script/engine.js index acf696585..91705f7ec 100644 --- a/script/engine.js +++ b/script/engine.js @@ -605,14 +605,14 @@ switch(e.which) { case 38: // Up case 87: - if(Engine.activeModule == Outside || Engine.activeModule == Path) + if(Engine.activeModule == Outside || Engine.activeModule == Path) { Engine.activeModule.scrollSidebar('up'); - + } Engine.log('up'); break; case 40: // Down case 83: - if(Engine.activeModule == Outside || Engine.activeModule == Path){ + if (Engine.activeModule == Outside || Engine.activeModule == Path) { Engine.activeModule.scrollSidebar('down'); } Engine.log('down');