Add about tab with version number. Closes #28

app/elements/elements.html

@@ -47,4 +47,5 @@
 <link rel="import" href="bv-dumper/bv-dumper.html">
 <link rel="import" href="keysav-options/keysav-options.html">
 <link rel="import" href="key-breaker/key-breaker.html">
+<link rel="import" href="keysav-about/keysav-about.html">
 <link rel="import" href="electron-updater/electron-updater.html">

app/elements/keysav-about/keysav-about.html

@@ -0,0 +1,16 @@
+<dom-module is="keysav-about">
+    <link rel="import" type="css" href="../../styles/paper-material.css">
+    <style>
+    </style>
+    <template>
+        <paper-material>
+            <h1>KeySAV<sup>e</sup></h1>
+            <h3>{{version}}</h3>
+
+            <div>
+                <a href="https://github.com/Cu3PO42/KeySAVe/issues">GitHub Issues</a>
+            </div>
+        </paper-material>
+    </template>
+    <script src="./keysav-about.js"></script>
+</dom-module>

app/elements/keysav-about/keysav-about.js

@@ -0,0 +1,36 @@
+/// <reference path="../../../bower_components/polymer-ts/polymer-ts.ts"/>
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") return Reflect.decorate(decorators, target, key, desc);
+    switch (arguments.length) {
+        case 2: return decorators.reduceRight(function(o, d) { return (d && d(o)) || o; }, target);
+        case 3: return decorators.reduceRight(function(o, d) { return (d && d(target, key)), void 0; }, void 0);
+        case 4: return decorators.reduceRight(function(o, d) { return (d && d(target, key, o)) || o; }, desc);
+    }
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+(function () {
+    var KeysavAbout = (function (_super) {
+        __extends(KeysavAbout, _super);
+        function KeysavAbout() {
+            _super.call(this);
+            this.version = require("../package.json").version;
+        }
+        __decorate([
+            property({ type: String }), 
+            __metadata('design:type', String)
+        ], KeysavAbout.prototype, "version");
+        KeysavAbout = __decorate([
+            component("keysav-about"), 
+            __metadata('design:paramtypes', [])
+        ], KeysavAbout);
+        return KeysavAbout;
+    })(polymer.Base);
+    polymer.createElement(KeysavAbout);
+})();

app/elements/keysav-about/keysav-about.ts

@@ -0,0 +1,15 @@
+/// <reference path="../../../bower_components/polymer-ts/polymer-ts.ts"/>
+
+(() => {
+@component("keysav-about")
+class KeysavAbout extends polymer.Base {
+    @property({type: String})
+    version: string;
+
+    constructor() {
+        super();
+        this.version = require("../package.json").version;
+    }
+}
+polymer.createElement(KeysavAbout);
+})()

app/index.html

@@ -37,6 +37,7 @@
                     <paper-tab data-route="sav">Save Dumping</paper-tab>
                     <paper-tab data-route="options">Options</paper-tab>
                     <paper-tab data-route="breaking">Breaking</paper-tab>
+                    <paper-tab data-route="about">About</paper-tab>
                 </paper-tabs>
             </paper-toolbar>
 
@@ -60,6 +61,10 @@
                     <section data-route="breaking">
                         <key-breaker></key-breaker>
                     </section>
+
+                    <section data-route="about">
+                        <keysav-about></keysav-about>
+                    </section>
                 </iron-pages>
             </div>
         </paper-scroll-header-panel>

tsconfig.json

@@ -29,6 +29,7 @@
         "./app/elements/electron-updater/electron-updater.ts",
         "./app/elements/file-input/file-input.ts",
         "./app/elements/key-breaker/key-breaker.ts",
+        "./app/elements/keysav-about/keysav-about.ts",
         "./app/elements/keysav-options/keysav-options.ts",
         "./app/elements/pkm-list/pkm-list.ts",
         "./app/elements/save-dumper/save-dumper.ts",