<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <base data-ice="baseUrl" href="../../../">
  <title data-ice="title">App | simple-keyboard</title>
  <link type="text/css" rel="stylesheet" href="css/style.css">
  <link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css">
  <script src="script/prettify/prettify.js"></script>
  <script src="script/manual.js"></script>
<meta name="description" content="On-screen Javascript Virtual Keyboard"><meta property="twitter:card" content="summary"><meta property="twitter:title" content="simple-keyboard"><meta property="twitter:description" content="On-screen Javascript Virtual Keyboard"></head>
<body class="layout-container" data-ice="rootContainer">

<header>
  <a href="./">Home</a>
  
  <a href="identifiers.html">Reference</a>
  <a href="source.html">Source</a>
  
  <div class="search-box">
  <span>
    <img src="./image/search.png">
    <span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span>
  </span>
    <ul class="search-result"></ul>
  </div>
<a style="position:relative; top:3px;" href="https://github.com/hodgef/simple-keyboard"><img width="20px" src="./image/github.png"></a></header>

<nav class="navigation" data-ice="nav"><div>
  <ul>
    
  <li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#demo">demo</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/demo/App.js~App.html">App</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-components">lib/components</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/components/Keyboard.js~SimpleKeyboard.html">SimpleKeyboard</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-services">lib/services</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/KeyboardLayout.js~KeyboardLayout.html">KeyboardLayout</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/PhysicalKeyboard.js~PhysicalKeyboard.html">PhysicalKeyboard</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/services/Utilities.js~Utilities.html">Utilities</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib-tests">lib/tests</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/lib/tests/TestUtility.js~TestUtility.html">TestUtility</a></span></span></li>
</ul>
</div>
</nav>

<div class="content" data-ice="content"><div class="header-notice">
  <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import App from &apos;<span><a href="file/src/demo/App.js.html#lineNumber7">simple-keyboard/src/demo/App.js</a></span>&apos;</code></pre></div>
  <span data-ice="access">public</span>
  <span data-ice="kind">class</span>
  
  
  
  <span data-ice="source">| <span><a href="file/src/demo/App.js.html#lineNumber7">source</a></span></span>
</div>

<div class="self-detail detail">
  <h1 data-ice="name">App</h1>

  

  
  
  
  
  
  
  
  
  

  
  
  <div class="description" data-ice="description"><p>simple-keyboard demo</p>
</div>
  

  

  

  

  
</div>



<div data-ice="constructorSummary"><h2>Constructor Summary</h2><table class="summary" data-ice="summary">
  <thead><tr><td data-ice="title" colspan="3">Public Constructor</td></tr></thead>
  <tbody>
  
  <tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-constructor-constructor">constructor</a></span></span><span class="code" data-ice="signature">()</span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Instantiates the demo class</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
</tbody>
</table>
</div>
<div data-ice="memberSummary"><h2>Member Summary</h2><table class="summary" data-ice="summary">
  <thead><tr><td data-ice="title" colspan="3">Public Members</td></tr></thead>
  <tbody>
  
  <tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-member-handleShiftButton">handleShiftButton</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Handles shift functionality</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
<tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-member-layoutName">layoutName</a></span></span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Default input name</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
<tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-member-onChange">onChange</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Called when simple-keyboard input has changed</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
<tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-member-onDOMLoaded">onDOMLoaded</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Executed when the DOM is ready</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
<tr data-ice="target">
    <td>
      <span class="access" data-ice="access">public</span>
      
      
      
      <span class="override" data-ice="override"></span>
    </td>
    <td>
      <div>
        <p>
          
          
          
          <span class="code" data-ice="name"><span><a href="class/src/demo/App.js~App.html#instance-member-onKeyPress">onKeyPress</a></span></span><span class="code" data-ice="signature">: <span>*</span></span>
        </p>
      </div>
      <div>
        
        
        <div data-ice="description"><p>Called when a simple-keyboard key is pressed</p>
</div>
      </div>
    </td>
    <td>
      
      
    </td>
  </tr>
</tbody>
</table>
</div>






<div data-ice="constructorDetails"><h2 data-ice="title">Public Constructors</h2>

<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-constructor-constructor">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">constructor</span><span class="code" data-ice="signature">()</span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber11">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Instantiates the demo class</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
</div>
<div data-ice="memberDetails"><h2 data-ice="title">Public Members</h2>

<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-member-handleShiftButton">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">handleShiftButton</span><span class="code" data-ice="signature">: <span>*</span></span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber54">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Handles shift functionality</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-member-layoutName">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">layoutName</span><span class="code" data-ice="signature">: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber18">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Default input name</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-member-onChange">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">onChange</span><span class="code" data-ice="signature">: <span>*</span></span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber66">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Called when simple-keyboard input has changed</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-member-onDOMLoaded">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">onDOMLoaded</span><span class="code" data-ice="signature">: <span>*</span></span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber24">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Executed when the DOM is ready</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
<div class="detail" data-ice="detail">
  <h3 data-ice="anchor" id="instance-member-onKeyPress">
    <span class="access" data-ice="access">public</span>
    
    
    
    
    
    <span class="code" data-ice="name">onKeyPress</span><span class="code" data-ice="signature">: <span>*</span></span>
    <span class="right-info">
      
      
      <span data-ice="source"><span><a href="file/src/demo/App.js.html#lineNumber73">source</a></span></span>
    </span>
  </h3>

  
  
  
  <div data-ice="description"><p>Called when a simple-keyboard key is pressed</p>
</div>

  

  <div data-ice="properties">
</div>

  

  

  

  

  

  

  

  
  
</div>
</div>

</div>

<footer class="footer">
  Generated by <a href="https://esdoc.org">ESDoc<span data-ice="esdocVersion">(1.1.0)</span><img src="./image/esdoc-logo-mini-black.png"></a>
</footer>

<script src="script/search_index.js"></script>
<script src="script/search.js"></script>
<script src="script/pretty-print.js"></script>
<script src="script/inherited-summary.js"></script>
<script src="script/test-summary.js"></script>
<script src="script/inner-link.js"></script>
<script src="script/patch-for-local.js"></script>
</body>
</html>