<commit_before>﻿<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'>
    
    <!-- Set the viewport width to match iOS device widths                         
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />   -->
    <meta name="viewport" content="width=device-width,user-scalable=no" /> 
    <meta name="apple-mobile-web-app-capable" content="yes" />
    
    <!-- Enable IE9 Standards mode -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
      
    <title>Keyman Developer Keyboard Test Site</title>
 
    <style type='text/css'>   
      body {
          padding-left: 10px;
          margin-left: 12px;
      }

      h2 { 
          font-family: sans-serif 
      }

      .test {
          font-size: 1.5em; 
          background-color: #ffffee; 
          height:100px;
          width:92%; 
          min-height:30px; 
          border: 1px solid gray;
      }
      
      #install_link { 
        background: none repeat scroll 0 0 #CCCCCC;
        border: 1px solid #444444;
        border-radius: 4px;
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
        color: #444444;
        display: none;
        font-family: Sans-serif;
        font-size: 10pt;
        font-weight: bold;
        margin: 18px 0;
        padding: 6px;
        text-decoration: none;
    }
      
      /** Mobile **/
      @media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
          #install_link { display: inline-block; }
      }

      /** Tablet **/
      @media only screen and (min-width : 768px) and (max-width : 1024px) {
          #install_link { display: inline-block; }
      }

      /** Tablet (landscape) **/
      @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
          #install_link { display: inline-block; }
      }

      
    </style> 

  <script src="resource/keymanweb.js"></script>   
  <script src="resource/kmwuibutton.js"></script>
    
  <!-- The following dynamic script will register each of the additional keyboards -->
    
  <script src="/inc/keyboards.js" type="text/javascript"></script>

  <!-- This script loads the dynamic keyboard fonts -->

  <link href="/inc/keyboards.css" type="text/css" rel="stylesheet" />
       
  <!-- 
    KeymanWeb initialization script, to initialize KeymanWeb and specify parameters for its use:
      'key':  license key (required parameter).
      'ui':   the type of user interface to be installed, either downloaded automatically from the
              KeymanWeb server, or else inserted as a separate script (above) if a custom user interface.
              If omitted, 'ui' will default to 'float' and install the 'Floating User Interface'. 
      'resources': the absolute or page-relative url from which to download the ui, css and image files
      'keyboards': the absolute or page-relative url from which to download keyboard objects 
      'fonts': the absolute or page-relative url from which to download embedded fonts. 
  -->  

  </head>
  
  <body class='osk-always-visible'>
    <h2>Keyboard Test Host</h2>

    <div>
      <!-- The following DIV is only needed as a UI placeholder for the Button and Toolbar User Interfaces -->
      <div id='KeymanWebControl'></div>
      <textarea id='ta1' class='test'></textarea><br/>
      <a href='' id='install_link'>Install Keyboard into native Keyman</a>
    </div>
    <script> 
      keyman.init({
        ui:'button',
        resources:'/resource/',
        keyboards:'/keyboard/',
        fonts:'/font/',
        attachType:'auto'
      });

      keyman.addEventListener('keyboardchange',
        function (p) {
          //alert(p.internalName);
          var nm = p.internalName.substr('Keyboard_'.length);
          document.getElementById('install_link').href='keyman://localhost/open?direct=true&url='+location.protocol+'//'+location.host+'/kbinstall/'+nm+'-'+debugKeyboards[nm].version+'.json';
        });
        
      //keyman.addEventListener
      
      window.onload = function() {
        window.setTimeout(
          function () {
            //document.getElementById('ta1').focus();
            keyman.moveToElement('ta1');
          }, 10);
      }
    </script>
  </body>
