Skip to content

Commit

Permalink
Replaced animation hooks to work with view routing. Fixed link orderi…
Browse files Browse the repository at this point in the history
…ng. Started implementing battle view's view-model definitions - tested with 'scient' from 'BattleService.initial_state()' and dependancies.
  • Loading branch information
juraj committed Jun 13, 2013
1 parent f558e8f commit 6418895
Show file tree
Hide file tree
Showing 8 changed files with 570 additions and 82 deletions.
17 changes: 11 additions & 6 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,30 @@
<head>
<title>Binary Tactics</title>

<link rel="stylesheet"href="res/css/main.css" type="text/css" media="all" />
<link rel="stylesheet" href="res/css/main.css" type="text/css" media="all" />
</head>

<body ng-controller="bt.ng.controller">

<!-- Header -->
<div class="section">
<a ng-show=" bt.game.authentication.isAuthenticated ">Current user: {{ bt.game.authentication.username }}</a>
<a>Current user: </a>
<a ng-show=" bt.game.authentication.isAuthenticated ">{{ bt.game.authentication.username }}</a>
<hr/>
<div class="menu">
<div class="link" ng-repeat=" (key, view) in bt.config.views.viewsByName | orderBy: view._index ">
<a ng-if=" view.isPublic || bt.game.authentication.isAuthenticated " href="#{{ key }}"> {{ view.name }} </a>
<div class="link viewAnimationContainer" ng-repeat=" view in bt.config.views.viewsArray | orderBy: view._index ">
<a ng-if=" view.isPublic || bt.game.authentication.isAuthenticated " href="#{{ view._key }}"> {{ view.name }} </a>
</div>
</div>
<div style="clear: both"></div>
</div>

<div></div>

<!-- Includes current view -->
<div ng-view ng-animate=" bt.effects.viewChange "></div>
<div ng-view class="viewAnimationContainer" ng-animate=" { enter: 'enterFromLeft', leave: 'leaveToRight' } "></div>

<!-- 3rd party: JS inclusions -->

<script type="text/javascript" src="res/js/3rd_party/angular.115.js"></script>
<!-- Not yet needed: <script type="text/javascript" src="res/js/3rd_party/angular_resource.115.js"></script> -->
<script type="text/javascript" src="res/js/3rd_party/angular_jsonrpc.js"></script>
Expand All @@ -32,9 +35,11 @@
<script type="text/javascript" src="res/js/bt_init.js"></script>
<script type="text/javascript" src="res/js/bt_config.js"></script>
<script type="text/javascript" src="res/js/bt_authentication.js"></script>
<script type="text/javascript" src="res/js/model/bt_model.js"></script>
<script type="text/javascript" src="res/js/bt_game_frontpage.js"></script>
<script type="text/javascript" src="res/js/bt_game_equanimity.js"></script>
<script type="text/javascript" src="res/js/bt_game_battle.js"></script>
<script type="text/javascript" src="res/js/model/bt_model_battle.js"></script>
<script type="text/javascript" src="res/js/bt_game_equipment.js"></script>
</body>
</html>
79 changes: 25 additions & 54 deletions res/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,67 +10,39 @@


/* Elements animations
// =========================================================================================================== */
// ====================================================================================================================== */

/* DOM manipulation animations: Slide in/out */
.slideL-enter {
position: relative;
-webkit-transition: all linear 0.5s;
-moz-transition: all linear 0.5s;
-ms-transition: all linear 0.5s;
-o-transition: all linear 0.5s;
transition: all linear 0.5s;
}
.slideL-leave {
position: relative;
-webkit-transition: all linear 0.25s;
-moz-transition: all linear 0.25s;
-ms-transition: all linear 0.25s;
-o-transition: all linear 0.25s;
transition: all linear 0.25s;
}
.slideL-enter {
right: -200%;
}
.slideL-enter-active {
right: 0px;
}
.slideL-leave {
right: 0px;
}
.slideL-leave-active {
right: 100%;
}

