Skip to content

Instantly share code, notes, and snippets.

@colthreepv

colthreepv/app.js

Created October 19, 2013 13:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save colthreepv/7056200 to your computer and use it in GitHub Desktop.
Save colthreepv/7056200 to your computer and use it in GitHub Desktop.
Download ZIP
AngularJS mocked backend demonstration, step-1
Raw
app.js
angular.module('app', ['appMock'])
.controller('BodyController', function ($scope, $http) {
$scope.games = [];
// function bound to the refrsh button
$scope.refresh = function () {
$http.get('/games').success(function (data, status, headers, config) {
$scope.games = data;
});
};
$scope.refresh();
});
Raw
index.html
<!DOCTYPE html>
<html ng-app="app">
<head>
<link data-require="bootstrap-css@3.0.0" data-semver="3.0.0" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<script data-require="angular.js@1.2.0-rc3-nonmin" data-semver="1.2.0-rc3-nonmin" src="http://code.angularjs.org/1.2.0-rc.3/angular.js"></script>
<script src="http://code.angularjs.org/1.2.0-rc.3/angular-mocks.js"></script>
<script src="mock.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="BodyController">
<div class="jumbotron">
<div class="container">
<h1>Top 100 Games Evah!</h1>
<p>
<button class="btn btn-success" ng-click="refresh()">
<i class="glyphicon glyphicon-refresh"></i>
<span>refresh</span>
</button>
</p>
</div>
</div>
<div class="container">
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>Videogame</th>
<th>Year</th>
<th>randomScore</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="game in games | orderBy:'position'">
<th>{{ game.position }}</th>
<th>{{ game.name }}</th>
<th>{{ game.year }}</th>
<th>{{ game.score }}</th>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Raw
mock.js
angular.module('appMock', ['ngMockE2E'])
// Gently stolen from http://www.imdb.com/list/3rOZHHY7HCc/
.constant('gamesArray', [{"name":"The Legend of Zelda: Majora's Mask","year":2000},{"name":"Metal Gear Solid","year":1998},{"name":"Resident Evil 4","year":2005},{"name":"Star Wars: Knights of the Old Republic","year":2003},{"name":"Half-Life 2","year":2004},{"name":"Shenmue II","year":2001},{"name":"Mass Effect 2","year":2010},{"name":"Metal Gear Solid 4: Guns of the Patriots","year":2008},{"name":"Super Mario Galaxy 2","year":2010},{"name":"Kingdom Hearts II","year":2005},{"name":"Heavy Rain","year":2010},{"name":"Fallout 3","year":2008},{"name":"Metal Gear Solid 3: Subsistence","year":2005},{"name":"BioShock","year":2007},{"name":"The Legend of Zelda: Ocarina of Time","year":1998},{"name":"Half-Life 2: Episode Two","year":2007},{"name":"Portal 2","year":2011},{"name":"Yakuza 3","year":2009},{"name":"The Legend of Zelda: Twilight Princess","year":2006},{"name":"Grand Theft Auto V","year":2013},{"name":"Grand Theft Auto: San Andreas","year":2004},{"name":"Mass Effect","year":2007},{"name":"Tomb Raider","year":2013},{"name":"Batman: Arkham City","year":2011},{"name":"Mass Effect 3","year":2012},{"name":"The Last of Us","year":2013},{"name":"Super Smash Bros. Brawl","year":2008},{"name":"Uncharted 2: Among Thieves","year":2009},{"name":"Grand Theft Auto IV","year":2008},{"name":"Metal Gear Solid 2: Sons of Liberty","year":2001},{"name":"Super Smash Bros. Melee","year":2001},{"name":"Star Wars: Knights of the Old Republic II - The Sith Lords","year":2004},{"name":"Gears of War 2","year":2008},{"name":"Silent Hill 3","year":2003},{"name":"Splinter Cell: Chaos Theory","year":2005},{"name":"Super Mario Bros.","year":1985},{"name":"Batman: Arkham Asylum","year":2009},{"name":"The Legend of Zelda","year":1986},{"name":"God of War II","year":2007},{"name":"LittleBigPlanet","year":2008},{"name":"Assassin's Creed II","year":2009},{"name":"Shin Megami Tensei: Persona 4","year":2008},{"name":"The Elder Scrolls V: Skyrim","year":2011},{"name":"Uncharted 3: Drake's Deception","year":2011},{"name":"Portal","year":2007},{"name":"Infamous 2","year":2011},{"name":"Splinter Cell","year":2002},{"name":"Ratchet & Clank: Going Commando","year":2003},{"name":"Gran Turismo 3: A-Spec","year":2001},{"name":"Metroid Prime 3: Corruption","year":2007},{"name":"Tomb Raider II Starring Lara Croft","year":1997},{"name":"Grand Theft Auto IV: The Ballad of Gay Tony","year":2009},{"name":"Beyond: Two Souls","year":2013},{"name":"Halo 3","year":2007},{"name":"The Elder Scrolls IV: Oblivion","year":2006},{"name":"Uncharted: Drake's Fortune","year":2007},{"name":"Devil May Cry","year":2001},{"name":"Ratchet & Clank Future: Tools of Destruction","year":2007},{"name":"LittleBigPlanet 2","year":2011},{"name":"Bully","year":2006},{"name":"Splinter Cell: Conviction","year":2010},{"name":"God of War III","year":2010},{"name":"Half-Life 2: Episode One","year":2006},{"name":"Grand Theft Auto: Vice City","year":2002},{"name":"Prince of Persia: The Sands of Time","year":2003},{"name":"Fallout: New Vegas","year":2010},{"name":"Assassin's Creed","year":2007},{"name":"Jak 3","year":2004},{"name":"Soulcalibur II","year":2003},{"name":"Splinter Cell: Pandora Tomorrow","year":2004},{"name":"Grand Theft Auto 3","year":2001},{"name":"Gears of War 3","year":2011},{"name":"Deus Ex: Human Revolution","year":2011},{"name":"L.A. Noire","year":2011},{"name":"The Simpsons: Hit & Run","year":2003},{"name":"Ratchet & Clank","year":2002},{"name":"Super C","year":1988},{"name":"Saints Row IV","year":2013},{"name":"Max Payne","year":2001},{"name":"Mercenaries: Playground of Destruction","year":2005},{"name":"Pikmin 3","year":2013},{"name":"Call of Duty 4: Modern Warfare","year":2007},{"name":"Grand Theft Auto IV: The Lost and Damned","year":2009},{"name":"God of War: Ghost of Sparta","year":2010},{"name":"Tekken Tag Tournament 2","year":2012},{"name":"Halo 2","year":2004},{"name":"Heavenly Sword","year":2007},{"name":"Crash Bandicoot: Warped","year":1998},{"name":"Max Payne 2: The Fall of Max Payne","year":2003},{"name":"The Legend of Zelda: The Wind Waker","year":2002},{"name":"Red Dead Redemption","year":2010},{"name":"Virtua Fighter 5","year":2007},{"name":"Halo","year":2001},{"name":"Kingdom Hearts","year":2002},{"name":"Resistance: Fall of Man","year":2006},{"name":"Dead or Alive 3","year":2001},{"name":"Ninja Gaiden 3","year":2012},{"name":"Sonic the Hedgehog","year":1991},{"name":"ZombiU","year":2012},{"name":"ESPN NFL 2K5","year":2004}])
// mock backend definitions goes there!
.run(function ($httpBackend, gamesArray) {
// Defining GET /games
$httpBackend.whenGET('/games').respond(function (method, url, data, headers) {
var positions = [],
randomGames;
for (var i = 0; i < 100; i++) {
positions.push(i+1);
}
randomGames = gamesArray.map(function (game, index) {
game.position = positions.splice(Math.floor(Math.random() * positions.length), 1)[0];
game.score = (1 + Math.random() * 9).toPrecision(3) + '/10';
return game;
});
return [200, randomGames];
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment