diff mpui.js @ 25:13dda1c3ae88

As we launch from a browser now, include the HTML and necessary Javascript bits for that. Also added in "docompile.html" that can be used to pre-compile the Multipaint PSJS code to a multipaint.js. Also included is a patch for Processing.js v1.4.8 that removes use for data: blob URIs that may be against many sites content security policy (CSP).
author Matti Hamalainen <ccr@tnsp.org>
date Wed, 04 Jul 2018 10:27:30 +0300
parents
children 48b74ccc1abd
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/mpui.js	Wed Jul 04 10:27:30 2018 +0300
@@ -0,0 +1,168 @@
+var mpMachine = 0;
+
+var mpMachines =
+{
+    0  : "C64 hires",
+    10 : "C64 multicolor",
+    6  : "ZX Spectrum",
+    5  : "MSX1 mode 2",
+    9  : "Plus4 hires",
+    19 : "Plus4 multicolor",
+    2  : "Amstrad CPC mode 0",
+};
+
+
+var mpSources =
+[
+  "draw_inputs.pde",
+  "draw_outputs.pde",
+  "draw_smart.pde",
+  "events.pde",
+  "exporters.pde",
+  "Interface.pde",
+  "multipaint.pde",
+  "prefread.pde",
+];
+
+
+function stGE(obname)
+{
+  return document.getElementById(obname);
+}
+
+
+function stCE(obname, obid)
+{
+  var mob = document.createElement(obname);
+  if (obid)
+    mob.id = obid;
+  return mob;
+}
+
+
+function stClearChildren(obnode)
+{
+  while (obnode.firstChild)
+    obnode.removeChild(obnode.firstChild);
+}
+
+
+function stPRE(mstr)
+{
+  return mstr.toLowerCase().replace(/[^a-z0-9]/g, "_");
+}
+
+
+function stAddEventOb(obname, evobj, evtype, evcallback, evparam)
+{
+  if (evobj == null || typeof(evobj) == 'undefined')
+  {
+    console.log("Event object '"+ obname +"' == null.");
+    return;
+  }
+
+  evobj.addEventListener(evtype, evcallback, false);
+  evobj.evparam = evparam;
+}
+
+
+function stAddEvent(obname, evtype, evcallback, evparam)
+{
+  stAddEventOb(obname, stGE(obname), evtype, evcallback, evparam);
+}
+
+
+function mpShowMachineSelector()
+{
+  var mpCanvas = stGE("mpCanvas");
+  mpCanvas.style.display = "none";
+
+  var mpUI = stGE("mpUI");
+  mobj = stCE("h2");
+  mobj.textContent = "Multipaint.JS"
+  mpUI.appendChild(mobj);
+
+  var mdiv = stCE("div");
+  mpUI.appendChild(mdiv);
+
+  mobj = stCE("p");
+  mobj.textContent = "Choose your target machine:";
+  mdiv.appendChild(mobj);
+
+  mobj = stCE("select", "machineID");
+  for (var key in mpMachines)
+  {
+    var opt = stCE("option");
+    opt.value = key;
+    opt.textContent = mpMachines[key];
+    mobj.appendChild(opt);
+  }
+  mdiv.appendChild(mobj);
+
+  mobj = stCE("button", "selectID");
+  mobj.textContent = "RUN";
+  stAddEventOb(mobj.name, mobj, "click", mpMachineSelected);
+  mdiv.appendChild(mobj);
+
+  mobj = stCE("div");
+  mobj.innerHTML = 
+  "<p><b>Things that are known NOT to work:</b></p>"+
+  "<ul>"+
+  "<li>Native Multipaint save/load</li>"+
+  "<li>Source / PRG import/export</li>"+
+  "<li>PNG/JPEG import/export</li>"+
+  "<li>Flood fill tool</li>"+
+  "<li> .. there may be bugs.</li>"+
+  "</ul>"+
+  "<p><b>NOTICE!</b> When loading/importing, you click on the load icon (or press key) and a HTML file selector button will appear "+
+  "ON THE BOTTOM. You need to click that, too. Sorry, that can't be automated because of pop-up blocking etc..</p>";
+  mpUI.appendChild(mobj);
+
+  mobj = stCE("hr");
+  mpUI.appendChild(mobj);
+}
+
+
+function mpMachineSelected()
+{
+  var mpUI = stGE("mpUI");
+  var id = stGE("machineID");
+  mpMachine = id.selectedIndex >= 0 ? id.options[id.selectedIndex].value : 0;
+  stClearChildren(mpUI);
+
+  var mpCanvas = stGE("mpCanvas");
+  mpCanvas.style.display = "block";
+
+  window.location.href = window.location.href +"?"+ mpMachine.toString();
+
+  mpRunSketch(mpCanvas);
+}
+
+
+function mpStart()
+{
+  var slink = window.location.href;
+  var spos, found = false;
+  if ((spos = slink.indexOf("?")) >= 0)
+  {
+    var tmp = parseInt(unescape(slink.substr(spos + 1)));
+    for (var key in mpMachines)
+    {
+      if (key == tmp)
+      {
+        mpMachine = key;
+        found = true;
+        break;
+      }
+    }
+  }
+
+  if (found)
+  {
+    mpRunSketch(stGE("mpCanvas"));
+  }
+  else
+  {
+    stAddEventOb("DOM", document, "DOMContentLoaded", mpShowMachineSelector);
+  }
+}