renew

zlg/.editorconfig

@@ -0,0 +1,17 @@
+# EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

zlg/.gitignore

@@ -0,0 +1,35 @@
+# Specifies intentionally untracked files to ignore when using Git
+# http://git-scm.com/docs/gitignore
+
+*~
+*.sw[mnpcod]
+*.log
+*.tmp
+*.tmp.*
+log.txt
+*.sublime-project
+*.sublime-workspace
+.vscode/
+npm-debug.log*
+
+.idea/
+.ionic/
+.sourcemaps/
+.sass-cache/
+.tmp/
+.versions/
+coverage/
+dist/
+node_modules/
+tmp/
+temp/
+platforms/
+plugins/
+plugins/android.json
+plugins/ios.json
+www/
+$RECYCLE.BIN/
+
+.DS_Store
+Thumbs.db
+UserInterfaceState.xcuserstate

zlg/config.xml

@@ -0,0 +1,84 @@
+<?xml version='1.0' encoding='utf-8'?>
+<widget id="io.ionic.starter" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+    <name>zlg</name>
+    <description>An awesome Ionic/Cordova app.</description>
+    <author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
+    <content src="index.html" />
+    <access origin="*" />
+    <allow-intent href="http://*/*" />
+    <allow-intent href="https://*/*" />
+    <allow-intent href="tel:*" />
+    <allow-intent href="sms:*" />
+    <allow-intent href="mailto:*" />
+    <allow-intent href="geo:*" />
+    <preference name="ScrollEnabled" value="false" />
+    <preference name="android-minSdkVersion" value="19" />
+    <preference name="BackupWebStorage" value="none" />
+    <preference name="SplashMaintainAspectRatio" value="true" />
+    <preference name="FadeSplashScreenDuration" value="300" />
+    <preference name="SplashShowOnlyFirstTime" value="false" />
+    <preference name="SplashScreen" value="screen" />
+    <preference name="SplashScreenDelay" value="3000" />
+    <platform name="android">
+        <allow-intent href="market:*" />
+        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
+        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
+        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
+        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
+        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
+        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
+        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
+        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
+        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
+        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
+        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
+        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
+        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
+        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
+        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
+        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
+        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
+        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
+    </platform>
+    <platform name="ios">
+        <allow-intent href="itms:*" />
+        <allow-intent href="itms-apps:*" />
+        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
+        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
+        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
+        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
+        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
+        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
+        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
+        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
+        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
+        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
+        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
+        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
+        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
+        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
+        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
+        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
+        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
+        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
+        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
+        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
+        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
+        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
+        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
+        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
+        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
+        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
+        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
+        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
+        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
+        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
+        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
+        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
+    </platform>
+    <plugin name="cordova-plugin-whitelist" spec="1.3.3" />
+    <plugin name="cordova-plugin-device" spec="2.0.2" />
+    <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
+    <plugin name="cordova-plugin-ionic-webview" spec="^2.0.0" />
+    <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
+</widget>

zlg/ionic.config.json

@@ -0,0 +1,8 @@
+{
+  "name": "zlg",
+  "app_id": "",
+  "type": "ionic-angular",
+  "integrations": {
+    "cordova": {}
+  }
+}

zlg/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "zlg",
+  "version": "0.0.1",
+  "author": "Ionic Framework",
+  "homepage": "http://ionicframework.com/",
+  "private": true,
+  "scripts": {
+    "start": "ionic-app-scripts serve",
+    "clean": "ionic-app-scripts clean",
+    "build": "ionic-app-scripts build",
+    "lint": "ionic-app-scripts lint"
+  },
+  "dependencies": {
+    "@angular/animations": "5.2.11",
+    "@angular/common": "5.2.11",
+    "@angular/compiler": "5.2.11",
+    "@angular/compiler-cli": "5.2.11",
+    "@angular/core": "5.2.11",
+    "@angular/forms": "5.2.11",
+    "@angular/http": "5.2.11",
+    "@angular/platform-browser": "5.2.11",
+    "@angular/platform-browser-dynamic": "5.2.11",
+    "@ionic-native/core": "~4.10.0",
+    "@ionic-native/splash-screen": "~4.10.0",
+    "@ionic-native/status-bar": "~4.10.0",
+    "@ionic/storage": "2.1.3",
+    "ionic-angular": "3.9.2",
+    "ionicons": "3.0.0",
+    "ng-socket-io": "^0.2.4",
+    "rxjs": "5.5.11",
+    "sockjs-client": "^1.1.5",
+    "stompjs": "^2.3.3",
+    "sw-toolbox": "3.6.0",
+    "zone.js": "0.8.26"
+  },
+  "devDependencies": {
+    "@ionic/app-scripts": "3.1.11",
+    "typescript": "~2.6.2"
+  },
+  "description": "An Ionic project"
+}

