Browse Source

Add in-app purchases (shop), improve main menu navbar, misc. tweaks

tags/1.6.3
Skylar Ittner 2 years ago
parent
commit
a3bfeb18d1
10 changed files with 441 additions and 139 deletions
  1. 1
    0
      .gitignore
  2. 38
    53
      config.xml
  3. 2
    2
      nbproject/plugins.properties
  4. 52
    0
      www/css/main.css
  5. 190
    0
      www/js/shop.js
  6. 1
    1
      www/js/user.js
  7. 60
    60
      www/screens/inventory.html
  8. 7
    0
      www/screens/licenses.html
  9. 34
    23
      www/screens/menu.html
  10. 56
    0
      www/screens/shop.html

+ 1
- 0
.gitignore View File

@@ -1,3 +1,4 @@
1 1
 platforms/
2 2
 plugins/
3 3
 nbproject/private/
4
+/www/manifest.json

+ 38
- 53
config.xml View File

@@ -1,21 +1,5 @@
1
-<?xml version="1.0" encoding="utf-8" standalone="no"?>
2
-<!--
3
-Copyright 2016 Netsyms Technologies.
4
-
5
-Licensed under the Apache License, Version 2.0 (the "License");
6
-you may not use this file except in compliance with the License.
7
-You may obtain a copy of the License at
8
-
9
-     http://www.apache.org/licenses/LICENSE-2.0
10
-
11
-Unless required by applicable law or agreed to in writing, software
12
-distributed under the License is distributed on an "AS IS" BASIS,
13
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14
-See the License for the specific language governing permissions and
15
-limitations under the License.
16
--->
17
-
18
-<widget xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:gap="http://phonegap.com/ns/1.0" android-versionCode="104060" id="com.netsyms.terranquest.TerranQuest" version="1.4.6">
1
+<?xml version='1.0' encoding='utf-8'?>
2
+<widget android-versionCode="105002" id="com.netsyms.terranquest.TerranQuest" version="1.5.0.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:gap="http://phonegap.com/ns/1.0">
19 3
     <name>TerranQuest</name>
20 4
     <description>
21 5
         Augmented Reality fantasy game
@@ -23,45 +7,46 @@ limitations under the License.
23 7
     <author email="admin@netsyms.com" href="https://netsyms.com">
24 8
         Netsyms Technologies
25 9
     </author>
26
-    <icon src="res/icon.png"/>
27
-    <preference name="SplashScreen" value="res/splash.9.png"/>
28
-    <preference name="FadeSplashScreen" value="true"/>
29
-    <preference name="FadeSplashScreenDuration" value="2000"/>
30
-    <preference name="SplashScreenDelay" value="1000"/>
31
-    <preference name="SplashMaintainAspectRatio" value="false"/>
32
-    <preference name="SplashShowOnlyFirstTime" value="true"/>
33
-    <preference name="AutoHideSplashScreen" value="false"/>
34
-    <preference name="ShowSplashScreen" value="true"/>
10
+    <icon src="res/icon.png" />
11
+    <preference name="SplashScreen" value="res/splash.9.png" />
12
+    <preference name="FadeSplashScreen" value="true" />
13
+    <preference name="FadeSplashScreenDuration" value="2000" />
14
+    <preference name="SplashScreenDelay" value="1000" />
15
+    <preference name="SplashMaintainAspectRatio" value="false" />
16
+    <preference name="SplashShowOnlyFirstTime" value="true" />
17
+    <preference name="AutoHideSplashScreen" value="false" />
18
+    <preference name="ShowSplashScreen" value="true" />
35 19
     <platform name="browser">
36
-        <preference name="ShowSplashScreen" value="false"/>
20
+        <preference name="ShowSplashScreen" value="false" />
37 21
     </platform>
38
-    <content src="index.html"/>
39
-    <access origin="*"/>
40
-    <allow-navigation href="*"/>
41
-    <allow-intent href="http://*/*"/>
42
-    <allow-intent href="https://*/*"/>
43
-    <allow-intent href="tel:*"/>
44
-    <allow-intent href="sms:*"/>
45
-    <allow-intent href="mailto:*"/>
46
-    <allow-intent href="geo:*"/>
22
+    <content src="index.html" />
23
+    <access origin="*" />
24
+    <allow-navigation href="*" />
25
+    <allow-intent href="http://*/*" />
26
+    <allow-intent href="https://*/*" />
27
+    <allow-intent href="tel:*" />
28
+    <allow-intent href="sms:*" />
29
+    <allow-intent href="mailto:*" />
30
+    <allow-intent href="geo:*" />
47 31
     <platform name="android">
