Created
March 8, 2016 17:10
-
-
Save alexUXUI/5a4d54da090155d14c84 to your computer and use it in GitHub Desktop.
Modeling int'l politics with Ember.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Emberjs Computed Properties</title> | |
<!-- CDN's--> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"></script> | |
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/2.4.0/ember.min.js"></script> | |
<script src="http://builds.emberjs.com/tags/v1.10.0-beta.3/ember-template-compiler.js"></script> | |
<script src="http://builds.emberjs.com/release/ember.debug.js"></script> | |
<script src="http://builds.emberjs.com/beta/ember-data.js"></script> | |
</head> | |
<body> | |
<script type="text/javascript"> | |
App = Ember.Application.create(); | |
App.Country = Ember.Object.extend({ | |
health: null, | |
education: null, | |
military: null, | |
prosperity: Ember.computed('health', 'education', 'military', function() { | |
return this.get('health') + this.get('education') + this.get('military'); | |
}), | |
happiness: Ember.computed('health', 'education', 'military', function(){ | |
return this.get('health') * this.get('education') * this.get('military'); | |
}), | |
other: Ember.computed('happiness', 'prosperity', function(){ | |
country = this.get('happiness') * this.get('prosperity'); | |
var six = 20; | |
return country, six; | |
}), | |
grabTwoCountries: function(country1, country2){ | |
var country1 = mexico.get('health'); | |
var country2 = mexico.get('education'); | |
var total = country1 + country2; | |
return total; | |
}, | |
observeChanges: Ember.observer('happiness', function(){ | |
console.log(this.get('happiness')); | |
}), | |
updateHealth: function(value){ | |
return this.get('health') * value; | |
}, | |
getRelative: Ember.computed.alias('canada.health'), | |
}) | |
var america = App.Country.create({ | |
health: 10, | |
education: 10, | |
military: 10, | |
}) | |
var mexico = App.Country.create({ | |
health: 5, | |
education: 5, | |
military: 5, | |
}) | |
var canada = App.Country.create({ | |
health: 7, | |
education: 7, | |
military: 7, | |
}) | |
console.log(america.updateHealth(2)); | |
console.log(america.get('getRelative')); | |
america.set('health', 2) | |
america.set('prosperity', 1, 2, 1) | |
america.get('observeChanges'); | |
america.set('military', 20) | |
america.set('education', 100) | |
console.log(america.get('prosperity')) | |
console.log(mexico.get('happiness')); | |
console.log(canada.get('other')); | |
console.log(canada.grabTwoCountries(mexico, mexico)) | |
Nation = Ember.Object.extend({ | |
good: null, | |
bad: null | |
}) | |
var nationOne = Nation.create({ | |
good: 7, | |
bad: 5 | |
}) | |
var nationTwo = Nation.create({ | |
good: Ember.computed.alias('nationOne.good'), | |
bad: 3 | |
}) | |
var nationThree = Nation.create({ | |
good: Ember.computed.alias('nationTwo.good'), | |
bad: 2 | |
}) | |
console.log(nationOne.get('bad')); | |
console.log(nationTwo.get('good')); | |
world = Ember.Object.create({ | |
countries: [ | |
{ | |
name: 'america', | |
military: 10, | |
health: 9, | |
education: 7 | |
}, | |
{ | |
name: 'mexico', | |
military: 10, | |
health: 9, | |
education: 7 | |
} | |
] | |
}) | |
state = Ember.Object.extend({ | |
countries: Ember.computed.alias('world') | |
}) | |
stateComponent = state.create({ | |
world: world, | |
workWithWorld: Ember.computed('world', function(){ | |
return console.log('the world changed') | |
}) | |
}) | |
westernState = Ember.Object.extend({ | |
}) | |
usa = state.create({ | |
world: world, | |
militaryUpgrade: function(world){ | |
var countries = this.world.countries | |
for(var x = 0; x < countries.length; x = x + 1){ | |
var country = countries[x] | |
for(var i in country){ | |
if(i == 'military'){ | |
this.military = 100; | |
return console.log("BOOSTING THAT SHIT"); | |
} | |
} | |
} | |
}, | |
healthUpgrade: function(world){ | |
var countries = this.world.countries | |
for(var x = 0; x < countries.length; x = x + 1){ | |
var country = countries[x] | |
for(var i in country){ | |
if(i == 'health'){ | |
this.military = 100; | |
return console.log("we need better health!"); | |
} | |
} | |
} | |
}, | |
educationUpgrade: function(world){ | |
var countries = this.world.countries | |
for(var x = 0; x < countries.length; x = x + 1){ | |
var country = countries[x] | |
for(var i in country){ | |
if(i == 'education'){ | |
this.military = 100; | |
return console.log("we need better education!!"); | |
} | |
} | |
} | |
} | |
}) | |
console.log(stateComponent.get('world')); | |
stateComponent.get('workWithWorld') | |
console.log(world.set('', { name: 'uzbeki', good: 3, bad: 2 })); | |
stateComponent.get('workWithWorld') | |
console.log(world.set('', { name: 'jerusalem', good: 3, bad: 2 })); | |
stateComponent.get('workWithWorld') | |
console.log(mexico.set('health', 2)); | |
console.log(mexico.set('military', 2)); | |
usa.militaryUpgrade(); | |
usa.healthUpgrade(); | |
console.log(mexico.set('military', 12)); | |
console.log(mexico.set('health', 22)); | |
usa.militaryUpgrade(); | |
usa.healthUpgrade(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment