fix map view

darlingjs · Jul 28, 2013 · 7f45d99 · 7f45d99
1 parent c9d2772
commit 7f45d99
Show file tree

Hide file tree

Showing 7 changed files with 59 additions and 41 deletions.
diff --git a/game-of-pong/index.html b/game-of-pong/index.html
@@ -1,10 +1,16 @@
 <!DOCTYPE html>
 <html>
 <head>
-  <title>Simple Game Of Pong</title>
+  <title>Game of Pong on Darlingjs javascript game engine</title>
+  <link rel="stylesheet" type="text/css" media="screen" href="css/main.css">
+
+  <link rel="shortcut icon" href="../../images/logo-oldschool.ico">
+  <meta name="description" content="Darlingjs : Entity, Component, System based javascript game engine. With dependency injections and modular architecture. Inspired by Ash, AngularJS and CraftyJS." />
+  <link rel="image_src" href="https://lh3.googleusercontent.com/-YZQ1zxthtT8/UfUi-b1UQtI/AAAAAAAAfpQ/NLrs7v0y4do/s0/2013-07-28_15-56-08.png" />
+  <meta property="og:image" content="https://lh5.googleusercontent.com/-80qp7uh3EZM/UfUXEVNq6TI/AAAAAAAAfoo/twveW1uDI2A/s0/2013-07-28_15-05-19.png" />
+  <meta property="engine:author"    content="http://about.me/hyzhak" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
   <meta name="apple-mobile-web-app-capable" content="yes" />
-  <link href="css/main.css" rel="stylesheet" type="text/css">
 </head>
 <body>
   <div id="gameStage" class="game">

diff --git a/red-cabriolet/css/main.css b/red-cabriolet/css/main.css
@@ -392,12 +392,15 @@ a:active {
     opacity: 0;
 }
 
+/*Map styles*/
+
 .level-badge {
-    text-align: center;
+    /*text-align: center;*/
+    margin-bottom: 32px;
 }
 
 .level-selector {
-    float: left;
+    /*float: left;*/
+    /*width: 80px;*/
     list-style: none;
-    width: 80px;
 }
diff --git a/red-cabriolet/index.html b/red-cabriolet/index.html
@@ -1,12 +1,19 @@
 <!DOCTYPE html>
 <html ng-app="RedCabrioletGame">
 <head>
-    <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
-    <link href="css/main.css" rel="stylesheet" type="text/css">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-    <meta name="apple-mobile-web-app-capable" content="yes" />
+  <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
+  <link href="css/main.css" rel="stylesheet" type="text/css">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="apple-mobile-web-app-capable" content="yes" />
 
-    <title>Red Cabriolet</title>
+  <link rel="shortcut icon" href="../../images/logo-oldschool.ico">
+  <meta name="description" content="Darlingjs : Entity, Component, System based javascript game engine. With dependency injections and modular architecture. Inspired by Ash, AngularJS and CraftyJS." />
+
+  <link rel="image_src" href="https://lh4.googleusercontent.com/--BwdjZS5wZk/UXLxxVdcZuI/AAAAAAAAaac/ktkB6nzgF3I/s0/2013-04-20_21-31-27.png" />
+  <meta property="og:image" content="https://lh4.googleusercontent.com/--BwdjZS5wZk/UXLxxVdcZuI/AAAAAAAAaac/ktkB6nzgF3I/s0/2013-04-20_21-31-27.png" />
+  <meta property="engine:author"    content="http://about.me/hyzhak" />
+
+  <title>Red Cabriolet on DarlingJs javascript game engine</title>
 </head>
 <body ng-controller="BodyCtrl" ng-style="bodyStyle">
   <div id="fb-root"></div>

