<commit_before><!--	
  Loki Sandbox :
  To support LokiJS project at  : https://github.com/techfort/LokiJS

  This web page is designed to allow you to experiment with loki and/or inspect existing saved loki database files.

  You can experiment, running queries on the default sample database or load a saved database from
  your filesystem, and inspect and/or run queries on it to inspect results.
-->
<!DOCTYPE html>
<html>
<head>
    <title>Loki Sandbox</title>

    <script src="../../src/lokijs.js"></script>
    <script src="../../src/loki-indexed-adapter.js"></script>
    <script src="jquery-2.1.0.min.js"></script>
    <script src="sandbox.min.js"></script>
    <link rel="stylesheet" href="sandbox.min.css">

    <style>
      body {
          margin: 0;
          font-family: 'Segoe UI', 'sans-serif';
      }
      a:link
      {
        color: #99F;
        text-decoration: none;
        font-size: 14pt;
      }
      a:hover
      {
        color: #77F;
        text-decoration: underline;
      }
      a:visited
      {
        color: #99F;
      }
      input.vpatel[type=radio], input.vpatel[type=checkbox] {
        display:none;
      }

      input.vpatel[type=radio] + label, input.vpatel[type=checkbox] + label {
        display:inline-block;
        margin:-2px;
        padding: 4px 12px;
        margin-bottom: 0;
        font-size: 14px;
        line-height: 20px;
        color: #333;
        text-align: center;
        text-shadow: 0 1px 1px rgba(255,255,255,0.75);
        vertical-align: middle;
        cursor: pointer;
        background-color: #f5f5f5;
        background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
        background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
        background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
        background-image: -o-linear-gradient(top,#fff,#e6e6e6);
		    background-image: linear-gradient(to bottom,#fff,#e6e6e6);
		    background-repeat: repeat-x;
		    border: 1px solid #ccc;
		    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
		    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
		    border-bottom-color: #b3b3b3;
		    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
		    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
		    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
		    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
		    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
      }

      input.vpatel[type=radio]:checked + label, input.vpatel[type=checkbox]:checked + label{
        background-image: none;
		    outline: 0;
		    -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
		    -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
		    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
			    background-color:#c8c8c8;
      }
      button.minimal {
        background: #e3e3e3;
        border: 1px solid #bbb;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
        -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
        box-shadow: inset 0 0 1px 1px #f6f6f6;
        color: #333;
        font: bold 20px "helvetica neue", helvetica, arial, sans-serif;
        line-height: 1;
        padding: 8px 0 9px;
        text-align: center;
        text-shadow: 0 1px 0 #fff;
        width: 150px; 
      }
      button.minimal:hover {
        background: #d9d9d9;
        -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
        -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        cursor: pointer; 
      }
      button.minimal:active {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000; 
      }
    </style>
</head>

<body style="background-color:#444; color:#fff">

  <h1 style="font-family:'Segoe UI', 'sans-serif'">Loki Sandbox</h3>

  <div id="divLokiCode">
  </div>

  <div id="divLoader" style="position:absolute; top:10px; right: 420px">
    <i>Import database : </i> <input style='height:30px; width:200px;' id='file-import' type="file" onchange="dbImport()" />
  </div>

  <div style="position: absolute; top:10px; right:10px">
    <input class="vpatel" type="radio" id="radio1" name="radios" value="all" checked onclick="tabMode(1)">
    <label for="radio1">Text Output</label>
    <input class="vpatel" type="radio" id="radio2" name="radios" value="false" onclick="tabMode(2)">
    <label for="radio2">Object Inspector</label>
    <input class="vpatel" type="radio" id="radio3" name="radios" value="true" onclick="tabMode(3)">
    <label for="radio3">Save / Load</label>
    <input class="vpatel" type="radio" id="radio4" name="radios" value="true" onclick="tabMode(4)">
    <label for="radio4">About</label>
  </div>

  <table width="100%" style="table-layout:fixed">
    <tr>
      <td width="50%" valign="top">
        <h2 style="font-family:'Segoe UI', 'sans-serif'">Sandbox Editor</h2>
        <div id="divLokiEditor">
          <textarea id="jsedit"></textarea>
          <br />
          <button class="minimal" style="width:140px" onclick="runloki();">Run</button>
        </div>
      </td>
      <td width="50%" valign="top">
        <div id="divTextOutput">
          <h2 style="font-family:'Segoe UI', 'sans-serif'">Text Output</h2>
          
          <div id="divText">
            <textarea id="lsoutput"></textarea>
          </div>
        </div>
        <div id="divInspector" style="display:none">
          <h2>Object Inspector</h2>
          <div id="divInspect" style="overflow-y:auto">
            <div id="divPrettyPrint">
            </div>
          </div>
          <br/>
          <button class="minimal" onclick="console.log(db)" style="width:220px">Log db to Console</button>
        </div>
        <div id="divSaveLoad" style="display:none; padding: 20px">
          <h2>Save / Load</h2>
          <br/>
          <table width="100%">
            <tr>
              <td valign="top">
                <label>Script name : </label><br/>
                <input id="txtScriptName" type='text' style="font-size:16px; height:24px; width:200px" value="lokiscript1"/><br/><br/>
                <button class="minimal" onclick="saveLokiScript()">Save</button>
              </td>
              <td valign="top">
                <label>Stored Scripts :</label><br/>
                <select id="selScriptList" size=8 style="font-size:16pt; min-width:200px"></select>
                <br/><br/>
                <button class="minimal" onclick="loadLokiScript()">Load</button><br/><br/>
                <button class="minimal" onclick="deleteLokiScript()">Delete</button>
              </td>
            </tr>
          </table>
        </div>
        <div id="divAbout" style="display:none; padding: 20px">
          <h2>About Loki Sandbox 0.2.0</h2>
          <p style="font-size:18px">
              Loki Sandbox is a simple utility web page which lets you experiment with LokiJS using a browser environment.
              An example database is created by default (in memory), along with sample javascript interaction to populate, query, and sandbox logging capabilities.
          </p>
          <p style="font-size:18px">
            If you have databases which have been saved to the filesystem (from node.js, node webkit, or cordova), you load load them and inspect and/or
            query their contents.
          <p style="font-size:18px">
            This utility page is to support <a href="http://lokijs.org" target="_blank">LokiJS</a>.<br /><br/>
            You can also view the <a href="https://github.com/techfort/LokiJS" target="_blank">GitHub page</a>.
          </p>
          <p>
            Some example logging commands are :<br/>
            <code>
              logText(message);<br/>
              logObject(obj);<br/>
              inspectObject(obj);<br/>
              alertify.log(message);<br/><br/>
            </code>
            alertify is a bundled library, click <a href="http://fabien-d.github.io/alertify.js/" target="_blank">here</a> to learn more of its capability.
          </p>
        </div>
        <br/>
      </td>
    </tr>
  </table>

  <script>
    var db = new loki('sandbox.db');
    
    // we will use loki indexed adapter as a generic app/key/value store
    // we will store scripts instead of serialized loki databases in our 'sandbox' 'app'
    var sandboxAdapter = new LokiIndexedAdapter('sandbox');

    var sbv = {
      editorJS: null,
      editorOutput: null,
    }

    // used to retrieve hash (#) parameters 
    function getHashParameter (sParam) {
      var sPageURL = window.location.hash.substring(1);

      var sURLVariables = sPageURL.split('&');
      for (var i = 0; i < sURLVariables.length; i++) {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] === sParam) {
          return decodeURIComponent(sParameterName[1]);
        }
      }
    }
    
    // let's user go to different tabs via 
    function tabMode(mode) {
      $("#divTextOutput").hide();
      $("#divInspector").hide();
      $("#divSaveLoad").hide();
      $("#divAbout").hide();

      switch(mode) {
        case 1 : $("#divTextOutput").show(); break;
        case 2 : $("#divInspector").show(); break;
        case 3 : $("#divSaveLoad").show(); break;
        case 4 : $("#divAbout").show(); break;
      }
    }

    $(document).ready(function () {
      // Help user quickly identify errors in their code by displaying alert with msg, line and col
      window.onerror = function (msg, url, line, col, error) {
          alertify.error(msg + " (line " + line + " col " + col + ")");
      };

      $(window).resize(function () {
          if (typeof (windowResize) == typeof (Function)) windowResize();
      });

      $("body").css("background-color", "#222");

      setupEditor();
      
      loadScriptList();
      
      // if the user specifies a rawgist hash parameter, attempt to load and run that gist (url)
      var rawgist = getHashParameter("rawgist");
      if (rawgist && rawgist !== "") {
        if (rawgist.indexOf("https://gist.githubusercontent.com") !== 0) {
          console.log("only allowing ajax fetch to gist.githubusercontent.com");
        }

        console.log ("loading rawgist : " + rawgist);

        var oReq = new XMLHttpRequest();
        oReq.addEventListener("load", gistLoaded);
        oReq.open("GET", rawgist);
        oReq.send();
      }
      else {
        setTimeout(function() {
          windowResize();
          runloki();
        }, 250);
      }
    });

    function loadScriptList() {
      if (!sandboxAdapter.checkAvailability()) {<commit_msg>if running loki sandbox locally without indexeddb support, don't use adapter<commit_after><!--	
  Loki Sandbox :
  To support LokiJS project at  : https://github.com/techfort/LokiJS

  This web page is designed to allow you to experiment with loki and/or inspect existing saved loki database files.

  You can experiment, running queries on the default sample database or load a saved database from
  your filesystem, and inspect and/or run queries on it to inspect results.
-->
<!DOCTYPE html>
<html>
<head>
    <title>Loki Sandbox</title>

    <script src="../../src/lokijs.js"></script>
    <script src="../../src/loki-indexed-adapter.js"></script>
    <script src="jquery-2.1.0.min.js"></script>
    <script src="sandbox.min.js"></script>
    <link rel="stylesheet" href="sandbox.min.css">

    <style>
      body {
          margin: 0;
          font-family: 'Segoe UI', 'sans-serif';
      }
      a:link
      {
        color: #99F;
        text-decoration: none;
        font-size: 14pt;
      }
      a:hover
      {
        color: #77F;
        text-decoration: underline;
      }
      a:visited
      {
        color: #99F;
      }
      input.vpatel[type=radio], input.vpatel[type=checkbox] {
        display:none;
      }

      input.vpatel[type=radio] + label, input.vpatel[type=checkbox] + label {
        display:inline-block;
        margin:-2px;
        padding: 4px 12px;
        margin-bottom: 0;
        font-size: 14px;
        line-height: 20px;
        color: #333;
        text-align: center;
        text-shadow: 0 1px 1px rgba(255,255,255,0.75);
        vertical-align: middle;
        cursor: pointer;
        background-color: #f5f5f5;
        background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
        background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
        background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
        background-image: -o-linear-gradient(top,#fff,#e6e6e6);
		    background-image: linear-gradient(to bottom,#fff,#e6e6e6);
		    background-repeat: repeat-x;
		    border: 1px solid #ccc;
		    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
		    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
		    border-bottom-color: #b3b3b3;
		    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
		    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
		    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
		    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
		    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
      }

      input.vpatel[type=radio]:checked + label, input.vpatel[type=checkbox]:checked + label{
        background-image: none;
		    outline: 0;
		    -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
		    -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
		    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15),0 1px 2px rgba(0,0,0,0.05);
			    background-color:#c8c8c8;
      }
      button.minimal {
        background: #e3e3e3;
        border: 1px solid #bbb;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
        -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
        box-shadow: inset 0 0 1px 1px #f6f6f6;
        color: #333;
        font: bold 20px "helvetica neue", helvetica, arial, sans-serif;
        line-height: 1;
        padding: 8px 0 9px;
        text-align: center;
        text-shadow: 0 1px 0 #fff;
        width: 150px; 
      }
      button.minimal:hover {
        background: #d9d9d9;
        -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
        -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        cursor: pointer; 
      }
      button.minimal:active {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000; 
      }
    </style>
</head>

<body style="background-color:#444; color:#fff">

  <h1 style="font-family:'Segoe UI', 'sans-serif'">Loki Sandbox</h3>

  <div id="divLokiCode">
  </div>

  <div id="divLoader" style="position:absolute; top:10px; right: 420px">
    <i>Import database : </i> <input style='height:30px; width:200px;' id='file-import' type="file" onchange="dbImport()" />
  </div>

  <div style="position: absolute; top:10px; right:10px">
    <input class="vpatel" type="radio" id="radio1" name="radios" value="all" checked onclick="tabMode(1)">
    <label for="radio1">Text Output</label>
    <input class="vpatel" type="radio" id="radio2" name="radios" value="false" onclick="tabMode(2)">
    <label for="radio2">Object Inspector</label>
    <input class="vpatel" type="radio" id="radio3" name="radios" value="true" onclick="tabMode(3)">
    <label for="radio3">Save / Load</label>
    <input class="vpatel" type="radio" id="radio4" name="radios" value="true" onclick="tabMode(4)">
    <label for="radio4">About</label>
  </div>

  <table width="100%" style="table-layout:fixed">
    <tr>
      <td width="50%" valign="top">
        <h2 style="font-family:'Segoe UI', 'sans-serif'">Sandbox Editor</h2>
        <div id="divLokiEditor">
          <textarea id="jsedit"></textarea>
          <br />
          <button class="minimal" style="width:140px" onclick="runloki();">Run</button>
        </div>
      </td>
      <td width="50%" valign="top">
        <div id="divTextOutput">
          <h2 style="font-family:'Segoe UI', 'sans-serif'">Text Output</h2>
          
          <div id="divText">
            <textarea id="lsoutput"></textarea>
          </div>
        </div>
        <div id="divInspector" style="display:none">
          <h2>Object Inspector</h2>
          <div id="divInspect" style="overflow-y:auto">
            <div id="divPrettyPrint">
            </div>
          </div>
          <br/>
          <button class="minimal" onclick="console.log(db)" style="width:220px">Log db to Console</button>
        </div>
        <div id="divSaveLoad" style="display:none; padding: 20px">
          <h2>Save / Load</h2>
          <br/>
          <table width="100%">
            <tr>
              <td valign="top">
                <label>Script name : </label><br/>
                <input id="txtScriptName" type='text' style="font-size:16px; height:24px; width:200px" value="lokiscript1"/><br/><br/>
                <button class="minimal" onclick="saveLokiScript()">Save</button>
              </td>
              <td valign="top">
                <label>Stored Scripts :</label><br/>
                <select id="selScriptList" size=8 style="font-size:16pt; min-width:200px"></select>
                <br/><br/>
                <button class="minimal" onclick="loadLokiScript()">Load</button><br/><br/>
                <button class="minimal" onclick="deleteLokiScript()">Delete</button>
              </td>
            </tr>
          </table>
        </div>
        <div id="divAbout" style="display:none; padding: 20px">
          <h2>About Loki Sandbox 0.2.0</h2>
          <p style="font-size:18px">
              Loki Sandbox is a simple utility web page which lets you experiment with LokiJS using a browser environment.
              An example database is created by default (in memory), along with sample javascript interaction to populate, query, and sandbox logging capabilities.
          </p>
          <p style="font-size:18px">
            If you have databases which have been saved to the filesystem (from node.js, node webkit, or cordova), you load load them and inspect and/or
            query their contents.
          <p style="font-size:18px">
            This utility page is to support <a href="http://lokijs.org" target="_blank">LokiJS</a>.<br /><br/>
            You can also view the <a href="https://github.com/techfort/LokiJS" target="_blank">GitHub page</a>.
          </p>
          <p>
            Some example logging commands are :<br/>
            <code>
              logText(message);<br/>
              logObject(obj);<br/>
              inspectObject(obj);<br/>
              alertify.log(message);<br/><br/>
            </code>
            alertify is a bundled library, click <a href="http://fabien-d.github.io/alertify.js/" target="_blank">here</a> to learn more of its capability.
          </p>
        </div>
        <br/>
      </td>
    </tr>
  </table>

  <script>
    var db = new loki('sandbox.db');
    
    // we will use loki indexed adapter as a generic app/key/value store
    // we will store scripts instead of serialized loki databases in our 'sandbox' 'app'
    var sandboxAdapter = null;
    if (window && window.indexedDB) {
      sandboxAdapter = new LokiIndexedAdapter('sandbox');
    }

    var sbv = {
      editorJS: null,
      editorOutput: null,
    }

    // used to retrieve hash (#) parameters 
    function getHashParameter (sParam) {
      var sPageURL = window.location.hash.substring(1);

      var sURLVariables = sPageURL.split('&');
      for (var i = 0; i < sURLVariables.length; i++) {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] === sParam) {
          return decodeURIComponent(sParameterName[1]);
        }
      }
    }
    
    // let's user go to different tabs via 
    function tabMode(mode) {
      $("#divTextOutput").hide();
      $("#divInspector").hide();
      $("#divSaveLoad").hide();
      $("#divAbout").hide();

      switch(mode) {
        case 1 : $("#divTextOutput").show(); break;
        case 2 : $("#divInspector").show(); break;
        case 3 : $("#divSaveLoad").show(); break;
        case 4 : $("#divAbout").show(); break;
      }
    }

    $(document).ready(function () {
      // Help user quickly identify errors in their code by displaying alert with msg, line and col
      window.onerror = function (msg, url, line, col, error) {
          alertify.error(msg + " (line " + line + " col " + col + ")");
      };

      $(window).resize(function () {
          if (typeof (windowResize) == typeof (Function)) windowResize();
      });

      $("body").css("background-color", "#222");

      setupEditor();

      if (sandboxAdapter) {
        loadScriptList();
      }
      
      // if the user specifies a rawgist hash parameter, attempt to load and run that gist (url)
      var rawgist = getHashParameter("rawgist");
      if (rawgist && rawgist !== "") {
        if (rawgist.indexOf("https://gist.githubusercontent.com") !== 0) {
          console.log("only allowing ajax fetch to gist.githubusercontent.com");
        }

        console.log ("loading rawgist : " + rawgist);

        var oReq = new XMLHttpRequest();
        oReq.addEventListener("load", gistLoaded);
        oReq.open("GET", rawgist);
        oReq.send();
      }
      else {
        setTimeout(function() {
          windowResize();
          runloki();
        }, 250);
      }
    });

    function loadScriptList() {
      if (!sandboxAdapter.checkAvailability()) {
{'fraction_non_alphanumeric': 0.15437354364581465, 'fraction_numerical': 0.03647607098046245, 'mean_word_length': 2.372676439474082, 'pattern_counts': {'":': 0, '<': 287, '<?xml version=': 0, '>': 285, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 2, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '224009', 'n_tokens_mistral': 8056, 'n_tokens_neox': 7241, 'n_words': 1713}