CriticalDepsMirror/clay
1
0
Fork 0
mirror of https://github.com/pebble-dev/clay.git synced 2026-09-04 08:07:22 -04:00
Code Issues Packages Projects Releases Wiki Activity

enable emulator support

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
dev/custom-fn.js
-14
View File
@@ -5,21 +5,7 @@ module.exports = function() {
/** @type {ClayConfig} */ /** @type {ClayConfig} */
var Clay = window.Clay = this; 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() { Clay.on(Clay.EVENTS.AFTER_BUILD, function() {
console.debug('KEEGAN: AFTER_BUILD', this);
Clay.getItemByAppKey('cool_stuff').on('change', function() { Clay.getItemByAppKey('cool_stuff').on('change', function() {
if (this.get()) { if (this.get()) {
Clay.getItemByAppKey('background').enable(); Clay.getItemByAppKey('background').enable();
dev/emulator.html
+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>
dist/clay.js
Vendored
+22 -10
View File
@@ -348,11 +348,14 @@ var standardComponents = require('./src/scripts/components');
/** /**
* @param {string} input * @param {string} input
* @param {string} [prefix]
* @returns {string} * @returns {string}
*/ */
function encodeDataUri(input) { function encodeDataUri(input, prefix) {
prefix = typeof prefix !== 'undefined' ? prefix : 'data:text/html;base64,';
if (window.btoa) { 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 // iOS doesn't have a window so we need to polyfil window.btoa
@@ -396,7 +399,7 @@ function encodeDataUri(input) {
B64_ALPHABET.charAt(e4)); 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 * Generate the Data URI used by the config Page with settings injected
* @param {string} returnTo - used while developing on desktop.
* @return {string} * @return {string}
*/ */
Clay.prototype.generateUrl = function(returnTo) { Clay.prototype.generateUrl = function() {
var settings; var settings;
var emulator = !Pebble || Pebble.platform === 'pypkjs';
var returnTo = emulator ? '$$$RETURN_TO$$$' : 'pebblejs://close#';
try { try {
settings = JSON.parse(localStorage.getItem('clay-settings')) || {}; settings = JSON.parse(localStorage.getItem('clay-settings')) || {};
} catch (e) { } catch (e) {
@@ -450,14 +455,21 @@ Clay.prototype.generateUrl = function(returnTo) {
settings = {}; settings = {};
} }
// Show config page var compiledHtml = configPageHtml
return encodeDataUri(configPageHtml .replace('$$RETURN_TO$$', returnTo)
.replace('$$CUSTOM_FN$$', toSource(this.customFn)) .replace('$$CUSTOM_FN$$', toSource(this.customFn))
.replace('$$RETURN_TO$$', returnTo || 'pebblejs://close#')
.replace('$$CONFIG$$', toSource(this.config)) .replace('$$CONFIG$$', toSource(this.config))
.replace('$$SETTINGS$$', toSource(settings)) .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);
}; };
/** /**
index.js
+25 -10
View File
@@ -6,11 +6,14 @@ var standardComponents = require('./src/scripts/components');
/** /**
* @param {string} input * @param {string} input
* @param {string} [prefix]
* @returns {string} * @returns {string}
*/ */
function encodeDataUri(input) { function encodeDataUri(input, prefix) {
prefix = typeof prefix !== 'undefined' ? prefix : 'data:text/html;base64,';
if (window.btoa) { 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 // iOS doesn't have a window so we need to polyfil window.btoa
@@ -54,7 +57,7 @@ function encodeDataUri(input) {
B64_ALPHABET.charAt(e4)); 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 * Generate the Data URI used by the config Page with settings injected
* @param {string} returnTo - used while developing on desktop.
* @return {string} * @return {string}
*/ */
Clay.prototype.generateUrl = function(returnTo) { Clay.prototype.generateUrl = function() {
var settings; var settings;
var emulator = !Pebble || Pebble.platform === 'pypkjs';
var returnTo = emulator ? '$$$RETURN_TO$$$' : 'pebblejs://close#';
try { try {
settings = JSON.parse(localStorage.getItem('clay-settings')) || {}; settings = JSON.parse(localStorage.getItem('clay-settings')) || {};
} catch (e) { } catch (e) {
@@ -108,14 +113,24 @@ Clay.prototype.generateUrl = function(returnTo) {
settings = {}; settings = {};
} }
// Show config page var compiledHtml = configPageHtml
return encodeDataUri(configPageHtml .replace('$$RETURN_TO$$', returnTo)
.replace('$$CUSTOM_FN$$', toSource(this.customFn)) .replace('$$CUSTOM_FN$$', toSource(this.customFn))
.replace('$$RETURN_TO$$', returnTo || 'pebblejs://close#')
.replace('$$CONFIG$$', toSource(this.config)) .replace('$$CONFIG$$', toSource(this.config))
.replace('$$SETTINGS$$', toSource(settings)) .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);
}; };
/** /**