Smooth out bugs in IAP, check for incomplete purchases at startup

master
Skylar Ittner 8 years ago
parent a3bfeb18d1
commit 0cee4fc2f8

@ -74,8 +74,8 @@ function buycoins(productId) {
});
})
.then(function () {
loadstorefront();
showShopMessage("Thanks for your purchase!", true);
showShopMessage("Thanks for your purchase!", false);
refreshcoins();
})
.catch(function (err) {
console.log("Error: " + err.message);
@ -157,9 +157,6 @@ function setcoinhtmlfromiap(coinsjson) {
+ "</div>";
});
$('#coin-list').html(coinsHtml);
/*
[{ productId: 'com.yourapp.prod1', 'title': '...', description: '...', price: '...' }, ...]
*/
})
.catch(function (err) {
console.log(err.message);
@ -187,4 +184,12 @@ function loadstorefront() {
});
loadinventory(); // Make sure purchases stay in sync
// Put it last in case it fails, so it doesn't crash stuff badly
}
function refreshcoins() {
$.getJSON(mkApiUrl('shopitems'), function (data) {
if (data.status == 'OK') {
$('#coinbalance').text(data.balance);
}
});
}

@ -15,122 +15,151 @@
See the License for the specific language governing permissions and
limitations under the License.
-->
<div id="loading">
<div style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #324150;">
<img src="assets/logonobg.svg" alt="" style="display: block; position: absolute; max-width: 90%; top: 0; left: 0; right: 0; bottom: 25%; margin: auto; max-height: 20%;" />
<p style="font-family: sans-serif; color: white; position: absolute; max-width: 90%; left: 0; right: 0; bottom: 30%; margin: auto; text-align: center;">
Acquiring Location...
<br /><i class="fa fa-spinner fa-pulse fa-fw"></i>
<br />
<span id="loading-error"></span></p>
<div style="background: url(assets/mountains-simple.svg) repeat-x; background-size: auto 100%; height: 20%; position: absolute; bottom: 0; width: 100%;"></div>
</div>
</div>
<div id="no-lock">
<p>GPS location inaccurate.
<br /><i class="fa fa-spinner fa-pulse fa-fw"></i>
<br />
Waiting for better accuracy...</p>
</div>
<div id="overlay-main" style="display: none;">
<div id="mainCloseBtn" onclick="closeMain()"><i class="fa fa-times" ></i></div>
<div id="main-content" class="container"></div>
</div>
<div id="overlay-top">
<p id="namedisp" onclick="openMenu('profile')"></p>
<div class="progress" id="energybar-container">
<div id="energybar" class="progress-bar" role="progressbar" >
</div>
</div>
<p id="energybar-label"><i class="fa fa-bolt"></i> <i>Life</i></p>
<img src="assets/terrain/0.png" alt="" id="terrain-image" class="img-circle" />
</div>
<div id="buttons">
<div class="circlebutton" onclick="openMenu()">
<img src="assets/bars.svg" alt="Menu" />
</div>
<div class="circlebutton" onclick="scanCode()">
<img src="assets/qrcode.svg" alt="Scan Code" />
</div>
</div>
<div id="found-box" class="found-box">
<div class="found-box-title" id="found-box-title">
</div>
<div class="found-box-text" id="found-box-text">
</div>
</div>
<div id="found-box-2" class="found-box">
<div class="found-box-title" id="found-box-title-1">
</div>
<div class="found-box-text" id="found-box-text-1">
</div>
<div class="found-box-title" id="found-box-title-2">
</div>
<div class="found-box-text" id="found-box-text-2">
</div>
</div>
<div id="chatbox">
<div class="well well-sm" id="chatmsgs"></div>
<div class="input-group" style="position: absolute; left: 0px; bottom: 0px; height: 35px; width: 100%; z-index: 9501;">
<div class="input-group-btn" onclick="toggleChat()">
<div class="btn btn-info"><i class="fa fa-comments-o"></i></div>
</div>
<form id="chatsendform">
<input type="text" class="form-control" id="chatbox-input" onclick="openChat()" placeholder="Type to chat" />
</form>
</div>
</div>
<div id="map"></div>
<script>
$('#namedisp').text(username);
navigator.splashscreen.hide();
function showFoundBox(title, text) {
$('#found-box-title').text(title);
$('#found-box-text').text(text);
$('#found-box').fadeIn('fast');
setTimeout(function () {
$('#found-box').fadeOut('slow');
}, 5000);
}
function showFoundBox2(title, text, title2, text2) {
$('#found-box-title-1').text(title);
$('#found-box-text-1').text(text);
$('#found-box-title-2').text(title2);
$('#found-box-text-2').text(text2);
$('#found-box-2').fadeIn('fast');
setTimeout(function () {
$('#found-box-2').fadeOut('slow');
}, 5000);
}
$('#found-box').click(function (e) {
$('#found-box').fadeOut('fast');
});
$('#found-box-2').click(function (e) {
$('#found-box').fadeOut('fast');
});
</script>
<script src="js/location.js"></script>
<script src="js/user.js"></script>
<script>
// Show the rules
if (localStorage.getItem("intro") !== 'yes') {
openIntro();
}
<div id="loading">
<div style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #324150;">
<img src="assets/logonobg.svg" alt="" style="display: block; position: absolute; max-width: 90%; top: 0; left: 0; right: 0; bottom: 25%; margin: auto; max-height: 20%;" />
<p style="font-family: sans-serif; color: white; position: absolute; max-width: 90%; left: 0; right: 0; bottom: 30%; margin: auto; text-align: center;">
Acquiring Location...
<br /><i class="fa fa-spinner fa-pulse fa-fw"></i>
<br />
<span id="loading-error"></span></p>
<div style="background: url(assets/mountains-simple.svg) repeat-x; background-size: auto 100%; height: 20%; position: absolute; bottom: 0; width: 100%;"></div>
</div>
</div>
<div id="no-lock">
<p>GPS location inaccurate.
<br /><i class="fa fa-spinner fa-pulse fa-fw"></i>
<br />
Waiting for better accuracy...</p>
</div>
<div id="overlay-main" style="display: none;">
<div id="mainCloseBtn" onclick="closeMain()"><i class="fa fa-times" ></i></div>
<div id="main-content" class="container"></div>
</div>
<div id="overlay-top">
<p id="namedisp" onclick="openMenu('profile')"></p>
<div class="progress" id="energybar-container">
<div id="energybar" class="progress-bar" role="progressbar" >
</div>
</div>
<p id="energybar-label"><i class="fa fa-bolt"></i> <i>Life</i></p>
<img src="assets/terrain/0.png" alt="" id="terrain-image" class="img-circle" />
</div>
<div id="buttons">
<div class="circlebutton" onclick="openMenu()">
<img src="assets/bars.svg" alt="Menu" />
</div>
<div class="circlebutton" onclick="scanCode()">
<img src="assets/qrcode.svg" alt="Scan Code" />
</div>
</div>
<div id="found-box" class="found-box">
<div class="found-box-title" id="found-box-title">
</div>
<div class="found-box-text" id="found-box-text">
</div>
</div>
<div id="found-box-2" class="found-box">
<div class="found-box-title" id="found-box-title-1">
</div>
<div class="found-box-text" id="found-box-text-1">
</div>
<div class="found-box-title" id="found-box-title-2">
</div>
<div class="found-box-text" id="found-box-text-2">
</div>
</div>
<div id="chatbox">
<div class="well well-sm" id="chatmsgs"></div>
<div class="input-group" style="position: absolute; left: 0px; bottom: 0px; height: 35px; width: 100%; z-index: 9501;">
<div class="input-group-btn" onclick="toggleChat()">
<div class="btn btn-info"><i class="fa fa-comments-o"></i></div>
</div>
<form id="chatsendform">
<input type="text" class="form-control" id="chatbox-input" onclick="openChat()" placeholder="Type to chat" />
</form>
</div>
</div>
<div id="map"></div>
<script>
$('#namedisp').text(username);
navigator.splashscreen.hide();
function showFoundBox(title, text) {
$('#found-box-title').text(title);
$('#found-box-text').text(text);
$('#found-box').fadeIn('fast');
setTimeout(function () {
$('#found-box').fadeOut('slow');
}, 5000);
}
function showFoundBox2(title, text, title2, text2) {
$('#found-box-title-1').text(title);
$('#found-box-text-1').text(text);
$('#found-box-title-2').text(title2);
$('#found-box-text-2').text(text2);
$('#found-box-2').fadeIn('fast');
setTimeout(function () {
$('#found-box-2').fadeOut('slow');
}, 5000);
}
$('#found-box').click(function (e) {
$('#found-box').fadeOut('fast');
});
$('#found-box-2').click(function (e) {
$('#found-box').fadeOut('fast');
});
</script>
<script src="js/location.js"></script>
<script src="js/user.js"></script>
<script>
// Show the rules
if (localStorage.getItem("intro") !== 'yes') {
openIntro();
}
</script>
<script>
/*
* Try to restore any broken coin purchases
*/
inAppPurchase
.restorePurchases()
.then(function (data) {
console.log(data);
data.forEach(function (prod) {
if (prod.state == 2 || prod.state == 1) { // Refunded (2) or cancelled (1), let's consume it
inAppPurchase.consume(prod.type, prod.receipt, prod.signature);
} else { // Product is active
$.getJSON(mkApiUrl('processiap', 'gs'), {
os: 'android',
data: prod.receipt,
signature: prod.signature,
id: prod.productId
}, function (result) {
if (result.status == 'OK') {
inAppPurchase.consume(prod.type, prod.receipt, prod.signature);
}
});
}
});
})
.catch(function (err) {
console.log(err);
});
</script>