zlg/resources/README.md

@@ -0,0 +1,8 @@
+These are Cordova resources. You can replace icon.png and splash.png and run
+`ionic cordova resources` to generate custom icons and splash screens for your
+app. See `ionic cordova resources --help` for details.
+
+Cordova reference documentation:
+
+- Icons: https://cordova.apache.org/docs/en/latest/config_ref/images.html
+- Splash Screens: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/

zlg/src/app/app.component.ts

@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import { Platform } from 'ionic-angular';
+import { StatusBar } from '@ionic-native/status-bar';
+import { SplashScreen } from '@ionic-native/splash-screen';
+
+import { HomePage } from '../pages/home/home';
+@Component({
+  templateUrl: 'app.html'
+})
+export class MyApp {
+  rootPage:any = HomePage;
+
+  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
+    platform.ready().then(() => {
+      // Okay, so the platform is ready and our plugins are available.
+      // Here you can do any higher level native things you might need.
+      statusBar.styleDefault();
+      splashScreen.hide();
+    });
+  }
+}
+

zlg/src/app/app.html

@@ -0,0 +1 @@
+<ion-nav [root]="rootPage"></ion-nav>

zlg/src/app/app.module.ts

@@ -0,0 +1,38 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { ErrorHandler, NgModule } from '@angular/core';
+import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
+import { SplashScreen } from '@ionic-native/splash-screen';
+import { StatusBar } from '@ionic-native/status-bar';
+
+import { SocketIoModule, SocketIoConfig } from 'ng-socket-io';
+const config: SocketIoConfig = { url: 'http://localhost:8080/vault-socket', options: {} };
+
+
+
+import { MyApp } from './app.component';
+import { HomePage } from '../pages/home/home';
+import { WebsocketProvider } from '../providers/websocket/websocket';
+
+@NgModule({
+  declarations: [
+    MyApp,
+    HomePage
+  ],
+  imports: [
+    BrowserModule,
+    IonicModule.forRoot(MyApp),
+    SocketIoModule.forRoot(config)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    MyApp,
+    HomePage
+  ],
+  providers: [
+    StatusBar,
+    SplashScreen,
+    {provide: ErrorHandler, useClass: IonicErrorHandler},
+    WebsocketProvider
+  ]
+})
+export class AppModule {}

zlg/src/app/app.scss