.slideR-enter {
.animationContainer { }

.enterFromLeft, .enterFromRight, .enterFade {
position: relative;
-webkit-transition: all linear 0.5s;
-moz-transition: all linear 0.5s;
-ms-transition: all linear 0.5s;
-o-transition: all linear 0.5s;
transition: all linear 0.5s;
transition: all linear 0.4s;
}
.slideR-leave {
.leaveToLeft, .leaveToRight, .leaveFade {
position: relative;
-webkit-transition: all linear 0.25s;
-moz-transition: all linear 0.25s;
-ms-transition: all linear 0.25s;
-o-transition: all linear 0.25s;
transition: all linear 0.25s;
}
.slideR-enter {
left: -200%;
}
.slideR-enter-active {
left: 0px;
}
.slideR-leave {
left: 0px;
}
.slideR-leave-active {
left: 100%;
transition: all linear 0.2s;
}

.enterFromLeft { left: -200%; }
.enterFromLeft.enterFromLeft-active { left: 0px; }

.enterFromRight { right: -200%; }
.enterFromRight.enterFromRight-active { right: 0px; }

.enterFade { opacity: 0; }
.enterFade.enterFade-active { opacity: 1; }

.leaveToLeft { left: 0px; }
.leaveToLeft.leaveToLeft-active { left: -100%; }

.leaveToRight { right: 0px; }
.leaveToRight.leaveToRight-active { right: -100%; }

.leaveFade { opacity: 1; }
.leaveFade.leaveFade-active { opacity: 0; }


/* Generic
* ---------------------------------------------------------------------------------------------------------------------- */
Expand All @@ -94,7 +66,6 @@ div.section {

font-family: monospace;
font-size: 11px;
color: c6ff00;
}

/* Page markup (TEMP)
Expand Down
4 changes: 2 additions & 2 deletions res/js/bt_authentication.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ bt.services.authenticationService = app.factory('AuthenticationService', functio
// Prompt authenticating
// Set authenticating username and status
bt.game.authentication.login._isAuthenticating = true;
bt.game.authentication.login._authUsername = bt.game.authentication.login.username
bt.game.authentication.login._authUsername = bt.game.authentication.login.username;
$http({

// Service call configuration
Expand Down Expand Up @@ -104,7 +104,7 @@ bt.game.authentication = {
// Holds user's password
password : 'atkr'

},
}

}

Expand Down
1 change: 1 addition & 0 deletions res/js/bt_config.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,3 +20,4 @@ bt.config.poling.minimalIntervalBetweenPolls = 2000;

// Set debugging options
bt.debugging.events.publishToConsole = true;
bt.debugging.model.verifyModelConstructors = true;
6 changes: 4 additions & 2 deletions res/js/bt_game_battle.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ bt.game.battle = {
// View manipulation namespace
view : {
// On view load
// TODO: Set interval inside Angular context
onLoad : function() {
// Query server time
bt.game.battle.timers.query();
Expand All @@ -87,10 +88,11 @@ bt.game.battle = {
bt.game.battle.timers._interval = setInterval(bt.game.battle.timers.update, 1000);
},
// On view unload
// TODO: Set interval inside Angular context
onUnload : function() {
// Stop timer interval
if (bt.game.battle.timers._interval) clearInterval(bt.game.battle.timers._interval);
},
}
},

// Battle timers namespace
Expand Down Expand Up @@ -176,7 +178,7 @@ bt.game.battle = {
});
// Fire event
bt.services.battleService.Updated.dispatch({
message: 'Updated "BattleService" timers',
message: 'Updated "BattleService" timers'
});
}
}
Expand Down
50 changes: 32 additions & 18 deletions res/js/bt_init.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ var btView = function(obj) {
if (this.isPublic == null) this.isPublic = true;
if (this.onLoad == null) this.onLoad = null;
if (this.onUnload == null) this.onUnload = null;

// Validate method: checks if view can be loaded
if (this.validate == null) this.validate = function() {
return ((this.isPublic) || ((bt.game) && (bt.game.authentication) && (bt.game.authentication.isAuthenticated)));
Expand Down Expand Up @@ -106,18 +106,6 @@ var bt = {

},

// Transition effects namespace
effects : {

// Holds current view changed effect
viewChange : '',
// Names 'view change in' transition effect
viewChangeIn : 'slideL',
// Names 'view change out' transition effect
viewChangeOut : 'slideR'

},

// Game namespace ()
game : {

Expand Down Expand Up @@ -145,7 +133,27 @@ var bt = {
}

},


// Data model definitions namespace
model : {

// Model definitions namespace
definitions : { /* Filled implicitly from other JS scripts */ },

// Extends from object or array of objects
extend : function(target, objs) {
// Check if object or array
if (angular.isArray(objs)) {
// Extend from array
for (var obj in objs) angular.extend(target, objs[obj]);
} else {
// Extend from object
angular.extend(target, objs);
}
}

},

// Non DOM events namespace
events : {

Expand Down Expand Up @@ -210,6 +218,12 @@ var bt = {
events : {
// Toggles events push to console
publishToConsole : false
},

// Data model namespace
model : {
// Toggles if model constructors will test received properties
verifyModelConstructors : false
}
}

Expand All @@ -236,7 +250,7 @@ bt.events.define(bt.config.views, 'viewFailed');

// Handle route changes and view verification
app.run( function($rootScope, $location) {

// Handle route changing event
$rootScope.$on( "$routeChangeStart", function(event, next, current) {
// Find and validate route/view
Expand Down Expand Up @@ -281,13 +295,13 @@ app.run( function($rootScope, $location) {
// Handle route changed or failed events
$rootScope.$on( "$routeChangeSuccess", function(event, next, current) {
// Selected view validated
bt.config.views.viewChanged.dispatch( 'View "' + next.templateUrl + '" changed.' );
if ((!current) || (next.templateUrl != current.templateUrl)) bt.config.views.viewChanged.dispatch( 'View "' + next.templateUrl + '" changed.' );
});
$rootScope.$on( "$routeChangeError", function(event, next, current) {
// Selected view validated
bt.config.views.viewFailed.dispatch( 'View "' + next.templateUrl + '" failed.' );
if ((!current) || (next.templateUrl != current.templateUrl)) bt.config.views.viewFailed.dispatch( 'View "' + next.templateUrl + '" failed.' );
});

});

// On loaded
Expand Down
48 changes: 48 additions & 0 deletions res/js/model/bt_model.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
"use strict";

/* =====================================================================================================================
* Binary tactics: 'data model' definition
* ================================================================================================================== */

// Initialize data model
// ---------------------------------------------------------------------------------------------------------------------
bt.model.common = {

// Basic elements namespace
elements : {

// Holds basic elements definitions / types
definitions : {
E : 'Earth',
F : 'Fire',
I : 'Ice',
W : 'Wind'
}

},

// Basic weapons namespace
weapons : {

// Holds basic weapons definitions / types
definitions : {
sword : 'sword',
bow : 'bow',
wand : 'wand',
glove : 'glove'
}

},

// Basic unit namespace
units : {

// Holds basic unit definitions / types
definitions : {
scient : 'scient',
nescient : 'nescient'
}

}

}
Loading

0 comments on commit 6418895

Please sign in to comment.