jio_dashboard.html 11.5 KB
<!DOCTYPE html>
<!--
Copyright 2013, Nexedi SA

This program is free software: you can Use, Study, Modify and Redistribute
it under the terms of the GNU General Public License version 3, or (at your
option) any later version, as published by the Free Software Foundation.

You can also Link and Combine this program with other software covered by
the terms of any of the Free Software licenses or any of the Open Source
Initiative approved licenses and Convey the resulting work. Corresponding
source of such a combination shall include the source code for all other
software used.

This program is distributed WITHOUT ANY WARRANTY; without even the implied
warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.

See COPYING file for full licensing terms.
See https://www.nexedi.com/licensing for rationale and options.
-->
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jIO Dashboard</title>
</head>
<body>
  <table border="1" style="width: 100%;">
    <tr>
      <th style="text-align: center;" id="script_injection_space">
      </th>
    </tr>
    <tr style="font-style:italic;">
      <th>Storage Description</th>
    </tr>
    <tr>
      <th style="width:100%;">
        <textarea id="storagedescription" rows="10"
                  style="width:98%;"></textarea>
      </th>
    </tr>
    <tr>
      <td style="text-align: center;">
        <button onclick="fillMemoryDescription()">Memory</button>
        <button onclick="fillLocalDescription()">Local</button>
        <button onclick="fillDavDescription()">WebDAV</button>
        <button onclick="fillDavBasicDescription()">WebDAV Basic</button>
        <button onclick="fillERP5Description()">ERP5</button>
        <button onclick="fillCustomDescription()">Custom</button>
        <br /><button onclick="fillLastDescription()">Last</button>
        <button onclick="loadDescription()">Load</button>
        <button onclick="saveDescription()">Save</button>
      </td>
    </tr>
    <tr>
      <th><button onclick="createJIO()">Create JIO</button></th>
    </tr>
  </table>
  <br />
  <table border="1" style="width: 100%;">
    <tr>
      <td colspan="1" style="width: 50%;">
        <label for="metadata">Metadata or Parameters:</label>
        <textarea id="metadata" rows="3" style="width: 98%;">{}</textarea>
      </td>
      <td colspan="1" style="text-align: center;">
        Options:<br />
        <textarea id="options" rows="3" style="width: 98%;">{}</textarea>
      </td>
    </tr>
    <tr>
      <td colspan="2" style="text-align: center;">
        <button onclick="command('post')">post</button>
        <button onclick="command('put')">put</button>
        <button onclick="command('get')">get</button>
        <button onclick="command('remove')">remove</button>
        - <button onclick="command('putAttachment')">putAttachment</button>
        <button onclick="command('getAttachment')">getAttachment</button>
        <button onclick="command('removeAttachment')">removeAttachment</button>
        - <button onclick="command('allDocs')">allDocs</button>
        - <button onclick="command('check')">check</button>
        <button onclick="command('repair')">repair</button>
      </td>
    </tr>
    <tr>
      <td colspan="2" style="text-align: center;">
        <label for="times">Times</label>
        <input id="times" type="text" value="1" />
        <input id="times-lock" type="checkbox" checked="1" />
        <label for="times-lock">lock</label>
      </td>
    </tr>
  </table>
  <br />
  <div style="text-align: center;">
    Useful functions:
    <button onclick="scriptLogLocalStorage()">log localStorage</button>
    <button onclick="localStorage.clear()">clear localStorage</button>
    <button onclick="scriptRemoveAllDocs()">removeAllDocs</button>
    <button onclick="scriptRepairAllDocs()">repairAllDocs</button>
  </div>
  <hr />
  <button onclick="clearlog()">Clear Log</button>
  <hr />
  <div id="log">
  </div>
  <script type="text/javascript">
    <!--
var log_color = "white";