48
-        <allow-intent href="market:*"/>
32
+        <allow-intent href="market:*" />
49 33
     </platform>
50 34
     <platform name="ios">
51
-        <allow-intent href="itms:*"/>
52
-        <allow-intent href="itms-apps:*"/>
35
+        <allow-intent href="itms:*" />
36
+        <allow-intent href="itms-apps:*" />
53 37
     </platform>
54
-    <engine name="browser" spec="~4.0.0"/>
55
-    <engine name="android" spec="latest"/>
56
-    <plugin name="cordova-plugin-whitelist" spec="~1.2.1"/>
57
-    <plugin name="cordova-plugin-console" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git"/>
58
-    <plugin name="cordova-plugin-device" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git"/>
59
-    <plugin name="cordova-plugin-camera" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git"/>
60
-    <plugin name="cordova-plugin-splashscreen" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git"/>
61
-    <plugin name="cordova-plugin-network-information" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git"/>
62
-    <plugin name="cordova-plugin-dialogs" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git"/>
63
-    <plugin name="cordova-plugin-media" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git"/>
64
-    <plugin name="cordova-plugin-media-capture" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git"/>
65
-    <plugin name="cordova-plugin-geolocation" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-geolocation.git"/>
66
-    <plugin name="com.phonegap.plugins.barcodescanner" spec="https://github.com/Telerik-Verified-Plugins/BarcodeScanner"/>
38
+    <plugin name="cordova-plugin-dialogs" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git" />
39
+    <plugin name="cordova-plugin-whitelist" spec="https://github.com/apache/cordova-plugin-whitelist.git" />
40
+    <plugin name="cordova-plugin-console" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git" />
41
+    <plugin name="cordova-plugin-device" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git" />
42
+    <plugin name="cordova-plugin-camera" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git" />
43
+    <plugin name="cordova-plugin-splashscreen" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git" />
44
+    <plugin name="cordova-plugin-network-information" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git" />
45
+    <plugin name="cordova-plugin-media" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git" />
46
+    <plugin name="cordova-plugin-media-capture" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git" />
47
+    <plugin name="cordova-plugin-geolocation" spec="https://git-wip-us.apache.org/repos/asf/cordova-plugin-geolocation.git" />
48
+    <plugin name="com.phonegap.plugins.barcodescanner" spec="https://github.com/Telerik-Verified-Plugins/BarcodeScanner" />
49
+    <plugin name="cordova-plugin-inapppurchase" spec="~1.0.0" />
50
+    <engine name="browser" spec="~4.0.0" />
51
+    <engine name="android" spec="latest" />
67 52
 </widget>

+ 2
- 2
nbproject/plugins.properties View File

@@ -9,8 +9,6 @@
9 9
 # For more information about plugins see http://cordova.apache.org/blog/releases/2013/07/23/cordova-3.html
10 10
 #
11 11
 
12
-com.phonegap.plugins.barcodescanner=https://github.com/Telerik-Verified-Plugins/BarcodeScanner
13
-#phonegap-plugin-barcodescanner=https://github.com/phonegap/phonegap-plugin-barcodescanner.git
14 12
 cordova-plugin-whitelist=https://github.com/apache/cordova-plugin-whitelist.git
15 13
 cordova-plugin-splashscreen=https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git
16 14
 cordova-plugin-dialogs=https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git
@@ -21,3 +19,5 @@ cordova-plugin-geolocation=https://git-wip-us.apache.org/repos/asf/cordova-plugi
21 19
 cordova-plugin-network-information=https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git
22 20
 cordova-plugin-console=https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git
23 21
 cordova-plugin-device=https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git
22
+com.phonegap.plugins.barcodescanner=https://github.com/Telerik-Verified-Plugins/BarcodeScanner3
23
+cordova-plugin-inapppurchase=https://github.com/AlexDisler/cordova-plugin-inapppurchase

+ 52
- 0
www/css/main.css View File