</html><commit_msg>Add a character grid to show the content of the edit control in the web debugger<commit_after>﻿<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'>
    
    <!-- Set the viewport width to match iOS device widths                         
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />   -->
    <meta name="viewport" content="width=device-width,user-scalable=no" /> 
    <meta name="apple-mobile-web-app-capable" content="yes" />
    
    <!-- Enable IE9 Standards mode -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
      
    <title>Keyman Developer Keyboard Test Site</title>
 
    <style type='text/css'>   
      body {
          padding-left: 10px;
          margin-left: 12px;
      }

      h2 { 
          font-family: sans-serif 
      }

      .test {
        font-size: 1.5em; 
        background-color: #ffffee; 
        height:100px;
        width:92%; 
        min-height:30px; 
      }
      
      .desktop-device .test {
        box-sizing: border-box;
        padding: 4px;
        margin: 0;
        width:100%; 
      }
      
      #install_link { 
        background: none repeat scroll 0 0 #CCCCCC;
        border: 1px solid #444444;
        border-radius: 4px;
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
        color: #444444;
        display: none;
        font-family: Sans-serif;
        font-size: 10pt;
        font-weight: bold;
        margin: 0;
        padding: 6px;
        text-decoration: none;
    }
      
      /** Mobile, Tablet **/
      .touch-device #install_link { 
        display: inline-block;
      }
      
      #top-toolbar {
        background: #eeeeee;
        min-height: 23px;
        padding: 4px;
      }
      
      .control {
        float: left; 
      }

      #character-grid {
        min-height: 49px;
        margin: 8px 0;
        border: solid 1px #cccccc;
      }
      
      #character-grid > div {
        display: inline-block;
      }
      
      .char-char,
      .char-code {
        border: solid 1px #888888;
      }
      
      .char-char {
        font-size: 14pt;
        text-align: center;
      }
      
      .char-code {
        font: 8pt Consolas,Courier;
        padding: 4px;
      }
    </style> 

  <script src="resource/keymanweb.js"></script>   
  <script src="resource/kmwuibutton.js"></script>
    
  <!-- The following dynamic script will register each of the additional keyboards -->
    
  <script src="/inc/keyboards.js" type="text/javascript"></script>

  <!-- This script loads the dynamic keyboard fonts -->

  <link href="/inc/keyboards.css" type="text/css" rel="stylesheet" />
       
  <!-- 
    KeymanWeb initialization script, to initialize KeymanWeb and specify parameters for its use:
      'key':  license key (required parameter).
      'ui':   the type of user interface to be installed, either downloaded automatically from the
              KeymanWeb server, or else inserted as a separate script (above) if a custom user interface.
              If omitted, 'ui' will default to 'float' and install the 'Floating User Interface'. 
      'resources': the absolute or page-relative url from which to download the ui, css and image files
      'keyboards': the absolute or page-relative url from which to download keyboard objects 
      'fonts': the absolute or page-relative url from which to download embedded fonts. 
  -->  

  </head>
  
  <body class='osk-always-visible'>
    <h2>Keyboard Test Host</h2>

    <div>
      <!-- The following DIV is only needed as a UI placeholder for the Button and Toolbar User Interfaces -->
      <div id='top-toolbar'>
        <div class='control' id='keymanweb-control-host'>
          <div id='KeymanWebControl'></div>
        </div>
        <div class='control' id='controls'>
          <a href='' id='install_link'>Install keyboard into Keyman app</a>
        </div>
        <div style='clear:left'></div>
      </div>
      <div id='character-grid'>
        <!-- contains the breakdown of characters from the input-area -->
      </div>
      <div id='input-area'>
        <textarea id='ta1' class='test'></textarea><br/>
      </div>
      
    </div>
    <script> 
      keyman.init({
        ui:'button',
        resources:'/resource/',
        keyboards:'/keyboard/',
        fonts:'/font/',
        attachType:'auto'
      });

      keyman.addEventListener('keyboardchange',
        function (p) {
          //alert(p.internalName);
          var nm = p.internalName.substr('Keyboard_'.length);
          document.getElementById('install_link').href='keyman://localhost/open?direct=true&url='+location.protocol+'//'+location.host+'/kbinstall/'+nm+'-'+debugKeyboards[nm].version+'.json';
        });
        
      var ta1 = document.getElementById('ta1');
      var charGrid = document.getElementById('character-grid');
      var lastContent = null;
      
      if(keyman.util.isTouchDevice()) {
        document.body.className += ' touch-device';
      } else {
        document.body.className += ' desktop-device';
      }
      
      function removeChildNodes(node) {
        while (node.lastChild) {
          node.removeChild(node.lastChild);
        }
      }
      
      function addCharElements(text, code) {
        var ebox = document.createElement('div'), echar = document.createElement('div'), ecode = document.createElement('div');
        echar.textContent = text;
        echar.className = 'char-char keymanweb-font';
        ecode.textContent = code;
        ecode.className = 'char-code';
        ebox.appendChild(echar);
        ebox.appendChild(ecode);
        charGrid.appendChild(ebox);
      }
      
      function logContent() {
        if(lastContent === ta1.value) return;
        removeChildNodes(charGrid);
        if(ta1.value.length == 0) {
          addCharElements('-','empty');
        } else {
          for(var i = 0; i < ta1.value.length; i++) {
            //
            var code = ta1.value.charCodeAt(i);
            var text = ta1.value.charAt(i);
            var slice = 4;
            // Test for SMP
            if(code >= 0xD800 && code < 0xDC00) {
              if(i < ta1.value.length) {
                var code2 = ta1.value.charCodeAt(i+1);
                if(code2 >= 0xDC00 && code < 0xE000) {
                  code = (code - 0xD800) * 0x400 + (code2 - 0xDC00) + 0x10000;
                  text += ta1.value.charAt(i+1);
                  slice = 6;
                  i++;
                }
              }
            }
            addCharElements(text, ('000000'+(code).toString(16)).slice(-slice));
          }
        }
        console.log(ta1.value);
        lastContent = ta1.value;
      }

      logContent();
      window.setInterval(logContent, 100);
        
      /* TODO: once KeymanWeb supports oninput signalling
      document.getElementById('ta1').addEventListener('input', logContent, false);
      */
      
      window.onload = function() {
        window.setTimeout(
          function () {
            //document.getElementById('ta1').focus();
            keyman.moveToElement('ta1');
          }, 10);
      }
    </script>
  </body>
</html>
{'fraction_non_alphanumeric': 0.13293496146185158, 'fraction_numerical': 0.0198319909933316, 'mean_word_length': 1.9747552807831015, 'pattern_counts': {'":': 0, '<': 104, '<?xml version=': 0, '>': 103, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 10, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2881496', 'n_tokens_mistral': 3625, 'n_tokens_neox': 3359, 'n_words': 828}