function select(string) {
  return document.querySelector(string);
}
function logGetColor() {
  if (log_color === "white") {
    log_color = "cyan";
  } else {
    log_color = "white";
  }
  return log_color;
}
function log(o) {
  var node = document.createElement("pre");
  node.setAttribute(
    "style",
    "background-color:" + logGetColor() +
      ";margin:0;padding:0;"
  );
  if (typeof o === "string") {
    node.textContent = o;
  } else {
    node.textContent = JSON.stringify(o, null, "  ");
  }
  select("#log").appendChild(node);
}
function error(o) {
  var node = document.createElement("pre");
  node.setAttribute(
    "style",
    "background-color:" + logGetColor() +
      ";margin:0;padding:0;"
  );
  if (typeof o === "string") {
    node.textContent = o;
  } else {
    node.textContent = JSON.stringify(o);
  }
  select("#log").appendChild(node);
}
function clearlog() {
  select("#log").innerHTML = "";
}

function injectScript(url) {
  var script = document.createElement("script");
  script.setAttribute("src", url);
  document.body.appendChild(script);
}
function injectLastScripts() {
  var i, scripts = JSON.parse(localStorage.getItem("jio_dashboard_injected_scripts") || "{}");
  for (i in scripts) {
    if (i) {
      injectScript(i);
    }
  }
}
function saveScripts() {
  var scripts = {};
  [].forEach.call(document.querySelectorAll("#script_injection_space input[type=\"text\"]"), function (input) {
    return scripts[input.value] = true;
  });

  localStorage.setItem("jio_dashboard_injected_scripts", JSON.stringify(scripts));
  location.href = location.href;
}
function buildScriptFields() {
  var space, el, i, count = 0, scripts;
  function createInput(value) {
    var e = document.createElement("input");
    e.setAttribute("type", "text");
    e.setAttribute("style", "width: 98%;");
    if (value) { e.value = value; }
    count += 1;
    return e;
  }
  scripts = JSON.parse(localStorage.getItem("jio_dashboard_injected_scripts") || "{}");
  space = select("#script_injection_space");
  el = document.createElement("div");
  el.textContent = "Additional scripts:";
  space.appendChild(el);
  for (i in scripts) {
    if (i) {
      space.appendChild(createInput(i));
    }
  }
  space.appendChild(createInput());
  el = document.createElement("input");
  el.setAttribute("type", "button");
  el.value = "Save scripts and refresh page";
  el.onclick = saveScripts;
  space.appendChild(el);
}
// clear log on Alt+L
document.addEventListener("keypress", function (event) {
  if (event.altKey === true && event.charCode === 108) {
    clearlog();
  }
});
        //-->
  </script>
  <script src="../lib/rsvp/rsvp-custom.js"></script>
  <script src="../src/sha256.amd.js"></script>
  <script src="../jio.js"></script>
  <script src="../src/jio.storage/localstorage.js"></script>
  <script src="../src/jio.storage/davstorage.js"></script>
  <script src="http://git.erp5.org/gitweb/uritemplate-js.git/blob_plain/HEAD:/bin/uritemplate-min.js"></script>
  <script src="../lib/uri/URI.js"></script>
  <script src="../src/jio.storage/erp5storage.js"></script>
  <script type="text/javascript">
    <!--

var my_jio = null;

injectLastScripts();
buildScriptFields();

