Merge pull request #3837 from bobrippling/feat/qrcode-custom

qrcode: permit custom app names

apps/qrcode/ChangeLog

@@ -4,3 +4,4 @@
 0.04: Allow scanning of QR codes from camera or file
 0.05: Change brightness on touch
 0.06: Add ability to generate contact info (MeCard format) QR code
+0.07: Add custom appname (for storing multiple QR codes)

apps/qrcode/custom.html

@@ -101,8 +101,9 @@
           <option value="2">H - High - 30%</option>
         </select>
       </div>
-    <p>Click <button id="upload" class="btn btn-primary">Upload</button></p>
+      <label for="appname">App name</label>
-
+      <input type="text" id="appname" class="form-input" value="qrcode">
+      <button id="upload" class="btn btn-primary">Upload</button>
 
       <script src="../../core/lib/customize.js"></script>
       <script src="../../core/lib/qrcode.min.js"></script><!-- https://davidshimjs.github.io/qrcodejs/ -->
@@ -263,8 +264,6 @@
             qrText = document.getElementById("text").value;
           }
 
-
-
           console.info("Given qrtext was: " + qrText);
           qrcode._htOption.text = qrText;
           qrcode._htOption.correctLevel = parseInt(document.getElementById("correction").value);
@@ -273,6 +272,7 @@
           } catch (error) {
             document.getElementById("errors").innerText="Error: QR could not be created.";
             console.error(error);
+            return;
           }
 
           targetSize = Math.min(deviceWidth - border, deviceHeight - border);
@@ -303,6 +303,7 @@
           } catch (error) {
             document.getElementById("errors").innerText="Error: QR could not be created.";
             console.error(error);
+            return;
           }
         }
 
@@ -336,17 +337,18 @@
         document.getElementById("useWIFI").addEventListener("change",refreshQRCode);
         document.getElementById("preventIntegerScaling").addEventListener("change",refreshQRCode);
         document.getElementById("correction").addEventListener("change",refreshQRCode);
+
         document.getElementById("upload").addEventListener("click", function() {
           var content = document.getElementById("text").value;
           if(document.getElementById("useWIFI").checked){
             content = document.getElementById("ssid").value
           }
-            if(!(document.getElementById("description").value === "")){
+          if(document.getElementById("description").value !== ""){
             content = document.getElementById("description").value;
           }
           var img = imageconverter.canvastoString(document.getElementsByTagName("canvas")[0],{mode:"1bit",output:"string",compression:true});
           var app = `var img = ${img};
-${ document.getElementById("preventBrightnessChangeOnTouch").checked ? '' : `var backlight = 0;
+          ${document.getElementById("preventBrightnessChangeOnTouch").checked ? '' : `var backlight = 0;
 Bangle.on('touch', function(button, xy) {
   backlight += 0.3;
   if (backlight > 1) backlight = 0;
@@ -354,19 +356,21 @@ Bangle.on('touch', function(button, xy) {
 });
 `}
 
-${document.getElementById("boostBacklight").checked ? 'Bangle.setLCDBrightness(1);' : ''}
+          ${document.getElementById("boostBacklight").checked ? 'Bangle.setLCDBrightness(1);' : ''}
-${document.getElementById("stayOn").checked ? 'Bangle.setLCDTimeout(0);' : ''}
+          ${document.getElementById("stayOn").checked ? 'Bangle.setLCDTimeout(0);' : ''}
-${document.getElementById("hideDescription").checked ? '' : `var content = ${JSON.stringify(content)};`}
+          ${document.getElementById("hideDescription").checked ? '' : `var content = ${JSON.stringify(content)};`}
 g.clear(1).setColor(1,1,1).setBgColor(0,0,0);
 g.fillRect(0,0,g.getWidth()-1,g.getHeight()-1);
 g.drawImage(img,(g.getWidth()-img[0])/2,(g.getHeight()-img[1])/2);
-${ document.getElementById("hideDescription").checked ? '' : `g.setFontAlign(0,0).setFont("6x8").setColor(0,0,0);
+          ${document.getElementById("hideDescription").checked ? '' : `g.setFontAlign(0,0).setFont("6x8").setColor(0,0,0);
 g.drawString(content,g.getWidth()/2,g.getHeight()-(g.getHeight()-img[1])/4);
 `}
 g.setColor(1,1,1);
 `;
+
+          var appname = document.getElementById("appname").value.trim() || "qrcode";
           sendCustomizedApp({
-                storage:[{name:"qrcode.app.js", url:"app.js", content:app},]
+            storage:[{name:`${appname}.app.js`, url:"app.js", content:app}]
           });
 
         });

apps/qrcode/metadata.json

@@ -2,7 +2,7 @@
   "id": "qrcode",
   "name": "Custom QR Code",
   "shortName": "QR Code",
-  "version": "0.06",
+  "version": "0.07",
   "description": "Use this to upload a customised QR code to Bangle.js",
   "icon": "app.png",
   "tags": "qrcode",