@@ -0,0 +1,517 @@
+// http://ionicframework.com/docs/theming/
+
+
+// App Global Sass
+// --------------------------------------------------
+// Put style rules here that you want to apply globally. These
+// styles are for the entire app and not just one component.
+// Additionally, this file can be also used as an entry point
+// to import other Sass files to be included in the output CSS.
+//
+// Shared Sass variables, which can be used to adjust Ionic's
+// default Sass variables, belong in "theme/variables.scss".
+//
+// To declare rules for a specific mode, create a child rule
+// for the .md, .ios, or .wp mode classes. The mode class is
+// automatically applied to the <body> element in the app.
+
+@import url("https://fonts.googleapis.com/css?family=Codystar");
+@import url("https://fonts.googleapis.com/css?family=Raleway+Dots");
+@font-face {
+  font-family: "Ionicons";
+  src: url("../lib/ionic/fonts/ionicons.eot?v=2.0.1");
+  src: url("../lib/ionic/fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"), url("../lib/ionic/fonts/ionicons.ttf?v=2.0.1") format("truetype"), url("../lib/ionic/fonts/ionicons.woff?v=2.0.1") format("woff"), url("../lib/ionic/fonts/ionicons.woff") format("woff"), url("../lib/ionic/fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg");
+  font-weight: normal;
+  font-style: normal; }
+
+
+/**
+ * Buttons
+ * --------------------------------------------------
+ */
+ .button {
+    border-color: transparent;
+    background-color: #f8f8f8;
+    color: #444;
+    position: relative;
+    display: inline-block;
+    margin: 0;
+    padding: 0 12px;
+    min-width: 52px;
+    min-height: 47px;
+    border-width: 1px;
+    border-style: solid;
+    border-radius: 4px;
+    vertical-align: top;
+    text-align: center;
+    text-overflow: ellipsis;
+    font-size: 16px;
+    line-height: 42px;
+    cursor: pointer; }
+    .button:hover {
+      color: #444;
+      text-decoration: none; }
+    .button.active, .button.activated {
+      border-color: #a2a2a2;
+      background-color: #e5e5e5; }
+    .button:after {
+      position: absolute;
+      top: -6px;
+      right: -6px;
+      bottom: -6px;
+      left: -6px;
+      content: ' '; }
+    .button .icon {
+      vertical-align: top;
+      pointer-events: none; }
+    .button .icon:before, .button.icon:before, .button.icon-left:before, .button.icon-right:before {
+      display: inline-block;
+      padding: 0 0 1px 0;
+      vertical-align: inherit;
+      font-size: 24px;
+      line-height: 41px;
+      pointer-events: none; }
+    .button.icon-left:before {
+      float: left;
+      padding-right: .2em;
+      padding-left: 0; }
+    .button.icon-right:before {
+      float: right;
+      padding-right: 0;
+      padding-left: .2em; }
+    .button.button-block, .button.button-full {
+      margin-top: 10px;
+      margin-bottom: 10px; }
+    .button.button-light {
+      border-color: transparent;
+      background-color: #fff;
+      color: #444; }
+      .button.button-light:hover {
+        color: #444;
+        text-decoration: none; }
+      .button.button-light.active, .button.button-light.activated {
+        border-color: #a2a2a2;
+        background-color: #fafafa; }
+      .button.button-light.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #ddd; }
+      .button.button-light.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-light.button-outline {
+        border-color: #ddd;
+        background: transparent;
+        color: #ddd; }
+        .button.button-light.button-outline.active, .button.button-light.button-outline.activated {
+          background-color: #ddd;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-stable {
+      border-color: transparent;
+      background-color: #f8f8f8;
+      color: #444; }
+      .button.button-stable:hover {
+        color: #444;
+        text-decoration: none; }
+      .button.button-stable.active, .button.button-stable.activated {
+        border-color: #a2a2a2;
+        background-color: #e5e5e5; }
+      .button.button-stable.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #b2b2b2; }
+      .button.button-stable.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-stable.button-outline {
+        border-color: #b2b2b2;
+        background: transparent;
+        color: #b2b2b2; }
+        .button.button-stable.button-outline.active, .button.button-stable.button-outline.activated {
+          background-color: #b2b2b2;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-positive {
+      border-color: transparent;
+      background-color: #387ef5;
+      color: #fff; }
+      .button.button-positive:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-positive.active, .button.button-positive.activated {
+        border-color: #a2a2a2;
+        background-color: #0c60ee; }
+      .button.button-positive.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #387ef5; }
+      .button.button-positive.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-positive.button-outline {
+        border-color: #387ef5;
+        background: transparent;
+        color: #387ef5; }
+        .button.button-positive.button-outline.active, .button.button-positive.button-outline.activated {
+          background-color: #387ef5;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-calm {
+      border-color: transparent;
+      background-color: #11c1f3;
+      color: #fff; }
+      .button.button-calm:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-calm.active, .button.button-calm.activated {
+        border-color: #a2a2a2;
+        background-color: #0a9dc7; }
+      .button.button-calm.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #11c1f3; }
+      .button.button-calm.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-calm.button-outline {
+        border-color: #11c1f3;
+        background: transparent;
+        color: #11c1f3; }
+        .button.button-calm.button-outline.active, .button.button-calm.button-outline.activated {
+          background-color: #11c1f3;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-assertive {
+      border-color: transparent;
+      background-color: #ef473a;
+      color: #fff; }
+      .button.button-assertive:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-assertive.active, .button.button-assertive.activated {
+        border-color: #a2a2a2;
+        background-color: #e42112; }
+      .button.button-assertive.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #ef473a; }
+      .button.button-assertive.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-assertive.button-outline {
+        border-color: #ef473a;
+        background: transparent;
+        color: #ef473a; }
+        .button.button-assertive.button-outline.active, .button.button-assertive.button-outline.activated {
+          background-color: #ef473a;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-balanced {
+      border-color: transparent;
+      background-color: #33cd5f;
+      color: #fff; }
+      .button.button-balanced:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-balanced.active, .button.button-balanced.activated {
+        border-color: #a2a2a2;
+        background-color: #28a54c; }
+      .button.button-balanced.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #33cd5f; }
+      .button.button-balanced.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-balanced.button-outline {
+        border-color: #33cd5f;
+        background: transparent;
+        color: #33cd5f; }
+        .button.button-balanced.button-outline.active, .button.button-balanced.button-outline.activated {
+          background-color: #33cd5f;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-energized {
+      border-color: transparent;
+      background-color: #ffc900;
+      color: #fff; }
+      .button.button-energized:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-energized.active, .button.button-energized.activated {
+        border-color: #a2a2a2;
+        background-color: #e6b500; }
+      .button.button-energized.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #ffc900; }
+      .button.button-energized.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-energized.button-outline {
+        border-color: #ffc900;
+        background: transparent;
+        color: #ffc900; }
+        .button.button-energized.button-outline.active, .button.button-energized.button-outline.activated {
+          background-color: #ffc900;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-royal {
+      border-color: transparent;
+      background-color: #886aea;
+      color: #fff; }
+      .button.button-royal:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-royal.active, .button.button-royal.activated {
+        border-color: #a2a2a2;
+        background-color: #6b46e5; }
+      .button.button-royal.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #886aea; }
+      .button.button-royal.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-royal.button-outline {
+        border-color: #886aea;
+        background: transparent;
+        color: #886aea; }
+        .button.button-royal.button-outline.active, .button.button-royal.button-outline.activated {
+          background-color: #886aea;
+          box-shadow: none;
+          color: #fff; }
+    .button.button-dark {
+      border-color: transparent;
+      background-color: #444;
+      color: #fff; }
+      .button.button-dark:hover {
+        color: #fff;
+        text-decoration: none; }
+      .button.button-dark.active, .button.button-dark.activated {
+        border-color: #a2a2a2;
+        background-color: #262626; }
+      .button.button-dark.button-clear {
+        border-color: transparent;
+        background: none;
+        box-shadow: none;
+        color: #444; }
+      .button.button-dark.button-icon {
+        border-color: transparent;
+        background: none; }
+      .button.button-dark.button-outline {
+        border-color: #444;
+        background: transparent;
+        color: #444; }
+        .button.button-dark.button-outline.active, .button.button-dark.button-outline.activated {
+          background-color: #444;
+          box-shadow: none;
+          color: #fff; }
+  
+  .button-small {
+    padding: 2px 4px 1px;
+    min-width: 28px;
+    min-height: 30px;
+    font-size: 12px;
+    line-height: 26px; }
+    .button-small .icon:before, .button-small.icon:before, .button-small.icon-left:before, .button-small.icon-right:before {
+      font-size: 16px;
+      line-height: 19px;
+      margin-top: 3px; }
+  .text-small {
+    padding: 2px 4px 1px;
+    min-width: 28px;
+    min-height: px;
+    font-size: 12px;
+    line-height: 26px;
+  }
+  .button-large {
+    padding: 0 16px;
+    min-width: 68px;
+    min-height: 59px;
+    font-size: 20px;
+    line-height: 53px; }
+    .button-large .icon:before, .button-large.icon:before, .button-large.icon-left:before, .button-large.icon-right:before {
+      padding-bottom: 2px;
+      font-size: 32px;
+      line-height: 51px; }
+  
+  .button-icon {
+    -webkit-transition: opacity 0.1s;
+    transition: opacity 0.1s;
+    padding: 0 6px;
+    min-width: initial;
+    border-color: transparent;
+    background: none; }
+    .button-icon.button.active, .button-icon.button.activated {
+      border-color: transparent;
+      background: none;
+      box-shadow: none;
+      opacity: 0.3; }
+    .button-icon .icon:before, .button-icon.icon:before {
+      font-size: 32px; }
+  
+  .button-clear {
+    -webkit-transition: opacity 0.1s;
+    transition: opacity 0.1s;
+    padding: 0 6px;
+    max-height: 42px;
+    border-color: transparent;
+    background: none;
+    box-shadow: none; }
+    .button-clear.button-clear {
+      border-color: transparent;
+      background: none;
+      box-shadow: none;
+      color: transparent; }
+    .button-clear.button-icon {
+      border-color: transparent;
+      background: none; }
+    .button-clear.active, .button-clear.activated {
+      opacity: 0.3; }
+  
+  .button-outline {
+    -webkit-transition: opacity 0.1s;
+    transition: opacity 0.1s;
+    background: none;
+    box-shadow: none; }
+    .button-outline.button-outline {
+      border-color: transparent;
+      background: transparent;
+      color: transparent; }
+      .button-outline.button-outline.active, .button-outline.button-outline.activated {
+        background-color: transparent;
+        box-shadow: none;
+        color: #fff; }
+  
+  .padding > .button.button-block:first-child {
+    margin-top: 0; }
+  
+  .button-block {
+    display: block;
+    clear: both; }
+    .button-block:after {
+      clear: both; }
+  
+  .button-full,
+  .button-full > .button {
+    display: block;
+    margin-right: 0;
+    margin-left: 0;
+    border-right-width: 0;
+    border-left-width: 0;
+    border-radius: 0; }
+  
+  button.button-block,
+  button.button-full,
+  .button-full > button.button,
+  input.button.button-block {
+    width: 100%; }
+  
+  a.button {
+    text-decoration: none; }
+    a.button .icon:before, a.button.icon:before, a.button.icon-left:before, a.button.icon-right:before {
+      margin-top: 2px; }
+  
+  .button.disabled,
+  .button[disabled] {
+    opacity: .4;
+    cursor: default !important;
+    pointer-events: none; }
+  
+  /**
+   * Button Bar
+   * --------------------------------------------------
+   */
+  .button-bar {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -moz-box;
+    display: -moz-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -moz-box-flex: 1;
+    -moz-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    width: 100%; }
+    .button-bar.button-bar-inline {
+      display: block;
+      width: auto;
+      *zoom: 1; }
+      .button-bar.button-bar-inline:before, .button-bar.button-bar-inline:after {
+        display: table;
+        content: "";
+        line-height: 0; }
+      .button-bar.button-bar-inline:after {
+        clear: both; }
+      .button-bar.button-bar-inline > .button {
+        width: auto;
+        display: inline-block;
+        float: left; }
+    .button-bar.bar-light > .button {
+      border-color: #ddd; }
+    .button-bar.bar-stable > .button {
+      border-color: #b2b2b2; }
+    .button-bar.bar-positive > .button {
+      border-color: #0c60ee; }
+    .button-bar.bar-calm > .button {
+      border-color: #0a9dc7; }
+    .button-bar.bar-assertive > .button {
+      border-color: #e42112; }
+    .button-bar.bar-balanced > .button {
+      border-color: #28a54c; }
+    .button-bar.bar-energized > .button {
+      border-color: #e6b500; }
+    .button-bar.bar-royal > .button {
+      border-color: #6b46e5; }
+    .button-bar.bar-dark > .button {
+      border-color: #111; }
+  
+  .button-bar > .button {
+    -webkit-box-flex: 1;
+    -webkit-flex: 1;
+    -moz-box-flex: 1;
+    -moz-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    display: block;
+    overflow: hidden;
+    padding: 0 16px;
+    width: 0;
+    border-width: 1px 0px 1px 1px;
+    border-radius: 0;
+    text-align: center;
+    text-overflow: ellipsis;
+    white-space: nowrap; }
+    .button-bar > .button:before,
+    .button-bar > .button .icon:before {
+      line-height: 44px; }
+    .button-bar > .button:first-child {
+      border-radius: 4px 0px 0px 4px; }
+    .button-bar > .button:last-child {
+      border-right-width: 1px;
+      border-radius: 0px 4px 4px 0px; }
+    .button-bar > .button:only-child {
+      border-radius: 4px; }
+  
+  .button-bar > .button-small:before,
+  .button-bar > .button-small .icon:before {
+    line-height: 28px; }
+
+    .codystar {
+        font-family: 'codystar'; }
+      
+      .raleway {
+        font-family: 'raleway+dots'; }

zlg/src/app/main.ts

@@ -0,0 +1,5 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app.module';
+
+platformBrowserDynamic().bootstrapModule(AppModule);

zlg/src/index.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+  <meta charset="UTF-8">
+  <title>Ionic App</title>
+  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="format-detection" content="telephone=no">
+  <meta name="msapplication-tap-highlight" content="no">
+
+  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
+  <link rel="manifest" href="manifest.json">
+  <meta name="theme-color" content="#4e8ef7">
+
+  <!-- add to homescreen for ios -->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+
+  <!-- cordova.js required for cordova apps (remove if not needed) -->
+  <script src="cordova.js"></script>
+
+  <!-- un-comment this code to enable service worker
+  <script>
+    if ('serviceWorker' in navigator) {
+      navigator.serviceWorker.register('service-worker.js')
+        .then(() => console.log('service worker installed'))
+        .catch(err => console.error('Error', err));
+    }
+  </script>-->
+
+  <link href="build/main.css" rel="stylesheet">
+
+</head>
+<body>
+
+  <!-- Ionic's root component and where the app will load -->
+  <ion-app></ion-app>
+
+  <!-- The polyfills js is generated during the build process -->
+  <script src="build/polyfills.js"></script>
+
+  <!-- The vendor js is generated during the build process
+       It contains all of the dependencies in node_modules -->
+  <script src="build/vendor.js"></script>
+
+  <!-- The main bundle js is generated during the build process -->
+  <script src="build/main.js"></script>
+
+</body>
+</html>

zlg/src/manifest.json

@@ -0,0 +1,13 @@
+{
+  "name": "Ionic",
+  "short_name": "Ionic",
+  "start_url": "index.html",
+  "display": "standalone",
+  "icons": [{
+    "src": "assets/imgs/logo.png",
+    "sizes": "512x512",
+    "type": "image/png"
+  }],
+  "background_color": "#4e8ef7",
+  "theme_color": "#4e8ef7"
+}

zlg/src/pages/home/home.html

@@ -0,0 +1,30 @@
+<ion-header>
+  <ion-navbar>
+    <button ion-button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>The Vault</ion-title>
+  </ion-navbar>
+</ion-header>
+
+<ion-buttons side="right" class="has-header">
+  <button class="button icon ion-android-settings"></button>
+</ion-buttons>
+<ion-content padding="true" style="background: url(../assets/img/0iNAJ9CJQ1qT57JTEweX_palePurpVault.png) no-repeat center;background-size:cover;" class="has-header">
+  <div id="myVault-markdown9" class="show-list-numbers-and-dots"> 
+    
+    <p  class="codystar" style="color:#FFFFFF;font-size:020px;" >
+      <strong>Begin a new post...</strong>
+    </p>
+    <ion-textarea [(ngModel)]="postInput" style="color:#FFFFFF;background-color:black;opacity:.5;"rows="5"></ion-textarea>
+    
+    <button (click)="sendPost()" id="myVault-button18" style="font-weight:600;font-size:20px;" class="codystar button button-royal button-block button-small">Post</button>
+  </div>
+  
+  
+  <div id="myVault-markdown4" class="show-list-numbers-and-dots" >
+      <ul style="color:#FFFFFF;list-style-type: none" *ngFor="let p of posts">
+        <li><strong>{{ p.userName }}: </strong> {{ p.message }}</li>
+      </ul>
+  </div>
+</ion-content>

zlg/src/pages/home/home.scss

@@ -0,0 +1,3 @@
+page-home {
+
+}

zlg/src/pages/home/home.ts

@@ -0,0 +1,50 @@
+import { Component, OnInit} from '@angular/core';
+import Stomp from 'stompjs';
+import SockJS from 'sockjs-client';
+
+// import { Socket } from 'ng-socket-io';
+
+
+import { NavController } from 'ionic-angular';
+
+@Component({
+  selector: 'page-home',
+  templateUrl: 'home.html'
+})
+export class HomePage implements OnInit{
+
+  constructor(public navCtrl: NavController) {
+
+  }
+
+  private stompClient ;
+  posts = [];
+  userId = 1;
+  userPostUrl = "/app/posts";
+  postInput = "";
+
+  ngOnInit() {
+    this.connect();  
+  }
+  connect() {
+    const socket = new SockJS('https://fast-headland-39537.herokuapp.com/vault-socket');
+    this.stompClient = Stomp.over(socket);
+
+    const _this = this; //i hope i am not expected to understand this
+    this.stompClient.connect({}, function (frame) {
+      console.log('Connected: ' + frame);
+      _this.stompClient.subscribe('/topic/posts', (post) => {
+        _this.posts.push(JSON.parse(post.body));
+     });
+    });
+  }
+
+  sendPost() {
+    this.stompClient.send(this.userPostUrl, {}, JSON.stringify({'id': '','message': this.postInput, 'userId': this.userId}))
+  }
+
+  //  showPost(message, userName) {
+  //   //("#messages").append("<tr><td>" + userName + ": " + message + "</td></tr>");
+  // }
+
+}

zlg/src/providers/websocket/websocket.ts

@@ -0,0 +1,17 @@
+import { Injectable } from '@angular/core';
+import SockJS from 'sockjs-client';
+
+/*
+  Generated class for the WebsocketProvider provider.
+
+  See https://angular.io/guide/dependency-injection for more info on providers
+  and Angular DI.
+*/
+@Injectable()
+export class WebsocketProvider {
+
+  constructor() {
+  }
+  
+
+}

zlg/src/service-worker.js

@@ -0,0 +1,31 @@
+/**
+ * Check out https://googlechromelabs.github.io/sw-toolbox/ for
+ * more info on how to use sw-toolbox to custom configure your service worker.
+ */
+
+
+'use strict';
+importScripts('./build/sw-toolbox.js');
+
+self.toolbox.options.cache = {
+  name: 'ionic-cache'
+};
+
+// pre-cache our key assets
+self.toolbox.precache(
+  [
+    './build/main.js',
+    './build/vendor.js',
+    './build/main.css',
+    './build/polyfills.js',
+    'index.html',
+    'manifest.json'
+  ]
+);
+
+// dynamically cache any other local assets
+self.toolbox.router.any('/*', self.toolbox.fastest);
+
+// for any other requests go to the network, cache,
+// and then only use that cached resource if your user goes offline
+self.toolbox.router.default = self.toolbox.networkFirst;

zlg/src/theme/variables.scss

@@ -0,0 +1,88 @@
+// Ionic Variables and Theming. For more info, please see:
+// http://ionicframework.com/docs/theming/
+
+// Font path is used to include ionicons,
+// roboto, and noto sans fonts
+$font-path: "../assets/fonts";
+
+
+// The app direction is used to include
+// rtl styles in your app. For more info, please see:
+// http://ionicframework.com/docs/theming/rtl-support/
+$app-direction: ltr;
+
+
+@import "ionic.globals";
+
+
+// Shared Variables
+// --------------------------------------------------
+// To customize the look and feel of this app, you can override
+// the Sass variables found in Ionic's source scss files.
+// To view all the possible Ionic variables, see:
+// http://ionicframework.com/docs/theming/overriding-ionic-variables/
+
+
+
+
+// Named Color Variables
+// --------------------------------------------------
+// Named colors makes it easy to reuse colors on various components.
+// It's highly recommended to change the default colors
+// to match your app's branding. Ionic uses a Sass map of
+// colors so you can add, rename and remove colors as needed.
+// The "primary" color is the only required color in the map.
+
+$colors: (
+  primary:    #488aff,
+  secondary:  #32db64,
+  danger:     #f53d3d,
+  light:      #f4f4f4,
+  dark:       #222
+);
+
+
+// App iOS Variables
+// --------------------------------------------------
+// iOS only Sass variables can go here
+
+
+
+
+// App Material Design Variables
+// --------------------------------------------------
+// Material Design only Sass variables can go here
+
+
+
+
+// App Windows Variables
+// --------------------------------------------------
+// Windows only Sass variables can go here
+
+
+
+
+// App Theme
+// --------------------------------------------------
+// Ionic apps can have different themes applied, which can
+// then be future customized. This import comes last
+// so that the above variables are used and Ionic's
+// default are overridden.
+
+@import "ionic.theme.default";
+
+
+// Ionicons
+// --------------------------------------------------
+// The premium icon font for Ionic. For more info, please see:
+// http://ionicframework.com/docs/ionicons/
+
+@import "ionic.ionicons";
+
+
+// Fonts
+// --------------------------------------------------
+
+@import "roboto";
+@import "noto-sans";

zlg/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
+    "declaration": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "lib": [
+      "dom",
+      "es2015"
+    ],
+    "module": "es2015",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "target": "es5"
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "src/**/*.spec.ts",
+    "src/**/__tests__/*.ts"
+  ],
+  "compileOnSave": false,
+  "atom": {
+    "rewriteTsconfig": false
+  }
+}

zlg/tslint.json

@@ -0,0 +1,11 @@
+{
+  "rules": {
+    "no-duplicate-variable": true,
+    "no-unused-variable": [
+      true
+    ]
+  },
+  "rulesDirectory": [
+    "node_modules/tslint-eslint-rules/dist/rules"
+  ]
+}

zlg/zlg

@@ -1 +0,0 @@
-Subproject commit 029efb069d0910ac22cbf4e85e22afe09c7f57e5