function fillMemoryDescription() {
  select("#storagedescription").value = JSON.stringify({
    "type": "local",
    "username": "<username>",
    "application_name": "<app_name>",
    "mode": "memory"
  }, null, "  ")
}
function fillLocalDescription() {
  select("#storagedescription").value = JSON.stringify({
    "type": "local",
    "username": "<username>",
    "application_name": "<app_name>"
  }, null, "  ")
}
function fillDavDescription() {
  select("#storagedescription").value = JSON.stringify({
    "type": "dav",
    "url": "<url>"
  }, null, "  ")
}
function fillDavBasicDescription() {
  select("#storagedescription").value = JSON.stringify({
    "type": "dav",
    "url": "<url>",
    "basic_login": "<btoa(username + ':' + password)>"
  }, null, "  ")
}
function fillERP5Description() {
  select("#storagedescription").value = JSON.stringify({
    "type": "erp5",
    "url": "<url to hateoas web site>"
  }, null, "  ")
}
function fillCustomDescription() {
  select("#storagedescription").value = JSON.stringify({
    "type": "<type>"
  }, null, "  ")
}
function fillLastDescription() {
  select("#storagedescription").value =
    localStorage.getItem("last_jio_description") || "{}";
}
function saveDescription() {
  localStorage.setItem(
    "saved_jio_description",
    select("#storagedescription").value
  );
}
function loadDescription() {
  select("#storagedescription").value =
    localStorage.getItem("saved_jio_description") || "{}";
}
fillLastDescription();

function createJIO() {
  var description;
  try {
    description = JSON.parse(select("#storagedescription").value);
    my_jio = jIO.createJIO(description);
    description = JSON.stringify(description, null, "  ");
    log("JIO created\n" + description);
    localStorage.setItem("last_jio_description", description);
  } catch (e) {
    error("Storage description is not JSON parsable");
  }
}

function logError(begin_date, err) {
  log('time : ' + (Date.now() - begin_date));
  error('return :' + JSON.stringify(err, null, "  "));
  throw err;
}

function logAnswer(begin_date, val) {
  log('time : ' + (Date.now() - begin_date));
  log('return : ' + JSON.stringify(val, null, "  "));
  return val;
}

function command(method) {
  var doc = {}, opts = {}, lock, n, jio;

  if (!my_jio) {
    error('no jio set');
    return;
  }

  jio = my_jio;

  n = parseInt(select("#times").value, 10);

  lock = select("#times-lock").checked;

  if (!lock) {
    select("#times").value = "1";
  }

  if (!isFinite(n)) {
    n = 1;
  }

  doc = select("#metadata").value;
  opts = select("#options").value;

  return jIO.util.range(n, function (index) {
    var param = doc, options = opts, begin = Date.now(), promise;

    param = param.replace(/\\u0000/g, index);
    options = options.replace(/\\u0000/g, index);

    param = JSON.parse(param);
    options = JSON.parse(options);

    if (method === "allDocs") {
      log(method + "\nopts: " + JSON.stringify(options, null, "  "));
      promise = jio.allDocs(options);
    } else {
      log(method + "\ndoc: " + JSON.stringify(param, null, "  ") +
          "\nopts: " + JSON.stringify(options, null, "  "));
      promise = jio[method](param, options);
    }

    return promise.then(function (answer) {
      n = answer;
      logAnswer(begin, answer);
      return answer;
    }, logError.bind(null, begin));
  }).then(function () { return n; }, function (e) {
    if (e instanceof Error) {
      error(e.toString());
    }
  }, console.info);
}

//////////////////////////////////////////////////////////////////////
// scripts

function scriptLogLocalStorage() {
  log("localStorage content\n" + JSON.stringify(localStorage, null, "  "));
}

function scriptRemoveAllDocs() {
  var original_metadata_value = select('#metadata').value;
  return command("allDocs").then(function (answer) {
    return jIO.util.forEach(answer.data.rows, function (row) {
      select("#metadata").value = JSON.stringify({"_id": row.id});
      var ret = command("remove");
      select('#metadata').value = original_metadata_value;
      return ret;
    });
  });
}

function scriptRepairAllDocs() {
  var original_metadata_value = select('#metadata').value;
  return command("allDocs").then(function (answer) {
    return jIO.util.forEach(answer.data.rows, function (row) {
      select("#metadata").value = JSON.stringify({"_id": row.id});
      var ret = command("repair");
      select("#metadata").value = original_metadata_value;
      return ret;
    });
  });
}
        //-->
  </script>
</body>
</html>