From 2abea3644240edf6f3fab5ee1ad104c586e09c97 Mon Sep 17 00:00:00 2001
From: stoyanvi <stoyan.vi@gmail.com>
Date: Wed, 16 Apr 2014 11:36:42 +0300
Subject: [PATCH] Added "Missing API Key" view.

---
 scripts/app/app.js   |  5 -----
 scripts/app/login.js |  7 ++++++-
 styles/main.css      | 16 ++++++++++++++++
 views/noApiKey.html  |  9 +++++++++
 4 files changed, 31 insertions(+), 6 deletions(-)
 create mode 100644 views/noApiKey.html

diff --git a/scripts/app/app.js b/scripts/app/app.js
index 98ab584..3c05147 100644
--- a/scripts/app/app.js
+++ b/scripts/app/app.js
@@ -19,11 +19,6 @@ var app = (function (win) {
         return !isNullOrEmpty(key) && !regEx.test(key);
     };
 
-    if (!isKeySet(appSettings.everlive.apiKey)) {
-        alert('Backend Services API Key is not set.');
-        return;
-    }
-
     // Initialize Backend Services SDK
     var el = new Everlive({
         apiKey: appSettings.everlive.apiKey,
diff --git a/scripts/app/login.js b/scripts/app/login.js
index 8bfd377..c72e650 100644
--- a/scripts/app/login.js
+++ b/scripts/app/login.js
@@ -20,6 +20,11 @@ app.Login = (function () {
         var isAnalytics = analytics.isAnalytics();
 
         var init = function () {
+
+            if (!app.isKeySet(appSettings.everlive.apiKey)) {
+                app.mobileApp.navigate('views/noApiKey.html', 'fade');
+            }
+
             $loginUsername = $('#loginUsername');
             $loginPassword = $('#loginPassword');
 
@@ -257,7 +262,7 @@ app.Login = (function () {
         return {
             init: init,
             show: show,
-            getYear: getYear,
+            getYear: app.getYear,
             login: login,
             loginWithFacebook: loginWithFacebook,
             loginWithGoogle: loginWithGoogle,
diff --git a/styles/main.css b/styles/main.css
index 56144d8..439bc88 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -413,6 +413,22 @@
   color: #d4d4d4;
 }
 
+/* No API Key screen */
+
+#friendsApp .noapikey-scrn p {
+    line-height: 1.5;
+    color: #e4e4e4;
+}
+
+#friendsApp .noapikey-scrn p strong,
+#friendsApp .noapikey-scrn p span {
+    color: #fff;
+}
+
+#friendsApp .noapikey-scrn p span {
+    font-weight: 600;
+}
+
 /* Signup */
 
 #friendsApp .signup-view .select-wrp {
diff --git a/views/noApiKey.html b/views/noApiKey.html
new file mode 100644
index 0000000..55aa047
--- /dev/null
+++ b/views/noApiKey.html
@@ -0,0 +1,9 @@
+<div data-role="view" id="noApiKey" class="noapikey-scrn" data-layout="default">
+    <div data-role="header">
+        <div data-role="navbar">
+            <h3>Backend Services <strong>API Key</strong> is not set</h3>
+        </div>
+    </div>
+    <p><span>API Key</span> links the sample mobile app to a project in Telerik Backend Services.</p>
+  <p>To set the <span>API Key</span> open the <span>/scripts/app/settings.js</span> file and replace <strong>$EVERLIVE_API_KEY$</strong> with the <span>API Key</span> of your 'Friends' project.</p>
+</div>