enable emulator support

This commit is contained in:
Keegan
2016-02-10 15:43:19 -08:00
parent 2142c68c01
commit 9412908636
4 changed files with 77 additions and 34 deletions
-14
View File
@@ -5,21 +5,7 @@ module.exports = function() {
/** @type {ClayConfig} */
var Clay = window.Clay = this;
Clay.on(Clay.EVENTS.BEFORE_BUILD, function() {
// register components here
this.registerComponent(require('pebble-clay-components').heading);
this.registerComponent(require('pebble-clay-components').text);
this.registerComponent(require('pebble-clay-components').footer);
this.registerComponent(require('pebble-clay-components').input);
this.registerComponent(require('pebble-clay-components').color);
this.registerComponent(require('pebble-clay-components').select);
this.registerComponent(require('pebble-clay-components').toggle);
this.registerComponent(require('pebble-clay-components').submit);
});
Clay.on(Clay.EVENTS.AFTER_BUILD, function() {
console.debug('KEEGAN: AFTER_BUILD', this);
Clay.getItemByAppKey('cool_stuff').on('change', function() {
if (this.get()) {
Clay.getItemByAppKey('background').enable();
+30
View File
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Config Page Emulator</title>
</head>
<script>
function getQueryParam(variable, defaultValue) {
var query = location.search.substring(1);
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
if (pair[0] === variable) {
return decodeURIComponent(pair[1]);
}
}
return defaultValue || null;
}
var returnTo = getQueryParam('return_to');
var data = decodeURIComponent(location.hash.substring(1));
if (data) {
data = window.atob(data).replace('$$RETURN_TO$$', returnTo);
window.location.href = 'data:text/html;base64,' + encodeURIComponent(window.btoa(data));
}
</script>
<body>
</body>
</html>
+21 -9
View File
@@ -348,11 +348,14 @@ var standardComponents = require('./src/scripts/components');
/**
* @param {string} input
* @param {string} [prefix]
* @returns {string}
*/
function encodeDataUri(input) {
function encodeDataUri(input, prefix) {
prefix = typeof prefix !== 'undefined' ? prefix : 'data:text/html;base64,';
if (window.btoa) {
return 'data:text/html;base64,' + encodeURIComponent(window.btoa(input));
return prefix + encodeURIComponent(window.btoa(input));
}
// iOS doesn't have a window so we need to polyfil window.btoa
@@ -396,7 +399,7 @@ function encodeDataUri(input) {
B64_ALPHABET.charAt(e4));
}
return 'data:text/html;base64,' + encodeURIComponent(out.join(''));
return prefix + encodeURIComponent(out.join(''));
}
/**
@@ -438,11 +441,13 @@ Clay.prototype.registerComponent = function(component) {
/**
* Generate the Data URI used by the config Page with settings injected
* @param {string} returnTo - used while developing on desktop.
* @return {string}
*/
Clay.prototype.generateUrl = function(returnTo) {
Clay.prototype.generateUrl = function() {
var settings;
var emulator = !Pebble || Pebble.platform === 'pypkjs';
var returnTo = emulator ? '$$$RETURN_TO$$$' : 'pebblejs://close#';
try {
settings = JSON.parse(localStorage.getItem('clay-settings')) || {};
} catch (e) {
@@ -450,14 +455,21 @@ Clay.prototype.generateUrl = function(returnTo) {
settings = {};
}
// Show config page
return encodeDataUri(configPageHtml
var compiledHtml = configPageHtml
.replace('$$RETURN_TO$$', returnTo)
.replace('$$CUSTOM_FN$$', toSource(this.customFn))
.replace('$$RETURN_TO$$', returnTo || 'pebblejs://close#')
.replace('$$CONFIG$$', toSource(this.config))
.replace('$$SETTINGS$$', toSource(settings))
.replace('$$COMPONENTS$$', toSource(this.components))
.replace('$$COMPONENTS$$', toSource(this.components));
if (emulator) {
return encodeDataUri(
compiledHtml,
'http://clay.pebble.com.s3-website-us-west-2.amazonaws.com/#'
);
}
return encodeDataUri(compiledHtml);
};
/**
+24 -9
View File
@@ -6,11 +6,14 @@ var standardComponents = require('./src/scripts/components');
/**
* @param {string} input
* @param {string} [prefix]
* @returns {string}
*/
function encodeDataUri(input) {
function encodeDataUri(input, prefix) {
prefix = typeof prefix !== 'undefined' ? prefix : 'data:text/html;base64,';
if (window.btoa) {
return 'data:text/html;base64,' + encodeURIComponent(window.btoa(input));
return prefix + encodeURIComponent(window.btoa(input));
}
// iOS doesn't have a window so we need to polyfil window.btoa
@@ -54,7 +57,7 @@ function encodeDataUri(input) {
B64_ALPHABET.charAt(e4));
}
return 'data:text/html;base64,' + encodeURIComponent(out.join(''));
return prefix + encodeURIComponent(out.join(''));
}
/**
@@ -96,11 +99,13 @@ Clay.prototype.registerComponent = function(component) {
/**
* Generate the Data URI used by the config Page with settings injected
* @param {string} returnTo - used while developing on desktop.
* @return {string}
*/
Clay.prototype.generateUrl = function(returnTo) {
Clay.prototype.generateUrl = function() {
var settings;
var emulator = !Pebble || Pebble.platform === 'pypkjs';
var returnTo = emulator ? '$$$RETURN_TO$$$' : 'pebblejs://close#';
try {
settings = JSON.parse(localStorage.getItem('clay-settings')) || {};
} catch (e) {
@@ -108,14 +113,24 @@ Clay.prototype.generateUrl = function(returnTo) {
settings = {};
}
// Show config page
return encodeDataUri(configPageHtml
var compiledHtml = configPageHtml
.replace('$$RETURN_TO$$', returnTo)
.replace('$$CUSTOM_FN$$', toSource(this.customFn))
.replace('$$RETURN_TO$$', returnTo || 'pebblejs://close#')
.replace('$$CONFIG$$', toSource(this.config))
.replace('$$SETTINGS$$', toSource(settings))
.replace('$$COMPONENTS$$', toSource(this.components))
.replace('$$COMPONENTS$$', toSource(this.components));
// if we are in the emulator then we need to proxy the data via a webpage to
// obtain the return_to.
// @todo calculate this from the Pebble object or something
if (emulator) {
return encodeDataUri(
compiledHtml,
'http://clay.pebble.com.s3-website-us-west-2.amazonaws.com/#'
);
}
return encodeDataUri(compiledHtml);
};
/**