Browse code
Add a configuration page to input server URL and form field name
Natasha Kerensikova authored on12/03/2016 19:55:32 Showing3 changed files
| 12 | 13 |
new file mode 100644 |
| ... | ... |
@@ -0,0 +1,87 @@ |
| 1 |
+<!DOCTYPE html> |
|
| 2 |
+<html lang="en"> |
|
| 3 |
+<head> |
|
| 4 |
+ <meta charset="UTF-8"> |
|
| 5 |
+ <title></title> |
|
| 6 |
+ <link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/pebble/slate/v0.0.3/dist/css/slate.min.css"> |
|
| 7 |
+ <style> |
|
| 8 |
+ .title {
|
|
| 9 |
+ padding: 15px 10px; |
|
| 10 |
+ text-transform: uppercase; |
|
| 11 |
+ font-family: "PT Sans", sans-serif; |
|
| 12 |
+ font-size: 1.2em; |
|
| 13 |
+ font-weight: 500; |
|
| 14 |
+ color: 0x888888; |
|
| 15 |
+ text-align: center; |
|
| 16 |
+ } |
|
| 17 |
+ |
|
| 18 |
+ .item-draggable-list .delete-item {
|
|
| 19 |
+ right: 45px; |
|
| 20 |
+ } |
|
| 21 |
+ </style> |
|
| 22 |
+ <script> |
|
| 23 |
+ function getQueryParam(variable, defaultValue) {
|
|
| 24 |
+ var query = location.search.substring(1); |
|
| 25 |
+ var vars = query.split("&");
|
|
| 26 |
+ for (var i = 0; i < vars.length; i++) {
|
|
| 27 |
+ var pair = vars[i].split("=");
|
|
| 28 |
+ if (pair[0] === variable) {
|
|
| 29 |
+ return decodeURIComponent(pair[1]); |
|
| 30 |
+ } |
|
| 31 |
+ } |
|
| 32 |
+ return defaultValue; |
|
| 33 |
+ } |
|
| 34 |
+ |
|
| 35 |
+ function onSubmit() {
|
|
| 36 |
+ // Set the return URL depending on the runtime environment |
|
| 37 |
+ var return_to = getQueryParam("return_to", "pebblejs://close#");
|
|
| 38 |
+ var options = {
|
|
| 39 |
+ "url": document.getElementById("url").value,
|
|
| 40 |
+ "dataField": document.getElementById("dataField").value,
|
|
| 41 |
+ } |
|
| 42 |
+ |
|
| 43 |
+ console.log("returning " + JSON.stringify(options));
|
|
| 44 |
+ document.location = return_to + encodeURIComponent(JSON.stringify(options)); |
|
| 45 |
+ } |
|
| 46 |
+ </script> |
|
| 47 |
+</head> |
|
| 48 |
+<body> |
|
| 49 |
+ <div class="item-container"> |
|
| 50 |
+ <h1 class="title">Health Export</h1> |
|
| 51 |
+ </div> |
|
| 52 |
+ |
|
| 53 |
+ <div class="item-container"> |
|
| 54 |
+ <div class="item-container-header">Endpoint URL</div> |
|
| 55 |
+ <div class="item-container-content"> |
|
| 56 |
+ <label class="item"> |
|
| 57 |
+ <input type="text" class="item-input" name="url" id="url" placeholder="http://example.com/post/path"> |
|
| 58 |
+ </label> |
|
| 59 |
+ </div> |
|
| 60 |
+ </div> |
|
| 61 |
+ |
|
| 62 |
+ <div class="item-container"> |
|
| 63 |
+ <div class="item-container-header">Data Field Name</div> |
|
| 64 |
+ <div class="item-container-content"> |
|
| 65 |
+ <label class="item"> |
|
| 66 |
+ <input type="text" class="item-input" name="dataField" id="dataField"> |
|
| 67 |
+ </label> |
|
| 68 |
+ </div> |
|
| 69 |
+ </div> |
|
| 70 |
+ |
|
| 71 |
+ <div class="item-container"> |
|
| 72 |
+ <div class="button-container"> |
|
| 73 |
+ <input id="submitButton" type="button" class="item-button" value="SUBMIT" onClick="onSubmit()"> |
|
| 74 |
+ </div> |
|
| 75 |
+ </div> |
|
| 76 |
+ |
|
| 77 |
+ <script src="https://cdn.rawgit.com/pebble/slate/v0.0.3/dist/js/slate.min.js"></script> |
|
| 78 |
+ <script> |
|
| 79 |
+ const versionTag = getQueryParam("v");
|
|
| 80 |
+ if (versionTag) {
|
|
| 81 |
+ document.getElementsByTagName("h1")[0].childNodes[0].nodeValue = "Health Export " + versionTag;
|
|
| 82 |
+ } |
|
| 83 |
+ document.getElementById("url").value = getQueryParam("url", "");
|
|
| 84 |
+ document.getElementById("dataField").value = getQueryParam("data_field", "");
|
|
| 85 |
+ </script> |
|
| 86 |
+</body> |
|
| 87 |
+</html> |
| ... | ... |
@@ -14,9 +14,12 @@ |
| 14 | 14 |
* OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. |
| 15 | 15 |
*/ |
| 16 | 16 |
|
| 17 |
+var cfg_endpoint = null; |
|
| 18 |
+var cfg_data_field = null; |
|
| 19 |
+ |
|
| 17 | 20 |
Pebble.addEventListener("ready", function() {
|
| 18 | 21 |
console.log("Health Export PebbleKit JS ready!");
|
| 19 |
- Pebble.sendAppMessage({ "lastSent": 0, "modalMessage": "Not configured" });
|
|
| 22 |
+ Pebble.sendAppMessage({ "modalMessage": "Not configured" });
|
|
| 20 | 23 |
}); |
| 21 | 24 |
|
| 22 | 25 |
Pebble.addEventListener("appmessage", function(e) {
|
| ... | ... |
@@ -25,3 +28,33 @@ Pebble.addEventListener("appmessage", function(e) {
|
| 25 | 28 |
Pebble.sendAppMessage({ "lastSent": e.payload.dataKey });
|
| 26 | 29 |
} |
| 27 | 30 |
}); |
| 31 |
+ |
|
| 32 |
+Pebble.addEventListener("showConfiguration", function() {
|
|
| 33 |
+ var settings = "?v=1.0"; |
|
| 34 |
+ |
|
| 35 |
+ if (cfg_endpoint) {
|
|
| 36 |
+ settings += "&url=" + encodeURIComponent(cfg_endpoint); |
|
| 37 |
+ } |
|
| 38 |
+ if (cfg_data_field) {
|
|
| 39 |
+ settings += "&data_field=" + encodeURIComponent(cfg_data_field); |
|
| 40 |
+ } |
|
| 41 |
+ |
|
| 42 |
+ Pebble.openURL("https://cdn.rawgit.com/faelys/pebble-health-export/v1.0/config.html" + settings);
|
|
| 43 |
+}); |
|
| 44 |
+ |
|
| 45 |
+Pebble.addEventListener("webviewclosed", function(e) {
|
|
| 46 |
+ var configData = JSON.parse(decodeURIComponent(e.response)); |
|
| 47 |
+ var wasConfigured = (cfg_endpoint && cfg_data_field); |
|
| 48 |
+ |
|
| 49 |
+ if (configData.url) {
|
|
| 50 |
+ cfg_endpoint = configData.url; |
|
| 51 |
+ } |
|
| 52 |
+ |
|
| 53 |
+ if (configData.dataField) {
|
|
| 54 |
+ cfg_data_field = configData.dataField; |
|
| 55 |
+ } |
|
| 56 |
+ |
|
| 57 |
+ if (!wasConfigured && cfg_endpoint && cfg_data_field) {
|
|
| 58 |
+ Pebble.sendAppMessage({ "lastSent": 0 });
|
|
| 59 |
+ } |
|
| 60 |
+}); |