<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <!--
    2015 - 2016 (c) Marcel Kapfer (mmk2410)
    Licensed under MIT License
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Morse Converter</title>
    <meta name="description" content="A writtenMorse and normal Morse converter for the web.">

    <meta name="theme-color" content="#2196F3">

    <link rel="manifest" href="manifest.json">

    <meta name="msapplication-TileColor" content="#2196F3">

    <meta name="mobile-web-app-capable" content="yes">
    <meta name="application-name" content="Morse Converter">
    <link rel="icon" sizes="192x192" href="images/touch/chrome-touch-icon-192x192.png">

    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Morse Converter">
    <link rel="apple-touch-icon" href="images/touch/apple-touch-icon.png">

    <meta name="msapplication-TileImage" content="images/touch/ms-touch-icon-144x144-precomposed.png">

    <!-- build:js bower_components/webcomponentsjs/webcomponents.min.js -->
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
    <!-- endbuild -->

    <!-- will be replaced with elements/elements.vulcanized.html -->
    <link rel="import" href="elements/elements.html">
    <!-- endreplace-->

  </head>

  <body unresolved class="fullbleed layout vertical">

    <template is="dom-bind" id="app">

      <paper-drawer-panel id="paperDrawerPanel" forcenarrow="">

        <!-- Drawer -->
        <paper-header-panel drawer mode="seamed">

          <!-- Drawer Toolbar -->
          <paper-toolbar id="drawerToolbar" class="medium-tall">
            <span>Menu</span>
          </paper-toolbar>

          <!-- Drawer Content -->
          <paper-menu selected="0">
            <paper-item id="menuWrittenMorse">writtenMorse</paper-item>
            <paper-item id="menuNormalMorse">Normal Morse</paper-item>
            <paper-item id="menuReportBug">Report a bug</paper-item>
            <paper-item id="menuFork">Fork me on GitHub</paper-item>
            <paper-item id="menuAbout">About</paper-item>
          </paper-menu>

        </paper-header-panel>

        <!-- Main -->
        <paper-header-panel main>

          <!-- Main Toolbar -->
          <paper-toolbar id="mainToolbar">

            <!-- Drawer toggle -->
            <paper-icon-button id="paperToggle" icon="menu" paper-drawer-toggle></paper-icon-button>

            <!-- Application title -->
            <div class="appname title">Morse Converter</div>

          </paper-toolbar>

          <!-- Main Content-->

          <!-- Input Box -->
          <paper-material elevation="1">
            <paper-textarea id="inputArea" label="Input"></paper-textarea>
          </paper-material>

          <!-- Output box -->
          <paper-material elevation="1" style="display: none;" id="outputPaper">
            <p id="outputArea"></p>
          </paper-material>

        </paper-header-panel>

      </paper-drawer-panel>

      <paper-toast id="toastNormalMorse"
        text="Switched to normal Morse">
      </paper-toast>
      <paper-toast id="toastWrittenMorse"
        text="Switched to writtenMorse">
      </paper-toast>

    <paper-toast id="caching-complete"
                 duration="6000"
                 text="Caching complete! This app will work offline.">
    </paper-toast>

    <platinum-sw-register auto-register
                          clients-claim
                          skip-waiting
                          on-service-worker-installed="displayInstalledToast">
      <platinum-sw-cache default-cache-strategy="cacheFirst"
                         precache-file="precache.json">
      </platinum-sw-cache>
    </platinum-sw-register>

  </template>

  <!-- build:js scripts/app.js -->
  <script src="scripts/app.js"></script>
  <script src="scripts/MorseConverter.js"></script>
  <!-- endbuild-->

  </body>

</html>