Permalink
Browse files

fleet builder

  • Loading branch information...
1 parent 2c126bc commit 38eaa02ac6a32c5bacf39459e8b0ee86d72ec306 @fguillen committed Apr 14, 2012
@@ -3,10 +3,10 @@ $(function(){
el: "#universe-controls",
events: {
- "click #synch": "synch",
- "click #pause": "pause",
- "click #step": "step",
- "click #dashboard": "dashboard",
+ "click #synch": "synch",
+ "click #pause": "pause",
+ "click #step": "step",
+ "click #dashboard": "dashboard",
},
initialize: function(opts){
@@ -3,20 +3,16 @@ $(function(){
template : _.template( $('#fleet-builder').html() ),
initialize: function( opts ){
- this.planet = opts.planet;
- this.shipsView = new App.ShipsView({ ships: this.planet.ships });
- this.planetsView
- },
-
- fadeOut: function(){
- var _self = this;
- this.$el.animate( { right: -400 }, 500, function(){ _self.remove(); } );
+ this.fleetBuilder = opts.fleetBuilder;
+ this.shipsView = new App.ShipsView({ ships: this.planet.ships });
+ this.planetsView = new App.SmallPlanetsView();
},
render: function(){
- var fleetDecorator = new App.FleetDecorator({ fleet: this.fleet });
- this.$el.html( this.template( fleetDecorator.toJSON() ) );
- this.$el.find( "ul" ).append( this.shipsView.render().el );
+ var fleetBuilderDecorator = new App.FleetBuilderDecorator({ fleetBuilder: this.fleetBuilder });
+ this.$el.html( this.template( fleetBuilderDecorator.toJSON() ) );
+ this.$el.find( "#navy ul" ).append( this.shipsView.render().el );
+ this.$el.find( "#planets ul" ).append( this.planetsView.render().el );
return this;
}
View
@@ -4,8 +4,6 @@ $(function(){
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 );
@@ -25,8 +25,6 @@ $(function(){
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";
return result;
@@ -4,14 +4,13 @@ $(function(){
template : _.template( $('#planet-info').html() ),
events: {
- "click .create-fleet": "creatingFleet"
+ "click .create-fleet": "createFleet"
},
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 );
this.planet.enemyFleets.on( "all", this.render, this );
@@ -28,14 +27,10 @@ $(function(){
}
},
- creatingFleet: function(){
- this.planet.set( "creatingFleet", true );
- App.Navigator.navigate( "dashboard", {trigger: true} );
+ createFleet: function(){
+ App.Game.createFleet( this );
},
- cancelFleet: function(){
- this.planet.set( "creatingFleet", false );
- },
render: function(){
var planetDecorator = new App.PlanetDecorator({ planet: this.planet });
@@ -1,27 +0,0 @@
-$(function(){
- App.PlanetSmallView = Backbone.View.extend({
- tagName: 'li',
- template : _.template( $('#planet-small').html() ),
-
- attributes: {
- "class": "planet-small"
- },
-
- events: {
- "click": "click"
- },
-
- initialize: function(opts){
- this.planet = opts.planet;
- },
-
- click: function(){
- console.log( "small planet click" );
- },
-
- render: function(){
- this.$el.html( this.template( this.planet.toJSON() ) );
- return this;
- }
- });
-});
View
@@ -13,8 +13,6 @@ $(function(){
initialize: function(opts){
this.planet = opts.planet;
this.planet.ships.on( "add remove", this.render, this );
- this.planet.on( "change:creatingFleet", this.render, this );
- this.planet.on( "change:possibleFleetDestination", this.render, this );
this.planet.enemyFleets.on( "all", this.render, this );
},
View
@@ -3,19 +3,9 @@ $(function(){
model: App.Planet,
initialize: function() {
- this.on( "change:creatingFleet", this.changeCreatingFleet );
this.on( "change:visible", this.changeVisible );
},
- creatingFleet: function(){
- var result =
- this.filter( function( planet ){
- return planet.get( "creatingFleet" );
- });
-
- return result;
- },
-
changeVisible: function( model, val ){
if( val ){
this.each( function( e ){
@@ -26,21 +16,6 @@ $(function(){
}
},
- changeCreatingFleet: function( model, val, opts ){
- if( val ){
- this.each( function( e ){
- if( e == model ) {
- e.set( "possibleFleetDestination", false );
- } else {
- e.set( "possibleFleetDestination", true );
- e.set( "creatingFleet", false );
- }
- });
- } else {
- this.each( function( e ){
- e.set( "possibleFleetDestination", false );
- });
- }
- },
+
});
});
@@ -1,23 +0,0 @@
-$(function(){
- App.PlanetsSmallView = Backbone.View.extend({
- tagName: 'ul',
-
- initialize: function(opts){
- this.planets = opts.planets;
- this.planets.bind( 'reset', this.addAll, this );
- this.planets.bind( 'add', this.addOne, this );
-
- this.addAll();
- },
-
- addOne: function( model ) {
- var view = new App.PlanetSmallView({ planet: model });
- this.$el.append( view.render().el );
- },
-
- addAll: function() {
- this.planets.each( $.proxy( this.addOne, this ) );
- },
-
- });
-});
View
@@ -39,6 +39,15 @@ $(function(){
App.Utils.refreshCollection( this.notices, this.get( "events" ) );
},
+ createFleet: function( planet ){
+ console.log( "Universe.createFleet" );
+
+ var fleetBuilder = new App.FleetBuilder({ planet: planet });
+ var fleetBuilderView = new App.FleetBuilderView({ fleetBuilder: fleetBuilder });
+
+ fleetBuilderView.render();
+ },
+
sendFleetToPlanet: function( planetDestination ){
var planetOrigin = this.planets.creatingFleet()[0];
var planetDestination = planetDestination;
View
@@ -355,7 +355,8 @@ strong {
color: black;
}
-#infos #details {
+#infos #details,
+#fleet-builder #details {
float: left;
width: 100px;
}
@@ -457,3 +458,7 @@ border-bottom:1px solid #ccc;
border: 10px solid transparent;
border-right-color: white;
}
+
+#fleet-builder {
+ width: 800px;
+}
View
@@ -139,35 +139,9 @@
<ul></ul>
</div> <!-- infox -->
- <div id="fleet-builder">
- <div id="navy" class="folder shadow cards-small10">
- <h1>navy</h1>
-
- <div id="controls" class="sash">
- <div class="sash-cell">
- <a href="#" class="cancel-fleet" onclick="return false;">Cancel Fleet</a>
- </div>
- </div>
- </div>
-
- <div id="planets" class="folder shadow cards4">
- <h1>planets</h1>
- <ul></ul>
- </div> <!-- planets -->
-
- <div id="admin" class="folder shadow cards4">
- <h1>admin</h1>
- Sending fleet of <strong>12</strong> ships
- from planet <strong><%= base_id %></strong>
- to planet <strong><%= destination_id %></strong>
-
- <a href="#" id="send-fleet" onclick="return false;" class="pay-button">pay <strong>100</strong> to send fleet</a>
- </div> <!-- planets -->
-
+ <div id="fleet-builder-wrapper">
</div>
-
-
</div>
</body>
@@ -472,5 +446,41 @@
</div> <!-- enemy -->
</script>
+<script type="text/template" id="fleet-builder">
+ <div class="folder">
+ <div id="details">
+ <div class="header">
+ <div id="icon">fleet <br /> builder</div>
+ </div>
+ </div>
+
+ <div id="navy" class="folder shadow cards-small10">
+ <h1>navy</h1>
+ Choose your ships:
+ <ul></ul>
+
+ <div id="controls" class="sash">
+ <div class="sash-cell">
+ <a href="#" class="cancel-fleet" onclick="return false;">Cancel Fleet</a>
+ </div>
+ </div>
+ </div>
+
+ <div id="planets" class="folder shadow cards-small4">
+ <h1>planets</h1>
+ <ul></ul>
+ </div> <!-- planets -->
+
+ <div id="admin" class="folder shadow">
+ <h1>admin</h1>
+ Sending fleet of <strong>12</strong> ships
+ from planet <strong><%= base_id %></strong>
+ to planet <strong><%= destination_id %></strong>
+
+ <a href="#" id="send-fleet" onclick="return false;" class="pay-button">pay <strong>100</strong> to send fleet</a>
+ </div> <!-- planets -->
+
+ </div>
+</script>
</html>

0 comments on commit 38eaa02

Please sign in to comment.