diff --git a/red-cabriolet/js/player.js b/red-cabriolet/js/player.js
@@ -87,17 +87,7 @@ game.factory('Player', ['Levels', 'localStorageService', function(Levels, localS
      */
     function getPlayedLevels() {
         for (var i = 0, count = Levels.numLevels(); i < count; i++) {
-            var level = Levels.getLevelAt(i);
-            var playedLevel = playedLevels[i];
-            if (playedLevel) {
-                level.maxScore = playedLevel.maxScore;
-                level.available = playedLevel.available;
-                level.passed = playedLevel.passed;
-            } else {
-                level.maxScore = 0;
-                level.available = false;
-                level.passed = false;
-            }
+            getPlayedLevelAt(i);
         }
 
         return Levels.getLevels();
@@ -113,9 +103,20 @@ game.factory('Player', ['Levels', 'localStorageService', function(Levels, localS
     function getPlayedLevelAt(i) {
         var level = Levels.getLevelAt(i);
         var playedLevel = playedLevels[i];
-        level.maxScore = playedLevel.maxScore;
-        level.available = playedLevel.available;
-        level.passed = playedLevel.passed;
+        if (playedLevel) {
+            level.maxScore = playedLevel.maxScore;
+            level.available = playedLevel.available;
+            level.passed = playedLevel.passed;
+            if (darlingutil.isDefined(playedLevel.maxScore) || level.available) {
+                level.imgUrl = 'https://badges.webmaker.org/badge/image/image-maker.png';
+            } else {
+                level.imgUrl = 'https://badges.webmaker.org/badge/image/i-am-a-webmaker.png';
+            }
+        } else {
+            level.maxScore = 0;
+            level.available = false;
+            level.passed = false;
+        }
 
         return level;
     }

diff --git a/red-cabriolet/partials/game.html b/red-cabriolet/partials/game.html
@@ -37,7 +37,7 @@ <h1>Level Complete</h1>
             <h1>Level Complete</h1>
             <p>Got scores: {{score}}</p>
             <div>
-              <h2>Scoreboard</h2>
+              <!--<h2>Scoreboard</h2>-->
               <fb-scoreboard ask-to-login on-login="onLogin()"></fb-scoreboard>
               <div ng-hide="isLogin">
                 <p>To store scores you need be login to game by Facebook account</p>

diff --git a/red-cabriolet/partials/map.html b/red-cabriolet/partials/map.html
@@ -3,22 +3,23 @@
   <div class="page-content">
     <h2>Map</h2>
     <a href="#/menu">Menu</a>
-    <ul>
-      <li ng-repeat="level in levels" class="level-selector">
-        <p>Level : {{level.name}}</p>
-        <p>{{level.state}}</p>
-        <div ng-switch="{{level.available}}" class="level-badge">
-          <div ng-switch-when="true">
-            <a href="#/game/{{$index}}"><img ng-src="{{level.imgUrl}}" width="32" height="32"/></a>
-            <p>score: {{level.maxScore}}</p>
-            <p>available</p>
+    <div style="margin-left: 128px">
+      <ul>
+        <li ng-repeat="level in levels" class="level-selector">
+          <p>Level : {{level.name}}</p>
+          <div ng-switch="{{level.available}}" class="level-badge">
+            <div ng-switch-when="true">
+              <a href="#/game/{{$index}}" style="margin-right: 64px;"><img ng-src="{{level.imgUrl}}" width="32" height="32"/></a>
+              <span>score: {{level.maxScore}}</span>
+              <!--<span>available</span>-->
+            </div>
+            <div ng-switch-default="">
+              <img ng-src="{{level.imgUrl}}" width="32" height="32"/>
+            </div>
           </div>
-          <div ng-switch-default="">
-            <img ng-src="{{level.imgUrl}}" width="32" height="32"/>
-          </div>
-        </div>
-      </li>
-    </ul>
+        </li>
+      </ul>
+    </div>
     <p style="clear: both">Select Level to play</p>
   </div>
 </div>
diff --git a/red-cabriolet/partials/menu.html b/red-cabriolet/partials/menu.html
@@ -4,8 +4,8 @@
     <h2>Menu</h2>
     <ul>
       <li><a href="#/map">Game</a></li>
-      <li><a href="#/status">Status</a></li>
       <li><a href="#/scoreboard">Scoreboard</a></li>
+      <!--<li><a href="#/status">Status</a></li>-->
       <li><a href="#/about">About</a></li>
     </ul>
     <div ng-cloak> Hello {{ userName }}! You have {{ myScore }} scores.</div>