commit bb035d5c0abe29f3a581461f07d97d353ea69dda
parent aadeb45d2a4b44f15d43ed8f09c93be2b3492fb0
Author: Natasha Kerensikova <natacha@instinctive.eu>
Date: Fri, 1 Jan 2016 18:24:52 +0000
Add support for custom text format
Diffstat:
1 file changed, 24 insertions(+), 4 deletions(-)
diff --git a/config.html b/config.html
@@ -31,6 +31,7 @@
function onSubmit() {
// Set the return URL depending on the runtime environment
var return_to = getQueryParam("return_to", "pebblejs://close#");
+ var selectedFormat = document.getElementById("textFormat").value;
var options = {
"backgroundColor": document.getElementById("backgroundColorPicker").value,
"handColor": document.getElementById("handColorPicker").value,
@@ -43,14 +44,20 @@
"lowBatteryLevel": document.getElementById("lowBatteryLevel").value,
"bluetoothColor": document.getElementById("bluetoothColorPicker").value,
"bluetoothVibration": document.getElementById("bluetoothVibration").checked ? "1" : "0",
- "textFormat": encodeURIComponent(document.getElementById("textFormat").value),
+ "textFormat": encodeURIComponent(selectedFormat === "%" ? document.getElementById("customFormat").value : selectedFormat),
"textFont": document.getElementById("textFont").value,
}
document.location = return_to + encodeURIComponent(JSON.stringify(options));
}
+
+ function setCustomFormatVisibility() {
+ document.getElementById("customFormatElement").style.display
+ = (document.getElementById("textFormat").value === "%")
+ ? "block" : "none";
+ }
</script>
</head>
-<body>
+<body onload="setCustomFormatVisibility()">
<div class="item-container">
<h1 class="title">Classic Lite</h1>
</div>
@@ -124,7 +131,7 @@
</label>
<label class="item">
Format
- <select id="textFormat" class="item-select">
+ <select id="textFormat" class="item-select" onchange="setCustomFormatVisibility()">
<option class="item-select-option" value="">(disabled)</option>
<option class="item-select-option" value="Pebble">Pebble</option>
<option class="item-select-option" value="%a %d" selected>Sun 31</option>
@@ -134,8 +141,14 @@
<option class="item-select-option" value="%m %d">01 31</option>
<option class="item-select-option" value="%a %d %m">Sun 31 01</option>
<option class="item-select-option" value="%a %m %d">Sun 01 31</option>
+ <option class="item-select-option" value="%">(Custom)</option>
</select>
</label>
+ <label class="item" id="customFormatElement">
+ <div class="item-input-wrapper">
+ <input type="text" class="item-input" name="customFormat" id="customFormat" placeholder="Custom Format">
+ </div>
+ </label>
<label class="item">
Font Size
<select id="textFont" class="item-select">
@@ -168,9 +181,16 @@
document.getElementById("bluetoothColorPicker").value = getQueryParam("bluetooth", "0x000000");
document.getElementById("bluetoothVibration").checked = (parseInt(getQueryParam("vibrate", "1")) > 0);
document.getElementById("textColorPicker").value = getQueryParam("textcol", "0x000000");
- document.getElementById("textFormat").value = getQueryParam("textfmt", "Pebble");
document.getElementById("textFont").value = getQueryParam("font", "1");
+ const textFmt = getQueryParam("textfmt", "Pebble");
+ var selectElement = document.getElementById("textFormat");
+ selectElement.value = textFmt;
+ if (selectElement.value !== textFmt) {
+ selectElement.value = "%";
+ document.getElementById("customFormat").value = textFmt;
+ }
+
const versionTag = getQueryParam("v");
if (versionTag) {
document.getElementsByTagName("h1")[0].childNodes[0].nodeValue = "Classic Lite " + versionTag;
