Permalink
Browse files

selected visible planet

  • Loading branch information...
fguillen committed Apr 5, 2012
1 parent f6a0b6d commit c25fd2e405c637f751e4b946e6bb020d8d805f1e
Showing with 34 additions and 21 deletions.
  1. +1 −1 client/app/Planet.js
  2. +9 −16 client/app/PlanetDecorator.js
  3. +3 −1 client/app/PlanetInfoView.js
  4. +11 −0 client/app/Planets.js
  5. +8 −1 client/app/Router.js
  6. +2 −2 client/index.html
View
@@ -1,12 +1,12 @@
$(function(){
App.Planet = Backbone.Model.extend({
initialize: function(){
- this.set( "selected", false );
this.ships = new App.Ships();
this.enemyFleets = new App.Fleets();
this.set( "creatingFleet", false );
this.set( "possibleFleetDestination", false );
+ this.set( "visible", false );
this.on( "change:mine change:silo change:hangar change:parking", this.updateConstructions, this );
@@ -11,8 +11,7 @@ $(function(){
{
units_count: this.planet.ships.size(),
units_enemy_count: this.unitsEnemyCount(),
- creating_fleet_class: this.creatingFleetClass(),
- possible_fleet_destination_class: this.possibleFleetDestinationClass()
+ extra_css_classes: this.extraCSSClasses(),
}
);
@@ -23,20 +22,14 @@ $(function(){
return this.planet.enemyFleets.reduce( function( memo, fleet ) { return memo + fleet.ships.size(); }, 0);
},
- creatingFleetClass: function(){
- if( this.planet.get( "creatingFleet" ) ) {
- return "creating-fleet";
- } else {
- return "no-creating-fleet";
- }
- },
+ extraCSSClasses: function(){
+ result = "";
+
+ if( this.planet.get( "creatingFleet" ) ) result += "creating-fleet";
+ if( this.planet.get( "possibleFleetDestination" ) ) result += "possible-fleet-destination";
+ if( this.planet.get( "visible" ) ) result += "visible";
- possibleFleetDestinationClass: function(){
- if( this.planet.get( "possibleFleetDestination" ) ) {
- return "possible-fleet-destination";
- } else {
- return "no-possible-fleet-destination";
- }
- }
+ return result;
+ },
});
});
@@ -10,6 +10,7 @@ $(function(){
initialize: function(opts){
this.planet = opts.planet;
this.planet.on( "change:blackstuff", this.render, this );
+ this.planet.on( "change:visible", this.render, this );
this.planet.on( "change:creatingFleet", this.updateNavyControls, this );
this.planet.ships.on( "change:selected", this.updateNavyControls, this );
@@ -37,7 +38,8 @@ $(function(){
},
render: function(){
- this.$el.html( this.template( this.planet.toJSON() ) );
+ var planetDecorator = new App.PlanetDecorator({ planet: this.planet });
+ this.$el.html( this.template( planetDecorator.toJSON() ) );
// constructions
// mine
View
@@ -4,6 +4,7 @@ $(function(){
initialize: function() {
this.on( "change:creatingFleet", this.changeCreatingFleet );
+ this.on( "change:visible", this.changeVisible );
},
creatingFleet: function(){
@@ -15,6 +16,16 @@ $(function(){
return result;
},
+ changeVisible: function( model, val ){
+ if( val ){
+ this.each( function( e ){
+ if( e != model ) {
+ e.set( "visible", false );
+ }
+ });
+ }
+ },
+
changeCreatingFleet: function( model, val, opts ){
if( val ){
this.each( function( e ){
View
@@ -8,7 +8,10 @@
dashboard: function() {
console.log( "Router.dashboard" );
- $("#wrapper #infos .planet").fadeOut( "fast", function(){
+
+ console.log( "fadeout planet" );
+ $("#wrapper #infos .planet.visible").fadeOut( "fast", function(){
+ console.log( "fadein dashboard" );
$("#wrapper #dashboard").fadeIn( "slow" );
});
@@ -18,7 +21,11 @@
planet: function( id ) {
console.log( "Router.planet", id );
+ App.Game.planets.get( id ).set( "visible", true );
+
+ console.log( "fadeout dashboard" );
$("#wrapper #dashboard").fadeOut( "fast", function(){
+ console.log( "fadein planet" );
$("#wrapper #infos #planet-info-" + id).fadeIn( "slow" );
});
View
@@ -174,7 +174,7 @@ <h1><%= id %></h1>
</script>
<script type="text/template" id="planet">
- <div id="<%= id %>" class="planet card vertical active <%= creating_fleet_class %> <%= possible_fleet_destination_class %>">
+ <div id="<%= id %>" class="planet card vertical active <%= extra_css_classes %>">
<div class="header">
<div id="icon" class="normal">☐</div>
<div id="icon" class="target">⧇</div>
@@ -347,7 +347,7 @@ <h1>parking</h1>
</script>
<script type="text/template" id="planet-info">
- <div id="planet-info-<%= id %>" class="planet folder">
+ <div id="planet-info-<%= id %>" class="planet folder <%= extra_css_classes %>">
<div id="details">
<div class="header">
<div id="icon">☐</div>

0 comments on commit c25fd2e

Please sign in to comment.