@@ -384,4 +384,56 @@ body {
384 384
     left: 0;
385 385
     width: 100%;
386 386
     height: 100%;
387
+}
388
+
389
+#shopmessage {
390
+    position: fixed;
391
+    z-index: 9999;
392
+    background: rgba(0, 0, 0, .85);
393
+    border-radius: 10px;
394
+    left: 10%;
395
+    right: 10%;
396
+    top: 25%;
397
+    bottom: 25%;
398
+    height: fit-content;
399
+    max-height: 500px;
400
+    padding: 10px;
401
+    padding-top: 20px;
402
+    padding-bottom: 15px;
403
+    display: none;
404
+}
405
+
406
+.hugesymbol {
407
+    text-align: center;
408
+    margin-bottom: 20px;
409
+    display: none;
410
+}
411
+
412
+#shopmessagecontent {
413
+    font-size: 120%;
414
+    text-align: center;
415
+    margin-bottom: 10px;
416
+}
417
+
418
+#shop-balance-bar {
419
+    text-align: right;
420
+    position: fixed;
421
+    right: 10px;
422
+    background: rgba(0, 0, 0, .5);
423
+    border-radius: 5px;
424
+    z-index: 9500;
425
+    padding: 10px;
426
+}
427
+
428
+#menutablist {
429
+    z-index: 9999;
430
+    position: fixed;
431
+    width: 100%;
432
+    left: 0;
433
+    top: 0;
434
+    background: rgba(0, 0, 0, .8);
435
+}
436
+
437
+#menutabcontent {
438
+    padding-top: 85px;
387 439
 }

+ 190
- 0
www/js/shop.js View File

@@ -0,0 +1,190 @@
1
+/* 
2
+ TerranQuest - Augmented Reality fantasy game
3
+ Copyright 2016 Netsyms Technologies
4
+ 
5
+ Licensed under the Apache License, Version 2.0 (the "License");
6
+ you may not use this file except in compliance with the License.
7
+ You may obtain a copy of the License at
8
+ 
9
+ http://www.apache.org/licenses/LICENSE-2.0
10
+ 
11
+ Unless required by applicable law or agreed to in writing, software
12
+ distributed under the License is distributed on an "AS IS" BASIS,
13
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14
+ See the License for the specific language governing permissions and
15
+ limitations under the License.
16
+ */
17
+
18
+
19
+// Depending on the device, a few examples are:
20
+//   - "Android"
21
+//   - "BlackBerry"
22
+//   - "iOS"
23
+//   - "webOS"
24
+//   - "WinCE"
25
+//   - "Tizen"
26
+
27
+var DEVICE_ANDROID = 0;
28
+var DEVICE_GOOGLEPLAY = 1;
29
+var DEVICE_IOS = 2;
30
+var DEVICE_WEB = 3;
31
+var DEVICE_WINDOWS_PHONE = 5;
32
+var DEVICE_WINDOWS = 6;
33
+var DEVICE_OTHER = 10;
34
+
35
+function getPlatform() {
36
+    var devicePlatform = device.platform;
37
+    switch (devicePlatform) {
38
+        case 'Android':
39
+            return DEVICE_ANDROID;
40
+        case 'iOS':
41
+            return DEVICE_IOS;
42
+        case 'WinCE':
43
+            return DEVICE_WINDOWS_PHONE;
44
+        case 'Win32NT':
45
+            return DEVICE_WINDOWS_PHONE;
46
+        case 'Windows':
47
+            return DEVICE_WINDOWS;
48
+        case 'browser':
49
+            return DEVICE_WEB;
50
+        default:
51
+            return DEVICE_OTHER;
52
+    }
53
+}
54
+
55
+function buycoins(productId) {
56
+    if (getPlatform() == DEVICE_ANDROID) {
57
+        inAppPurchase
58
+                .buy(productId)
59
+                .then(function (data) {
60
+                    console.log(JSON.stringify(data));
61
+                    $.getJSON(mkApiUrl('processiap', 'gs'), {
62
+                        os: 'android',
63
+                        data: data.receipt,
64
+                        signature: data.signature,
65
+                        id: productId
66
+                    }, function (result) {
67
+                        if (result.status == 'OK') {
68
+                            return inAppPurchase.consume(data.type, data.receipt, data.signature);
69
+                        } else {
70
+                            showShopMessage("Error: " + result.message, true);
71
+                        }
72
+                    }).fail(function () {
73
+                        showShopMessage("Error: Lost connection to TerranQuest servers.  If your purchase does not appear within a few hours, contact support@netsyms.com.", true);
74
+                    });
75
+                })
76
+                .then(function () {
77
+                    loadstorefront();
78
+                    showShopMessage("Thanks for your purchase!", true);
79
+                })
80
+                .catch(function (err) {
81
+                    console.log("Error: " + err.message);
82
+                    showShopMessage("Error: " + err.message, true);
83
+                });
84
+
85
+    } else {
86
+        showShopMessage("Store not available on your device.  Please go to terranquest.net to purchase coins.", true);
87
+    }
88
+}
89
+
90
+function showShopMessage(msg, iserror) {
91
+    if (iserror) {
92
+        $('#hugetimessign').css('display', 'block');
93
+        $('#hugecheckmark').css('display', 'none');
94
+    } else {
95
+        $('#hugetimessign').css('display', 'none');
96
+        $('#hugecheckmark').css('display', 'block');
97
+    }
98
+    $('#shopmessagecontent').text(msg);
99
+    $('#shopmessage').css('display', 'block');
100
+}
101
+
102
+function buyitem(id, cost) {
103
+    $('#shopitem-' + id).prop('onclick', null).off('click');
104
+    $.getJSON(mkApiUrl('buyitem', 'gs'), {
105
+        merchid: id,
106
+        cost: cost
107
+    }, function (data) {
108
+        if (data.status == 'OK') {
109
+            showShopMessage(data.message, false);
110
+        } else {
111
+            showShopMessage(data.message, true);
112
+        }
113
+        loadstorefront();
114
+    });
115
+}
116
+
117
+function getmerchhtmlfromjson(item) {
118
+    var itemhtml = "\
119
+        <div class='list-group-item shop-item' id='shopitem-" + item.merchid + "'>\
120
+            <h4 class='itemname'>" + item.title + "</h4>\
121
+            <p class='itemdesc'>" + item.desc + "</p>";
122
+    itemhtml += "<span class='btn btn-success' onclick=\"buyitem('" + item.merchid + "', " + item.cost + ")\">\
123
+                            Buy Item (" + item.cost + " coins)\
124
+                         </span>\
125
+        </div>";
126
+    return itemhtml;
127
+}
128
+
129
+function getcoinhtmlfromjson(coin) {
130
+    var coinhtml = "\
131
+        <div class='list-group-item shop-item' id='coinitem-" + coin.merchid + "'>\
132
+            <h4 class='itemname'>" + coin.display + " (" + coin.coins + ")</h4>";
133
+    coinhtml += "<span class='btn btn-success' onclick=\"buycoins('" + coin.merchid + "', " + coin.cost_usd + ")\">\
134
+                            Buy Coins ($" + coin.cost_usd + ")\
135
+                         </span>\
136
+        </div>";
137
+    return coinhtml;
138
+}
139
+
140
+function setcoinhtmlfromiap(coinsjson) {
141
+    var prodIds = [];
142
+    coinsjson.forEach(function (item) {
143
+        prodIds.push(item.merchid);
144
+    });
145
+    var coinsHtml = "";
146
+    inAppPurchase.getProducts(prodIds)
147
+            .then(function (products) {
148
+                console.log(products);
149
+                products.forEach(function (prod) {
150
+                    coinsHtml += ""
151
+                            + "<div class='list-group-item shop-item' id='coinitem-" + prod.productId + "'>"
152
+                            + "<h4 class='itemname'>" + prod.title.replace(" (TerranQuest)", "") + "</h4>"
153
+                            + "<p class='itemdesc'>" + prod.description + "</p>"
154
+                            + "<span class='btn btn-success' onclick=\"buycoins('" + prod.productId + "')\">"
155
+                            + "Buy Coins (" + prod.price + ")"
156
+                            + "</span>"
157
+                            + "</div>";
158
+                });
159
+                $('#coin-list').html(coinsHtml);
160
+                /*
161
+                 [{ productId: 'com.yourapp.prod1', 'title': '...', description: '...', price: '...' }, ...]
162
+                 */
163
+            })
164
+            .catch(function (err) {
165
+                console.log(err.message);
166
+                coinsHtml = getcoinhtmlfromjson(coinsjson);
167
+                $('#coin-list').html(coinsHtml);
168
+            });
169
+}
170
+
171
+function loadstorefront() {
172
+    $.getJSON(mkApiUrl('shopitems'), function (data) {
173
+        var content = "";
174
+        if (data.status == 'OK') {
175
+            var items = data.items;
176
+            var coins = data.coins;
177
+            items.forEach(function (item) {
178
+                content += getmerchhtmlfromjson(item);
179
+            });
180
+            setcoinhtmlfromiap(coins);
181
+            $('#coinbalance').text(data.balance);
182
+        } else {
183
+            content = "<div class='list-group-item'>An error occurred.</div>";
184
+            coincode = "<div class='list-group-item'>An error occurred.</div>";
185
+        }
186
+        $('#shop-list').html(content);
187
+    });
188
+    loadinventory(); // Make sure purchases stay in sync
189
+    // Put it last in case it fails, so it doesn't crash stuff badly
190
+}

+ 1
- 1
www/js/user.js View File

@@ -79,7 +79,7 @@ setInterval(function () {
79 79
 }, 3000);
80 80
 // Send chat messages
81 81
 $("#chatsendform").submit(function (event) {
82
-    message = $('#chatbox-input').val();
82
+    var message = $('#chatbox-input').val();
83 83
     if (message !== '') {
84 84
         $.post(mkApiUrl('chat', 'cs'), {
85 85
             user: username,

+ 60
- 60
www/screens/inventory.html View File

@@ -15,64 +15,64 @@
15 15
     See the License for the specific language governing permissions and
16 16
     limitations under the License.
17 17
 -->
18
-<div class="scrollable-box">
19
-    <div class="list-group" id="inventory-list">
20
-        <div class="list-group-item">
21
-            <i class="fa fa-spinner fa-pulse fa-fw"></i> Loading...
22
-        </div>
23
-    </div>
24
-</div>
25
-
26
-<script>
27
-    function useitem(uuid) {
28
-        $('#invitem-' + uuid).prop('onclick',null).off('click');
29
-        $.getJSON(mkApiUrl('useitem', 'gs'), {
30
-            itemuuid: uuid
31
-        }, function (data) {
32
-            if (data.status === 'OK') {
33
-                loadinventory();
34
-                syncStats();
35
-            } else {
36
-                navigator.notification.alert(data.message, null, "Error", 'OK');
37
-            }
38
-        }).fail(function () {
39
-            navigator.notification.alert("Cannot use item.  Try again.", null, "Error", 'OK');
40
-        });
41
-    }
42
-
43
-    function getitemhtmlfromjson(item) {
44
-        var itemhtml = "\
45
-        <div class='list-group-item inventory-item' id='item-" + item.itemuuid + "'>\
46
-            <h4 class='itemname'>" + item.itemname + "</h4>\
47
-            <p class='itemdesc'>" + item.itemdesc + "</p>";
48
-        if (item.classname == "healmagic") {
49
-            itemhtml += "<span class='btn btn-success' id='invitem-" + item.itemuuid + "' onclick=\"useitem('" + item.itemuuid + "')\">\
50
-                            Use Item\
51
-                         </span>";
52
-        }
53
-        itemhtml += "<span class='itemid' style='display: none;'>" + item.itemid + "</span>\
54
-            <span class='itemclassid' style='display: none;'>" + item.classid + "</span>\
55
-            <span class='itemjson' style='display: none;'>" + item.itemjson + "</span>\
56
-        </div>";
57
-        return itemhtml;
58
-    }
59
-
60
-    function loadinventory() {
61
-        $.getJSON(mkApiUrl('inventory'), {
62
-            user: username
63
-        }, function (data) {
64
-            var content = "";
65
-            if (data.status == 'OK') {
66
-                items = data.items;
67
-                items.forEach(function (item) {
68
-                    content += getitemhtmlfromjson(item);
69
-                });
70
-            } else {
71
-                content = "<div class='list-group-item'>An error occurred.</div>";
72
-            }
73
-            $('#inventory-list').html(content);
74
-        });
75
-    }
76
-
77
-    loadinventory();
18
+<div class="scrollable-box">
19
+    <div class="list-group" id="inventory-list">
20
+        <div class="list-group-item">
21
+            <i class="fa fa-spinner fa-pulse fa-fw"></i> Loading...
22
+        </div>
23
+    </div>
24
+</div>
25
+
26
+<script>
27
+    function useitem(uuid) {
28
+        $('#invitem-' + uuid).prop('onclick',null).off('click');
29
+        $.getJSON(mkApiUrl('useitem', 'gs'), {
30
+            itemuuid: uuid
31
+        }, function (data) {
32
+            if (data.status === 'OK') {
33
+                loadinventory();
34
+                syncStats();
35
+            } else {
36
+                navigator.notification.alert(data.message, null, "Error", 'OK');
37
+            }
38
+        }).fail(function () {
39
+            navigator.notification.alert("Cannot use item.  Try again.", null, "Error", 'OK');
40
+        });
41
+    }
42
+
43
+    function getitemhtmlfromjson(item) {
44
+        var itemhtml = "\
45
+        <div class='list-group-item inventory-item' id='item-" + item.itemuuid + "'>\
46
+            <h4 class='itemname'>" + item.itemname + "</h4>\
47
+            <p class='itemdesc'>" + item.itemdesc + "</p>";
48
+        if (item.classname == "healmagic") {
49
+            itemhtml += "<span class='btn btn-success' id='invitem-" + item.itemuuid + "' onclick=\"useitem('" + item.itemuuid + "')\">\
50
+                            Use Item\
51
+                         </span>";
52
+        }
53
+        itemhtml += "<span class='itemid' style='display: none;'>" + item.itemid + "</span>\
54
+            <span class='itemclassid' style='display: none;'>" + item.classid + "</span>\
55
+            <span class='itemjson' style='display: none;'>" + item.itemjson + "</span>\
56
+        </div>";
57
+        return itemhtml;
58
+    }
59
+
60
+    function loadinventory() {
61
+        $.getJSON(mkApiUrl('inventory'), {
62
+            user: username
63
+        }, function (data) {
64
+            var content = "";
65
+            if (data.status == 'OK') {
66
+                var items = data.items;
67
+                items.forEach(function (item) {
68
+                    content += getitemhtmlfromjson(item);
69
+                });
70
+            } else {
71
+                content = "<div class='list-group-item'>An error occurred.</div>";
72
+            }
73
+            $('#inventory-list').html(content);
74
+        });
75
+    }
76
+
77
+    loadinventory();
78 78
 </script>

+ 7
- 0
www/screens/licenses.html View File

@@ -207,6 +207,13 @@ limitations under the License.
207 207
                 <p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
208 208
                 <p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
209 209
                 <p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
210
+                
211
+                <h4>cordova-plugin-inapppurchase</h4>
212
+                <p>The MIT License</p>
213
+                <p>Copyright (c) 2016 Alex Disler</p>
214
+                <p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
215
+                <p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
216
+                <p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
210 217
             </div>
211 218
             <div class="modal-footer">
212 219
                 <button type="button" data-dismiss="modal" class="btn btn-default"><i class="fa fa-times"></i> Close</button>

+ 34
- 23
www/screens/menu.html View File

@@ -15,27 +15,38 @@
15 15
     See the License for the specific language governing permissions and
16 16
     limitations under the License.
17 17
 -->
18
-<div>
19
-
20
-    <!-- Nav tabs -->
21
-    <ul class="nav nav-tabs" role="tablist" id="menutablist">
22
-        <li role="presentation" class="active"><a href="#inventory" aria-controls="inventory" role="tab" data-toggle="tab" id="inventory-tab">Inventory</a></li>
23
-        <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab" id="profile-tab">Profile</a></li>
24
-        <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab" id="settings-tab">Settings</a></li>
25
-    </ul>
26
-
27
-    <!-- Tab panes -->
28
-    <div class="tab-content" id="menutabcontent">
29
-        <div role="tabpanel" class="tab-pane active" id="inventory">...</div>
30
-        <div role="tabpanel" class="tab-pane" id="profile"></div>
31
-        <div role="tabpanel" class="tab-pane" id="settings">...</div>
32
-    </div>
33
-
34
-</div>
35
-<script>
36
-    $('#menutabcontent #profile').load("screens/profile.html", null, function (x) {
37
-        loadProfile(username);
38
-    });
39
-    $('#menutabcontent #settings').load("screens/settings.html");
40
-    $('#menutabcontent #inventory').load("screens/inventory.html");
18
+<div>
19
+
20
+    <!-- Nav tabs -->
21
+    <ul class="nav nav-tabs" role="tablist" id="menutablist">
22
+        <li role="presentation" class="active"><a href="#inventory" aria-controls="inventory" role="tab" data-toggle="tab" id="inventory-tab"><i class="fa fa-fw fa-cube"></i> Inventory</a></li>
23
+        <li role="presentation"><a href="#shop" aria-controls="shop" role="tab" data-toggle="tab" id="shop-tab"><i class="fa fa-fw fa-money"></i> Shop</a></li>
24
+        <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab" id="profile-tab"><i class="fa fa-fw fa-user"></i> Profile</a></li>
25
+        <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab" id="settings-tab"><i class="fa fa-fw fa-cog"></i> Settings</a></li>
26
+    </ul>
27
+
28
+    <!-- Tab panes -->
29
+    <div class="tab-content" id="menutabcontent">
30
+        <div role="tabpanel" class="tab-pane active" id="inventory">...</div>
31
+        <div role="tabpanel" class="tab-pane" id="shop"></div>
32
+        <div role="tabpanel" class="tab-pane" id="profile"></div>
33
+        <div role="tabpanel" class="tab-pane" id="settings">...</div>
34
+    </div>
35
+
36
+</div>
37
+<script>
38
+    $(window).resize(function () {
39
+        $('#menutabcontent').css('padding-top', $('#menutablist').css("height"));
40
+    });
41
+    
42
+    setInterval(function() {
43
+        $('#menutabcontent').css('padding-top', $('#menutablist').css("height"));
44
+    }, 250);
45
+
46
+    $('#menutabcontent #profile').load("screens/profile.html", null, function (x) {
47
+        loadProfile(username);
48
+    });
49
+    $('#menutabcontent #shop').load("screens/shop.html");
50
+    $('#menutabcontent #settings').load("screens/settings.html");
51
+    $('#menutabcontent #inventory').load("screens/inventory.html");
41 52
 </script>

+ 56
- 0
www/screens/shop.html View File

@@ -0,0 +1,56 @@
1
+<!--
2
+    TerranQuest - Augmented Reality fantasy game
3
+
4
+    Copyright 2016 Netsyms Technologies
5
+
6
+    Licensed under the Apache License, Version 2.0 (the "License");
7
+    you may not use this file except in compliance with the License.
8
+    You may obtain a copy of the License at
9
+
10
+      http://www.apache.org/licenses/LICENSE-2.0
11
+
12
+    Unless required by applicable law or agreed to in writing, software
13
+    distributed under the License is distributed on an "AS IS" BASIS,
14
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
+    See the License for the specific language governing permissions and
16
+    limitations under the License.
17
+-->
18
+<div class="scrollable-box">
19
+    <div id="shop-balance-bar">
20
+        Coins: <span id="coinbalance"></span>
21
+    </div>
22
+    
23
+    <h4>Items</h4>
24
+    <div class='list-group' id="shop-list">
25
+        <div class='list-group-item'>
26
+            <i class="fa fa-spinner fa-pulse fa-fw"></i> Loading...
27
+        </div>
28
+    </div>
29
+    
30
+    <h4>Coins</h4>
31
+    <div class='list-group' id="coin-list">
32
+        <div class='list-group-item'>
33
+            <i class="fa fa-spinner fa-pulse fa-fw"></i> Loading...
34
+        </div>
35
+    </div>
36
+    
37
+</div>
38
+
39
+<div id="shopmessage">
40
+    <div id="hugecheckmark" class="hugesymbol">
41
+        <i class="fa fa-5x fa-fw fa-check-circle" style="color: green;"></i>
42
+    </div>
43
+    <div id="hugetimessign" class="hugesymbol">
44
+        <i class="fa fa-5x fa-fw fa-times-circle" style="color: red;"></i>
45
+    </div>
46
+    <div id="shopmessagecontent">
47
+
48
+    </div>
49
+    <div class="btn btn-wide btn-default" onclick="$('#shopmessage').css('display', 'none')">
50
+        OK
51
+    </div>
52
+</div>
53
+<script src="js/shop.js"></script>
54
+<script>
55
+        loadstorefront();
56
+</script>