diff --git a/.gitignore b/.gitignore
index 41de00a..4e8ee01 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,2 @@
 /node_modules/
-/coverage/
-/syncd/
-*.log
-/temp/
 /archive/
diff --git a/.npmignore b/.npmignore
index b193a5e..480e0f5 100644
--- a/.npmignore
+++ b/.npmignore
@@ -2,5 +2,5 @@ tests/
 test/
 *.test.js
 testing/
-test-client
 archive/
+example/
diff --git a/test-client/.editorconfig b/example/client/.editorconfig
similarity index 100%
rename from test-client/.editorconfig
rename to example/client/.editorconfig
diff --git a/test-client/.eslintignore b/example/client/.eslintignore
similarity index 100%
rename from test-client/.eslintignore
rename to example/client/.eslintignore
diff --git a/example/client/.eslintrc.js b/example/client/.eslintrc.js
new file mode 100644
index 0000000..a789acd
--- /dev/null
+++ b/example/client/.eslintrc.js
@@ -0,0 +1,55 @@
+module.exports = {
+  root: true,
+
+  parserOptions: {
+    parser: 'babel-eslint',
+    sourceType: 'module'
+  },
+
+  env: {
+    browser: true
+  },
+
+  extends: [
+    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+    'plugin:vue/essential',
+    '@vue/standard'
+  ],
+
+  // required to lint *.vue files
+  plugins: [
+    'vue'
+  ],
+
+  globals: {
+    'ga': true, // Google Analytics
+    'cordova': true,
+    '__statics': true,
+    'process': true
+  },
+
+  // add your custom rules here
+  rules: {
+    // allow async-await
+    'generator-star-spacing': 'off',
+    // allow paren-less arrow functions
+    'arrow-parens': 'off',
+    'one-var': 'off',
+
+    'import/first': 'off',
+    'import/named': 'error',
+    'import/namespace': 'error',
+    'import/default': 'error',
+    'import/export': 'error',
+    'import/extensions': 'off',
+    'import/no-unresolved': 'off',
+    'import/no-extraneous-dependencies': 'off',
+    'prefer-promise-reject-errors': 'off',
+
+    // allow console.log during development only
+    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    // allow debugger during development only
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
+  }
+}
diff --git a/test-client/.gitignore b/example/client/.gitignore
similarity index 89%
rename from test-client/.gitignore
rename to example/client/.gitignore
index 2779c18..d7c7a2d 100644
--- a/test-client/.gitignore
+++ b/example/client/.gitignore
@@ -3,6 +3,7 @@
 .thumbs.db
 node_modules
 /dist
+/src-cordova/node_modules
 /src-cordova/platforms
 /src-cordova/plugins
 /src-cordova/www
@@ -17,4 +18,3 @@ yarn-error.log*
 *.ntvs*
 *.njsproj
 *.sln
-*.lock
diff --git a/test-client/.postcssrc.js b/example/client/.postcssrc.js
similarity index 100%
rename from test-client/.postcssrc.js
rename to example/client/.postcssrc.js
diff --git a/test-client/.stylintrc b/example/client/.stylintrc
similarity index 100%
rename from test-client/.stylintrc
rename to example/client/.stylintrc
diff --git a/example/client/README.md b/example/client/README.md
new file mode 100644
index 0000000..0f7d653
--- /dev/null
+++ b/example/client/README.md
@@ -0,0 +1,26 @@
+# Quasar App (test-client-new)
+
+a test websocket client for uci websocket server
+
+## Install the dependencies
+```bash
+yarn
+```
+
+### Start the app in development mode (hot-code reloading, error reporting, etc.)
+```bash
+quasar dev
+```
+
+### Lint the files
+```bash
+yarn run lint
+```
+
+### Build the app for production
+```bash
+quasar build
+```
+
+### Customize the configuration
+See [Configuring quasar.conf.js](https://quasar.dev/quasar-cli/quasar-conf-js).
diff --git a/example/client/babel.config.js b/example/client/babel.config.js
new file mode 100644
index 0000000..9408c6c
--- /dev/null
+++ b/example/client/babel.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@quasar/babel-preset-app'
+  ]
+}
diff --git a/example/client/package.json b/example/client/package.json
new file mode 100644
index 0000000..1630df6
--- /dev/null
+++ b/example/client/package.json
@@ -0,0 +1,34 @@
+{
+  "name": "test-client-new",
+  "version": "0.0.1",
+  "description": "a test websocket client for uci websocket server",
+  "productName": "Quasar App",
+  "cordovaId": "org.cordova.quasar.app",
+  "author": "David Kebler <d@kebler.net>",
+  "private": true,
+  "scripts": {
+    "lint": "eslint --ext .js,.vue src",
+    "tc": "./node_modules/.bin/quasar dev",
+    "tc:nas": "WSS='ws://ws.kebler.net' npm run tc"
+  },
+  "dependencies": {
+    "@quasar/extras": "^1.2.0",
+    "quasar": "^1.0.0"
+  },
+  "devDependencies": {
+    "@quasar/app": "^1.0.0",
+    "@vue/eslint-config-standard": "^4.0.0",
+    "babel-eslint": "^10.0.1",
+    "eslint": "^5.10.0",
+    "eslint-loader": "^2.1.1",
+    "eslint-plugin-vue": "^5.0.0"
+  },
+  "engines": {
+    "node": ">= 8.9.0",
+    "npm": ">= 5.6.0",
+    "yarn": ">= 1.6.0"
+  },
+  "browserslist": [
+    "last 1 version, not dead, ie >= 11"
+  ]
+}
diff --git a/example/client/quasar.conf.js b/example/client/quasar.conf.js
new file mode 100644
index 0000000..be3bca9
--- /dev/null
+++ b/example/client/quasar.conf.js
@@ -0,0 +1,182 @@
+// Configuration for your app
+// https://quasar.dev/quasar-cli/quasar-conf-js
+
+module.exports = function (ctx) {
+  return {
+    // app boot file (/src/boot)
+    // --> boot files are part of "main.js"
+    // boot used to be plugins
+    boot: ['socket'], // uci-consumer-client websocket
+    css: [
+      'app.styl'
+    ],
+
+    extras: [
+      // 'ionicons-v4',
+      // 'mdi-v3',
+      // 'fontawesome-v5',
+      // 'eva-icons',
+      // 'themify',
+      // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
+      // 'roboto-font', // optional, you are not bound to it
+      'material-icons' // optional, you are not bound to it
+    ],
+
+    framework: {
+      // iconSet: 'ionicons-v4',
+      // lang: 'de', // Quasar language
+
+      // all: true, // --- includes everything; for dev only!
+
+      components: [
+        'QLayout',
+        'QHeader',
+        'QDrawer',
+        'QPageContainer',
+        'QPage',
+        'QToolbar',
+        'QToolbarTitle',
+        'QBtn',
+        'QIcon',
+        'QList',
+        'QItem',
+        'QItemSection',
+        'QItemLabel',
+        'QInput',
+        'QSelect',
+        'QField',
+        'QFooter',
+        'QTooltip'
+      ],
+
+      directives: [
+        'Ripple'
+      ],
+
+      // Quasar plugins
+      plugins: [
+        'Notify'
+      ]
+    },
+
+    supportIE: false,
+
+    build: {
+      // added to support communication with websocket and backend database
+      env: ctx.dev
+        // pass environment variable to browser client
+        ? { // so on dev we'll have
+          DBURL: JSON.stringify(process.env.DBURL || 'ws://localhost:3030'),
+          WSS: JSON.stringify(process.env.WSS || 'ws://localhost:8090')
+        }
+        : { // and on build (production):
+          DBURL: JSON.stringify(process.env.DBURL || 'ws://switches.kebler.net:3030'),
+          WSS: JSON.stringify(process.env.WSS || 'ws://relays.kebler.net:8090')
+        },
+      scopeHoisting: true,
+      vueRouterMode: 'history',
+      // vueCompiler: true,
+      // gzip: true,
+      // analyze: true,
+      // extractCSS: false,
+      extendWebpack (cfg) {
+        cfg.module.rules.push({
+          enforce: 'pre',
+          test: /\.(js|vue)$/,
+          loader: 'eslint-loader',
+          exclude: /node_modules/,
+          options: {
+            formatter: require('eslint').CLIEngine.getFormatter('stylish')
+          }
+        })
+      }
+    },
+
+    devServer: {
+      // https: true,
+      // port: 8080,
+      open: true // opens browser window automatically
+    },
+
+    // animations: 'all', // --- includes all animations
+    animations: [],
+
+    ssr: {
+      pwa: false
+    },
+
+    pwa: {
+      // workboxPluginMode: 'InjectManifest',
+      // workboxOptions: {}, // only for NON InjectManifest
+      manifest: {
+        // name: 'Quasar App',
+        // short_name: 'Quasar App',
+        // description: 'a test websocket client for uci websocket server',
+        display: 'standalone',
+        orientation: 'portrait',
+        background_color: '#ffffff',
+        theme_color: '#027be3',
+        icons: [
+          {
+            'src': 'statics/icons/icon-128x128.png',
+            'sizes': '128x128',
+            'type': 'image/png'
+          },
+          {
+            'src': 'statics/icons/icon-192x192.png',
+            'sizes': '192x192',
+            'type': 'image/png'
+          },
+          {
+            'src': 'statics/icons/icon-256x256.png',
+            'sizes': '256x256',
+            'type': 'image/png'
+          },
+          {
+            'src': 'statics/icons/icon-384x384.png',
+            'sizes': '384x384',
+            'type': 'image/png'
+          },
+          {
+            'src': 'statics/icons/icon-512x512.png',
+            'sizes': '512x512',
+            'type': 'image/png'
+          }
+        ]
+      }
+    },
+
+    cordova: {
+      // id: 'org.cordova.quasar.app',
+      // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
+    },
+
+    electron: {
+      // bundler: 'builder', // or 'packager'
+
+      extendWebpack (cfg) {
+        // do something with Electron main process Webpack cfg
+        // chainWebpack also available besides this extendWebpack
+      },
+
+      packager: {
+        // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
+
+        // OS X / Mac App Store
+        // appBundleId: '',
+        // appCategoryType: '',
+        // osxSign: '',
+        // protocol: 'myapp://path',
+
+        // Windows only
+        // win32metadata: { ... }
+      },
+
+      builder: {
+        // https://www.electron.build/configuration/configuration
+
+        // appId: 'test-client-new'
+      }
+    }
+  }
+}
diff --git a/test-client/src/App.vue b/example/client/src/App.vue
similarity index 100%
rename from test-client/src/App.vue
rename to example/client/src/App.vue
diff --git a/test-client/src/assets/quasar-logo-full.svg b/example/client/src/assets/quasar-logo-full.svg
similarity index 100%
rename from test-client/src/assets/quasar-logo-full.svg
rename to example/client/src/assets/quasar-logo-full.svg
diff --git a/test-client/src/assets/sad.svg b/example/client/src/assets/sad.svg
similarity index 100%
rename from test-client/src/assets/sad.svg
rename to example/client/src/assets/sad.svg
diff --git a/test-client/src/components/.gitkeep b/example/client/src/boot/.gitkeep
similarity index 100%
rename from test-client/src/components/.gitkeep
rename to example/client/src/boot/.gitkeep
diff --git a/test-client/src/plugins/socket.js b/example/client/src/boot/socket.js
similarity index 85%
rename from test-client/src/plugins/socket.js
rename to example/client/src/boot/socket.js
index f998a7d..fd37649 100644
--- a/test-client/src/plugins/socket.js
+++ b/example/client/src/boot/socket.js
@@ -1,5 +1,5 @@
 // import WebSocket from '@uci/websocket-client'
-import WebSocket from '../../../src'
+import WebSocket from '../../../../src'
 
 const ws = new WebSocket(process.env.WSS || 'ws://0.0.0.0:8090')
 
diff --git a/test-client/src/plugins/.gitkeep b/example/client/src/components/.gitkeep
similarity index 100%
rename from test-client/src/plugins/.gitkeep
rename to example/client/src/components/.gitkeep
diff --git a/example/client/src/css/app.styl b/example/client/src/css/app.styl
new file mode 100644
index 0000000..16e5398
--- /dev/null
+++ b/example/client/src/css/app.styl
@@ -0,0 +1,22 @@
+// app global css
+.q-page-container
+  background $accent
+  display: flex;
+  justify-content: center;
+.q-page
+   width 80%
+.q-field
+  padding 0
+.q-input
+.q-select
+  background white
+  padding 0 .2em
+  margin .2em
+.response
+  .q-textarea
+  .q-input
+    background $secondary
+    padding 0 1em
+.q-item
+   padding 0
+   margin 0
diff --git a/example/client/src/css/quasar.variables.styl b/example/client/src/css/quasar.variables.styl
new file mode 100644
index 0000000..e7b9d78
--- /dev/null
+++ b/example/client/src/css/quasar.variables.styl
@@ -0,0 +1,21 @@
+// Quasar Stylus Variables
+// --------------------------------------------------
+// To customize the look and feel of this app, you can override
+// the Stylus variables found in Quasar's source Stylus files.
+
+// Check documentation for full list of Quasar variables
+
+// It's highly recommended to change the default colors
+// to match your app's branding.
+// Tip: Use the "Theme Builder" on Quasar's documentation website.
+// https://quasar.dev/style/theme-builder
+
+
+$primary   = #006cd6
+$secondary = #26A69A
+$accent    = #278eb0
+
+$positive  = #21BA45
+$negative  = #C10015
+$info      = #31CCEC
+$warning   = #F2C037
diff --git a/test-client/src/index.template.html b/example/client/src/index.template.html
similarity index 72%
rename from test-client/src/index.template.html
rename to example/client/src/index.template.html
index be92ba0..c0e888f 100644
--- a/test-client/src/index.template.html
+++ b/example/client/src/index.template.html
@@ -1,25 +1,22 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
+    <title><%= htmlWebpackPlugin.options.productName %></title>
+
     <meta charset="utf-8">
     <meta name="description" content="<%= htmlWebpackPlugin.options.productDescription %>">
     <meta name="format-detection" content="telephone=no">
     <meta name="msapplication-tap-highlight" content="no">
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (htmlWebpackPlugin.options.ctx.mode.cordova) { %>, viewport-fit=cover<% } %>">
-    <title><%= htmlWebpackPlugin.options.productName %></title>
 
-    <link rel="icon" href="statics/quasar-logo.png" type="image/x-icon">
-    <link rel="icon" type="image/png" sizes="32x32" href="statics/icons/favicon-32x32.png">
+    <link rel="icon" type="image/png" href="statics/app-logo-128x128.png">
     <link rel="icon" type="image/png" sizes="16x16" href="statics/icons/favicon-16x16.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="statics/icons/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="96x96" href="statics/icons/favicon-96x96.png">
+    <link rel="icon" type="image/ico" href="statics/icons/favicon.ico">
   </head>
   <body>
-    <noscript>
-      This is your fallback content in case JavaScript fails to load.
-    </noscript>
-
-    <!-- DO NOT touch the following <div> -->
+    <!-- DO NOT touch the following DIV -->
     <div id="q-app"></div>
-
-    <!-- built files will be auto injected here -->
   </body>
 </html>
diff --git a/example/client/src/layouts/MyLayout.vue b/example/client/src/layouts/MyLayout.vue
new file mode 100644
index 0000000..10ff526
--- /dev/null
+++ b/example/client/src/layouts/MyLayout.vue
@@ -0,0 +1,110 @@
+<template>
+  <q-layout view="lHh Lpr lFf">
+    <q-header elevated>
+      <q-toolbar>
+        <q-btn
+          flat
+          dense
+          round
+          @click="leftDrawerOpen = !leftDrawerOpen"
+          aria-label="Menu"
+        >
+          <q-icon name="menu" />
+        </q-btn>
+
+        <q-toolbar-title>
+          Quasar App
+        </q-toolbar-title>
+
+        <div>Quasar v{{ $q.version }}</div>
+      </q-toolbar>
+    </q-header>
+
+    <q-drawer
+      v-model="leftDrawerOpen"
+      bordered
+      content-class="bg-grey-2"
+    >
+      <q-list>
+        <q-item-label header>Essential Links</q-item-label>
+        <q-item clickable tag="a" target="_blank" href="https://quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="school" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Docs</q-item-label>
+            <q-item-label caption>quasar.dev</q-item-label>
+          </q-item-section>
+        </q-item>
+        <q-item clickable tag="a" target="_blank" href="https://github.quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="code" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Github</q-item-label>
+            <q-item-label caption>github.com/quasarframework</q-item-label>
+          </q-item-section>
+        </q-item>
+        <q-item clickable tag="a" target="_blank" href="https://chat.quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="chat" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Discord Chat Channel</q-item-label>
+            <q-item-label caption>chat.quasar.dev</q-item-label>
+          </q-item-section>
+        </q-item>
+        <q-item clickable tag="a" target="_blank" href="https://forum.quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="record_voice_over" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Forum</q-item-label>
+            <q-item-label caption>forum.quasar.dev</q-item-label>
+          </q-item-section>
+        </q-item>
+        <q-item clickable tag="a" target="_blank" href="https://twitter.quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="rss_feed" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Twitter</q-item-label>
+            <q-item-label caption>@quasarframework</q-item-label>
+          </q-item-section>
+        </q-item>
+        <q-item clickable tag="a" target="_blank" href="https://facebook.quasar.dev">
+          <q-item-section avatar>
+            <q-icon name="public" />
+          </q-item-section>
+          <q-item-section>
+            <q-item-label>Facebook</q-item-label>
+            <q-item-label caption>@QuasarFramework</q-item-label>
+          </q-item-section>
+        </q-item>
+      </q-list>
+    </q-drawer>
+
+    <q-page-container>
+      <router-view />
+    </q-page-container>
+  </q-layout>
+</template>
+
+<script>
+import { openURL } from 'quasar'
+
+export default {
+  name: 'MyLayout',
+  data () {
+    return {
+      leftDrawerOpen: this.$q.platform.is.desktop
+    }
+  },
+  methods: {
+    openURL
+  }
+}
+</script>
+
+<style>
+</style>
diff --git a/example/client/src/layouts/default.vue b/example/client/src/layouts/default.vue
new file mode 100644
index 0000000..e5b3f77
--- /dev/null
+++ b/example/client/src/layouts/default.vue
@@ -0,0 +1,38 @@
+<template>
+  <q-layout view="hHh lpR fFf">
+
+    <q-header elevated class="bg-primary text-white">
+      <q-toolbar>
+        <q-toolbar-title>
+          Title
+        </q-toolbar-title>
+      </q-toolbar>
+    </q-header>
+
+    <q-page-container>
+      <router-view />
+    </q-page-container>
+
+    <q-footer elevated class="bg-grey-8 text-white">
+      <q-toolbar>
+        <q-toolbar-title>
+          Title
+        </q-toolbar-title>
+      </q-toolbar>
+    </q-footer>
+
+  </q-layout>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+    }
+  }
+}
+</script>
+
+<style lang="stylus">
+
+</style>
diff --git a/test-client/src/pages/404.vue b/example/client/src/pages/Error404.vue
similarity index 86%
rename from test-client/src/pages/404.vue
rename to example/client/src/pages/Error404.vue
index 6484cb2..cfaab5f 100644
--- a/test-client/src/pages/404.vue
+++ b/example/client/src/pages/Error404.vue
@@ -14,3 +14,9 @@
     >Go back</q-btn>
   </div>
 </template>
+
+<script>
+export default {
+  name: 'Error404'
+}
+</script>
diff --git a/example/client/src/pages/Index.vue b/example/client/src/pages/Index.vue
new file mode 100644
index 0000000..ac083ca
--- /dev/null
+++ b/example/client/src/pages/Index.vue
@@ -0,0 +1,148 @@
+<template>
+
+<q-page padding class="" >
+<q-list class="">
+<q-item class="">
+  <q-item-section side>
+    <q-btn color="secondary" round @click="send" icon="send">
+      <q-tooltip>
+        Click to send this command and payload to the sever
+      </q-tooltip>
+    </q-btn>
+  </q-item-section>
+  <q-item-section >
+    <q-item-label>Command</q-item-label>
+    <!-- <q-input label="Enter a . delimited command to send to server" v-model="cmd" />
+   -->
+    <q-select
+        v-model="cmd"
+        :options="commands"
+        label="Choose An Available Command to Send"
+        emit-value
+      ></q-select>
+  </q-item-section>
+</q-item>
+
+<q-item><div class="col">Property</div>:<div class="col">Value</div></q-item>
+<q-item><q-input  class="col" readonly v-model="key[0]" />:<q-input dense class="col" v-model="value[0]" /></q-item>
+<q-item><q-input class="col" readonly v-model="key[1]" />:<q-input class="col" v-model="value[1]" /></q-item>
+<q-item><q-input class="col" label="a custom property in payload" v-model="key[2]" />:<q-input class="col" v-model="value[2]" /></q-item>
+</q-list>
+<!-- <q-btn :class="switches[0]" @click="toggle(1)">Switch 1</q-btn>
+<q-btn :class="switches[1]"  @click="toggle(2)">Switch 2</q-btn>
+<q-btn :class="switches[2]"  @click="toggle(3)">Switch 3</q-btn>
+<q-btn :class="switches[3]"  @click="toggle(4)">Switch 4</q-btn> -->
+<q-list class="response">
+<q-input  v-model="packet" readonly  label="Sending Packet:" />
+<q-input  v-model="resMsg" readonly label="Socket/Server Response Message:" />
+<q-input  v-model="resPayload" readonly label="Socket/Server Response Payload:" />
+<q-input  v-model="pushed" readonly type="textarea" label="Pushed from Socket/Server:" />
+</q-list>
+</q-page>
+</template>
+<script>
+import btc from 'better-try-catch'
+// import socket from '../socket.js'
+
+export default {
+  data () {
+    return {
+      cmd: 'on',
+      commands: [
+        {
+          label: 'echo',
+          value: 'echo',
+          description: 'echo',
+          icon: 'no'
+        },
+        {
+          label: 'on',
+          value: 'on',
+          description: 'turn on something',
+          icon: 'mdi:lightbulb'
+        },
+        {
+          label: 'off',
+          value: 'off',
+          description: 'turn off something',
+          icon: 'lightbulb-off'
+        },
+        {
+          label: 'bogus',
+          value: 'bogus',
+          description: 'turn off something',
+          icon: 'no'
+        }
+      ],
+      packet: '',
+      resMsg: '',
+      resPayload: '',
+      key: ['id', 'brightness'],
+      value: ['not set', 0],
+      pushed: '',
+      switches: ['off', 'off', 'off', 'off']
+    }
+  },
+  methods: {
+    async send () {
+      this.clear()
+      let packet = {
+        cmd: this.cmd,
+        [this.key[0]]: this.value[0],
+        [this.key[1]]: this.value[1],
+        [this.key[2]]: this.value[2]
+      }
+      this.packet = JSON.stringify(packet)
+      let [err, res] = await btc(this.$socket.send)(packet)
+      if (err) {
+        console.log('error ', err)
+        this.$q.notify({
+          color: 'negative',
+          message: 'Error in repsonse of packet send'
+        })
+      } else {
+        delete res._header
+        this.resMsg = res.msg
+        this.resPayload = JSON.stringify(res.payload)
+      }
+    },
+    clear () {
+      this.pushed = ''
+      this.resMsg = ''
+      this.resPayload = ''
+      this.packet = ''
+    }
+  },
+  async mounted () {
+    this.$q.notify({
+      color: 'info',
+      message: `Client connecting to', ${this.$socket.url}`
+    })
+    let [err] = await btc(this.$socket.connect)()
+    if (err) {
+      this.$q.notify({
+        color: 'negative',
+        message: 'Websocket Server Not Available'
+      })
+    } else {
+      this.$q.notify({ color: 'positive', message: 'Ready' })
+      this.$socket.listen()
+      this.clear()
+    }
+    this.$socket.on('pushed', packet => {
+      delete packet._header
+      this.pushed = JSON.stringify(packet)
+    })
+  }
+}
+</script>
+
+<style lang="stylus">
+
+.on
+    background $positive
+
+.off
+    background grey
+
+</style>
diff --git a/example/client/src/pages/Index.vue.org b/example/client/src/pages/Index.vue.org
new file mode 100644
index 0000000..7125cfc
--- /dev/null
+++ b/example/client/src/pages/Index.vue.org
@@ -0,0 +1,14 @@
+<template>
+  <q-page class="flex flex-center">
+    <img alt="Quasar logo" src="~assets/quasar-logo-full.svg">
+  </q-page>
+</template>
+
+<style>
+</style>
+
+<script>
+export default {
+  name: 'PageIndex'
+}
+</script>
diff --git a/example/client/src/router/index.js b/example/client/src/router/index.js
new file mode 100644
index 0000000..46c6d54
--- /dev/null
+++ b/example/client/src/router/index.js
@@ -0,0 +1,26 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+
+import routes from './routes'
+
+Vue.use(VueRouter)
+
+/*
+ * If not building with SSR mode, you can
+ * directly export the Router instantiation
+ */
+
+export default function (/* { store, ssrContext } */) {
+  const Router = new VueRouter({
+    scrollBehavior: () => ({ x: 0, y: 0 }),
+    routes,
+
+    // Leave these as is and change from quasar.conf.js instead!
+    // quasar.conf.js -> build -> vueRouterMode
+    // quasar.conf.js -> build -> publicPath
+    mode: process.env.VUE_ROUTER_MODE,
+    base: process.env.VUE_ROUTER_BASE
+  })
+
+  return Router
+}
diff --git a/example/client/src/router/routes.js b/example/client/src/router/routes.js
new file mode 100644
index 0000000..24155d3
--- /dev/null
+++ b/example/client/src/router/routes.js
@@ -0,0 +1,20 @@
+
+const routes = [
+  {
+    path: '/',
+    component: () => import('layouts/default.vue'),
+    children: [
+      { path: '', component: () => import('pages/Index.vue') }
+    ]
+  }
+]
+
+// Always leave this as last one
+if (process.env.MODE !== 'ssr') {
+  routes.push({
+    path: '*',
+    component: () => import('pages/Error404.vue')
+  })
+}
+
+export default routes
diff --git a/example/client/src/statics/app-logo-128x128.png b/example/client/src/statics/app-logo-128x128.png
new file mode 100644
index 0000000..0a3012a
Binary files /dev/null and b/example/client/src/statics/app-logo-128x128.png differ
diff --git a/example/client/src/statics/icons/apple-icon-120x120.png b/example/client/src/statics/icons/apple-icon-120x120.png
new file mode 100644
index 0000000..387499a
Binary files /dev/null and b/example/client/src/statics/icons/apple-icon-120x120.png differ
diff --git a/example/client/src/statics/icons/apple-icon-152x152.png b/example/client/src/statics/icons/apple-icon-152x152.png
new file mode 100644
index 0000000..5b76f91
Binary files /dev/null and b/example/client/src/statics/icons/apple-icon-152x152.png differ
diff --git a/example/client/src/statics/icons/apple-icon-167x167.png b/example/client/src/statics/icons/apple-icon-167x167.png
new file mode 100644
index 0000000..0d743a6
Binary files /dev/null and b/example/client/src/statics/icons/apple-icon-167x167.png differ
diff --git a/example/client/src/statics/icons/apple-icon-180x180.png b/example/client/src/statics/icons/apple-icon-180x180.png
new file mode 100644
index 0000000..f91040d
Binary files /dev/null and b/example/client/src/statics/icons/apple-icon-180x180.png differ
diff --git a/example/client/src/statics/icons/favicon-16x16.png b/example/client/src/statics/icons/favicon-16x16.png
new file mode 100644
index 0000000..20b3bb7
Binary files /dev/null and b/example/client/src/statics/icons/favicon-16x16.png differ
diff --git a/example/client/src/statics/icons/favicon-32x32.png b/example/client/src/statics/icons/favicon-32x32.png
new file mode 100644
index 0000000..ed028e2
Binary files /dev/null and b/example/client/src/statics/icons/favicon-32x32.png differ
diff --git a/example/client/src/statics/icons/favicon-96x96.png b/example/client/src/statics/icons/favicon-96x96.png
new file mode 100644
index 0000000..7c749e5
Binary files /dev/null and b/example/client/src/statics/icons/favicon-96x96.png differ
diff --git a/example/client/src/statics/icons/favicon.ico b/example/client/src/statics/icons/favicon.ico
new file mode 100644
index 0000000..b385345
Binary files /dev/null and b/example/client/src/statics/icons/favicon.ico differ
diff --git a/example/client/src/statics/icons/icon-128x128.png b/example/client/src/statics/icons/icon-128x128.png
new file mode 100644
index 0000000..0a3012a
Binary files /dev/null and b/example/client/src/statics/icons/icon-128x128.png differ
diff --git a/example/client/src/statics/icons/icon-192x192.png b/example/client/src/statics/icons/icon-192x192.png
new file mode 100644
index 0000000..144d474
Binary files /dev/null and b/example/client/src/statics/icons/icon-192x192.png differ
diff --git a/example/client/src/statics/icons/icon-256x256.png b/example/client/src/statics/icons/icon-256x256.png
new file mode 100644
index 0000000..9ab309b
Binary files /dev/null and b/example/client/src/statics/icons/icon-256x256.png differ
diff --git a/example/client/src/statics/icons/icon-384x384.png b/example/client/src/statics/icons/icon-384x384.png
new file mode 100644
index 0000000..8bb494e
Binary files /dev/null and b/example/client/src/statics/icons/icon-384x384.png differ
diff --git a/example/client/src/statics/icons/icon-512x512.png b/example/client/src/statics/icons/icon-512x512.png
new file mode 100644
index 0000000..9b9ff56
Binary files /dev/null and b/example/client/src/statics/icons/icon-512x512.png differ
diff --git a/example/client/src/statics/icons/ms-icon-144x144.png b/example/client/src/statics/icons/ms-icon-144x144.png
new file mode 100644
index 0000000..29fd72a
Binary files /dev/null and b/example/client/src/statics/icons/ms-icon-144x144.png differ
diff --git a/example/client/src/statics/icons/safari-pinned-tab.svg b/example/client/src/statics/icons/safari-pinned-tab.svg
new file mode 100644
index 0000000..1473927
--- /dev/null
+++ b/example/client/src/statics/icons/safari-pinned-tab.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1240" height="1240"><path d="M585.5 119.157c-24.392 1.775-55.454 6.582-80.743 12.495l-10.743 2.512-.257 65.522-.257 65.523-12.5 4.911c-24.453 9.608-54.301 25.574-75.692 40.488-14.402 10.041-29.52 22.393-29.025 23.713.243.648 1.692 5.443 3.22 10.655 11.868 40.48 32.267 84.639 55.173 119.442l8.503 12.917 6.683-12.417c23.502-43.672 46.807-74.722 84.066-112.002 25.738-25.754 47.825-44.173 78.072-65.109 33.386-23.108 77-46.934 117.761-64.332l16.261-6.94-.261-40.974-.261-40.973-4.5-1.319c-8.958-2.625-43.862-9.169-59.5-11.155-31.749-4.032-66.513-5.102-96-2.957M734.906 277.25c-22.472 24.627-42.334 51.05-58.443 77.75-5.099 8.45-21.464 39.014-21.462 40.083 0 .229 14.287.445 31.75.479 33.627.065 45.612 1.017 75.303 5.978 85.759 14.331 172.63 53.33 254.813 114.394l15.221 11.31 25.706-14.808c14.138-8.144 30.112-17.312 35.497-20.372l9.79-5.564-.61-3.5c-1.096-6.29-14.149-44.185-19.977-58-17.139-40.622-35.248-72.077-61.599-107-11.686-15.488-30.818-37.844-39.039-45.62l-4.356-4.119-55 31.858c-30.25 17.522-55.747 32.106-56.66 32.408-1.079.358-4.75-1.93-10.5-6.543-20.084-16.116-40.545-29.274-64.607-41.547C777.601 277.739 748.585 265 746.461 265c-.207 0-5.407 5.512-11.555 12.25m-483.911 2.889c-52.729 57.452-89.592 121.745-111.254 194.044l-3.501 11.683 56.707 32.735 56.706 32.734-1.326 7.583c-4.069 23.272-5.894 57.248-4.381 81.582.926 14.898 4.591 46.254 5.526 47.28.898.986 34.289 8.122 48.028 10.264 28.958 4.515 64.488 6.499 90.867 5.074 10.377-.56 19.07-1.222 19.319-1.471.248-.248-2.035-4.306-5.074-9.017-37.96-58.843-62.879-131.564-72.005-210.13-3.219-27.711-3.869-43.866-3.307-82.149.534-36.338 1.631-53.441 5.12-79.832.798-6.039 1.368-11.04 1.266-11.112-.102-.073-15.261-8.815-33.686-19.427-18.425-10.613-34.464-19.919-35.642-20.682-2.027-1.312-2.739-.735-13.363 10.841M606.5 522.653c-25.669 4.073-49.712 18.357-64.437 38.283-12.956 17.531-18.769 33.768-19.713 55.064-1.087 24.502 5.901 45.6 21.676 65.452 13.091 16.473 32.315 28.634 53.974 34.141 10.222 2.599 34.507 2.629 44 .054 24.469-6.637 42.328-18.418 56.253-37.107 8.576-11.511 13.261-21.347 17.403-36.54 2.782-10.202 2.502-34.762-.523-46-4.654-17.286-13.403-32.422-26.057-45.076-18.639-18.639-40.322-27.911-66.576-28.47-7.15-.152-14.35-.062-16 .199m243.676 14.396c-9.529.421-17.487.928-17.685 1.126-.198.198 3.43 6.427 8.061 13.843 9.872 15.805 25.076 45.255 32.515 62.982 17.89 42.628 30.726 92.267 36.33 140.5 5.776 49.707 5.41 110.661-.955 158.936-.793 6.015-1.442 12.144-1.442 13.62 0 2.476 2.712 4.248 35.027 22.888 19.264 11.113 35.44 20.059 35.946 19.88.506-.178 5.205-4.957 10.444-10.619 40.968-44.285 71.417-91.321 94.113-145.385 7.518-17.906 21.003-57.989 20.208-60.062-.302-.785-25.229-15.681-55.393-33.103-30.165-17.421-55.37-32.011-56.011-32.422-.843-.54-.908-2.132-.233-5.74 6.158-32.924 6.854-78.418 1.771-115.688l-2.141-15.695-10.616-2.49c-29.261-6.862-56.983-10.974-81.615-12.105-25.026-1.149-31.483-1.212-48.324-.466M173.193 732.877c-18.869 10.91-34.771 20.301-35.338 20.868-.708.708.416 5.685 3.59 15.893 22.372 71.955 57.534 133.26 108.468 189.112 6.144 6.737 11.715 12.235 12.379 12.217.665-.019 26.402-14.607 57.195-32.419l55.987-32.386 5.013 4.231c28.719 24.239 69.849 48.122 106.705 61.961l6.691 2.512 11.972-13.183c14.282-15.727 20.74-23.512 31.675-38.183 15.78-21.171 34.174-51.134 42.972-70l4.197-9-32.6-.072c-33.662-.073-44.236-.877-72.599-5.517-52.086-8.52-104.017-26.026-157-52.926-34.47-17.5-69.941-39.589-100.682-62.699-7.525-5.657-13.825-10.277-14-10.266-.175.011-15.756 8.946-34.625 19.857M791.52 772.25c-22.058 42.207-48.977 78.371-85.449 114.795-38.124 38.072-77.236 67.416-127.546 95.69-17.969 10.099-51.743 26.686-70.775 34.76l-13.75 5.834v82.327l13.75 3.194c23.233 5.395 43.059 8.689 68.25 11.336 16.09 1.691 73.361 1.705 89 .021 25.772-2.774 47.439-6.375 68.25-11.344l12.75-3.045V974.95l2.75-1.001c20.982-7.643 52.157-22.755 69.847-33.859 18.882-11.852 45.274-31.559 45.357-33.868.102-2.831-15.119-46.644-20.841-59.99-7.171-16.726-16.651-35.878-24.655-49.808-6.712-11.68-20.708-33.401-21.531-33.415-.315-.005-2.748 4.154-5.407 9.241" fill="#42a5f5" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/example/server.js b/example/server.js
new file mode 100644
index 0000000..a4eab28
--- /dev/null
+++ b/example/server.js
@@ -0,0 +1,36 @@
+import Socket from '@uci/websocket'
+
+// ws server to example ws client
+
+async function packetProcess (packet) {
+  return new Promise(resolve => {
+    let res = {}
+    switch (packet.cmd) {
+    case 'echo':
+      res.msg = 'Echoing Back any payload propery'
+      res.payload = packet.payload
+      this.push({msg:'pushing echo to to any clients also', res:res})
+      break
+    case 'on':
+    case 'off':
+      res.msg = `Command turn ${packet.cmd} was sent for light id: ${packet.id ||'none!'} of brightness: ${packet.brightness || 0}`
+      res.payload = {switch:packet.cmd}
+      this.push(res)
+      break
+    default:
+      res.msg = `command ${packet.cmd} was unknown at server echo payload back`
+      res.payload = {}
+    }
+
+    resolve(res)
+  })
+}
+
+// let test = new Test()
+let test = new Socket({ port: 8090, clientTracking: true })
+test.registerPacketProcessor(packetProcess)
+;(async () => {
+  console.log(await test.create())
+})().catch(err => {
+  console.error('FATAL: UNABLE TO START SYSTEM!\n', err)
+})
diff --git a/package.json b/package.json
index b5e4b05..aa60133 100644
--- a/package.json
+++ b/package.json
@@ -1,10 +1,11 @@
 {
   "name": "@uci/websocket-client",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "JSON packet browser client over web socket",
   "main": "src",
   "scripts": {
-    "cd": "cd test-client && quasar dev"
+    "example": "cd ./example/client && npm run tc",
+    "example:server": "node -r esm ./example/server.js"
   },
   "author": "David Kebler",
   "license": "MIT",
@@ -26,11 +27,14 @@
     "url": "https://github.com/uCOMmandIt/websocket-client/issues"
   },
   "homepage": "https://github.com/uCOMmandIt/websocket-client#readme",
-  "devDependencies": {},
+  "devDependencies": {
+    "@uci/websocket": "^0.3.7",
+    "esm": "^3.2.25"
+  },
   "dependencies": {
-    "auto-bind": "^2.0.0",
+    "auto-bind": "^2.1.0",
     "await-to-js": "^2.1.1",
     "better-try-catch": "^0.6.2",
-    "eventemitter3": "^3.1.0"
+    "eventemitter3": "^4.0.0"
   }
 }
diff --git a/test-client/.babelrc b/test-client/.babelrc
deleted file mode 100644
index ce118af..0000000
--- a/test-client/.babelrc
+++ /dev/null
@@ -1,28 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/preset-env", {
-        "modules": false,
-        "loose": false,
-        "useBuiltIns": "usage"
-      }
-    ],
-    [
-      "@babel/preset-stage-2", {
-        "modules": false,
-        "loose": false,
-        "useBuiltIns": true,
-        "decoratorsLegacy": true
-      }
-    ]
-  ],
-  "plugins": [
-    [
-      "@babel/transform-runtime", {
-        "polyfill": false,
-        "regenerator": false
-      }
-    ]
-  ],
-  "comments": false
-}
diff --git a/test-client/.eslintrc.js b/test-client/.eslintrc.js
deleted file mode 100644
index 7229fd7..0000000
--- a/test-client/.eslintrc.js
+++ /dev/null
@@ -1,44 +0,0 @@
-module.exports = {
-  root: true,
-  parserOptions: {
-    parser: 'babel-eslint',
-    sourceType: 'module'
-  },
-  env: {
-    browser: true
-  },
-  extends: [
-    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
-    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
-    'plugin:vue/essential',
-    // https://github.com/standard/standard/blob/master/docs/RULES-en.md
-    'standard'
-  ],
-  // required to lint *.vue files
-  plugins: ['vue'],
-  globals: {
-    ga: true, // Google Analytics
-    cordova: true,
-    __statics: true
-  },
-  // add your custom rules here
-  rules: {
-    // allow async-await
-    'generator-star-spacing': 'off',
-    'space-before-function-paren': ['error', 'always'],
-    // allow paren-less arrow functions
-    'arrow-parens': 0,
-    'one-var': 0,
-    'import/first': 0,
-    'import/named': 2,
-    'import/namespace': 2,
-    'import/default': 2,
-    'import/export': 2,
-    'import/extensions': 0,
-    'import/no-unresolved': 0,
-    'import/no-extraneous-dependencies': 0,
-
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
-  }
-}
diff --git a/test-client/README.md b/test-client/README.md
deleted file mode 100644
index 51830ce..0000000
--- a/test-client/README.md
+++ /dev/null
@@ -1,3 +0,0 @@
-# Quasar App
-
-> WIP
diff --git a/test-client/package.json b/test-client/package.json
deleted file mode 100644
index 4b33a6c..0000000
--- a/test-client/package.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
-  "name": "client",
-  "version": "1.0.0",
-  "description": "simple web socket client tester",
-  "productName": "client",
-  "cordovaId": "org.cordova.quasar.app",
-  "author": "David Kebler <d@kebler.net>",
-  "private": true,
-  "scripts": {
-    "lint": "eslint --ext .js,.vue src",
-    "tcw": "WSS='ws://pine64.kebler.net:8090' quasar dev",
-    "tc": "quasar dev"
-  },
-  "dependencies": {
-    "@uci/websocket-client": "^0.1.4",
-    "axios": "^0.18.0",
-    "better-try-catch": "^0.6.2"
-  },
-  "devDependencies": {
-    "babel-eslint": "^8.2.1",
-    "eslint": "^4.18.2",
-    "eslint-config-standard": "^11.0.0",
-    "eslint-friendly-formatter": "^4.0.1",
-    "eslint-loader": "^2.0.0",
-    "eslint-plugin-import": "^2.9.0",
-    "eslint-plugin-node": "^6.0.1",
-    "eslint-plugin-promise": "^3.7.0",
-    "eslint-plugin-standard": "^3.0.1",
-    "eslint-plugin-vue": "^4.3.0",
-    "quasar-cli": "^0.17.22",
-    "strip-ansi": "=3.0.1"
-  },
-  "engines": {
-    "node": ">= 8.9.0",
-    "npm": ">= 5.6.0"
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not ie <= 10"
-  ]
-}
diff --git a/test-client/quasar.conf.js b/test-client/quasar.conf.js
deleted file mode 100644
index 1b85c78..0000000
--- a/test-client/quasar.conf.js
+++ /dev/null
@@ -1,139 +0,0 @@
-// Configuration for your app
-
-module.exports = function (ctx) {
-  return {
-    // app plugins (/src/plugins)
-    plugins: ['socket'],
-    css: ['app.styl'],
-    extras: [
-      ctx.theme.mat ? 'roboto-font' : null,
-      'material-icons',
-      ctx.theme.ios ? 'ionicons' : null
-      // 'mdi',
-      // 'fontawesome'
-    ],
-    supportIE: false,
-    build: {
-      env: ctx.dev
-        // pass environment variable to browser client
-        ? { // so on dev we'll have
-          DBURL: JSON.stringify(process.env.DBURL),
-          // DBURL: JSON.stringify('ws://192.168.0.231:3030'),
-          WSS: JSON.stringify(process.env.WSS)
-        }
-        : { // and on build (production):
-          DBURL: JSON.stringify('ws://192.168.0.231:3030'),
-          WSS: JSON.stringify('ws://relays2.kebler.net:8090')
-        },
-      scopeHoisting: true,
-      vueRouterMode: 'history',
-      // vueCompiler: true,
-      // gzip: true,
-      // analyze: true,
-      // extractCSS: false,
-      extendWebpack (cfg) {
-        cfg.module.rules.push({
-          enforce: 'pre',
-          test: /\.(js|vue)$/,
-          loader: 'eslint-loader',
-          exclude: /(node_modules|quasar)/
-        })
-      }
-    },
-    devServer: {
-      // https: true,
-      // port: 8080,
-      open: true // opens browser window automatically
-    },
-    // framework: 'all' --- includes everything; for dev only!
-    framework: {
-      components: [
-        'QLayout',
-        'QLayoutHeader',
-        'QLayoutDrawer',
-        'QPageContainer',
-        'QPage',
-        'QToolbar',
-        'QToolbarTitle',
-        'QBtn',
-        'QIcon',
-        'QList',
-        'QListHeader',
-        'QItem',
-        'QItemMain',
-        'QItemSide',
-        'QInput',
-        'QField'
-      ],
-      directives: ['Ripple'],
-      // Quasar plugins
-      plugins: ['Notify'],
-      iconSet: ctx.theme.mat ? 'material-icons' : 'ionicons'
-    },
-    // animations: 'all' --- includes all animations
-    animations: [],
-    pwa: {
-      // workboxPluginMode: 'InjectManifest',
-      // workboxOptions: {},
-      manifest: {
-        // name: 'Quasar App',
-        // short_name: 'Quasar-PWA',
-        // description: 'Best PWA App in town!',
-        display: 'standalone',
-        orientation: 'portrait',
-        background_color: '#ffffff',
-        theme_color: '#027be3',
-        icons: [
-          {
-            src: 'statics/icons/icon-128x128.png',
-            sizes: '128x128',
-            type: 'image/png'
-          },
-          {
-            src: 'statics/icons/icon-192x192.png',
-            sizes: '192x192',
-            type: 'image/png'
-          },
-          {
-            src: 'statics/icons/icon-256x256.png',
-            sizes: '256x256',
-            type: 'image/png'
-          },
-          {
-            src: 'statics/icons/icon-384x384.png',
-            sizes: '384x384',
-            type: 'image/png'
-          },
-          {
-            src: 'statics/icons/icon-512x512.png',
-            sizes: '512x512',
-            type: 'image/png'
-          }
-        ]
-      }
-    },
-    cordova: {
-      // id: 'org.cordova.quasar.app'
-    },
-    electron: {
-      // bundler: 'builder', // or 'packager'
-      extendWebpack (cfg) {
-        // do something with Electron process Webpack cfg
-      },
-      packager: {
-        // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
-        // OS X / Mac App Store
-        // appBundleId: '',
-        // appCategoryType: '',
-        // osxSign: '',
-        // protocol: 'myapp://path',
-        // Window only
-        // win32metadata: { ... }
-      },
-      builder: {
-        // https://www.electron.build/configuration/configuration
-        // appId: 'quasar-app'
-      }
-    }
-  }
-}
diff --git a/test-client/src/css/app.styl b/test-client/src/css/app.styl
deleted file mode 100644
index e3e5a1e..0000000
--- a/test-client/src/css/app.styl
+++ /dev/null
@@ -1 +0,0 @@
-// app global css
diff --git a/test-client/src/css/themes/common.variables.styl b/test-client/src/css/themes/common.variables.styl
deleted file mode 100644
index 4d659aa..0000000
--- a/test-client/src/css/themes/common.variables.styl
+++ /dev/null
@@ -1,25 +0,0 @@
-// App Shared Variables
-// --------------------------------------------------
-// To customize the look and feel of this app, you can override
-// the Stylus variables found in Quasar's source Stylus files. Setting
-// variables before Quasar's Stylus will use these variables rather than
-// Quasar's default Stylus variable values. Stylus variables specific
-// to the themes belong in either the variables.ios.styl or variables.mat.styl files.
-
-// Check documentation for full list of Quasar variables
-
-
-// App Shared Color Variables
-// --------------------------------------------------
-// It's highly recommended to change the default colors
-// to match your app's branding.
-
-$primary   = #027be3
-$secondary = #26A69A
-$tertiary  = #555
-
-$neutral   = #E0E1E2
-$positive  = #21BA45
-$negative  = #DB2828
-$info      = #31CCEC
-$warning   = #F2C037
diff --git a/test-client/src/css/themes/variables.ios.styl b/test-client/src/css/themes/variables.ios.styl
deleted file mode 100644
index 953b825..0000000
--- a/test-client/src/css/themes/variables.ios.styl
+++ /dev/null
@@ -1,7 +0,0 @@
-// App Shared Variables
-// --------------------------------------------------
-// Shared Stylus variables go in the common.variables.styl file
-@import 'common.variables'
-
-// iOS only Quasar variables overwrites
-// -----------------------------------------
diff --git a/test-client/src/css/themes/variables.mat.styl b/test-client/src/css/themes/variables.mat.styl
deleted file mode 100644
index 8169a52..0000000
--- a/test-client/src/css/themes/variables.mat.styl
+++ /dev/null
@@ -1,7 +0,0 @@
-// App Shared Variables
-// --------------------------------------------------
-// Shared Stylus variables go in the common.variables.styl file
-@import 'common.variables'
-
-// Material only Quasar variables overwrites
-// -----------------------------------------
diff --git a/test-client/src/layouts/default.vue b/test-client/src/layouts/default.vue
deleted file mode 100644
index 2a37c35..0000000
--- a/test-client/src/layouts/default.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<template>
-  <q-layout view="lHh Lpr lFf">
-    <q-layout-header>
-      <q-toolbar
-        color="primary"
-        :glossy="$q.theme === 'mat'"
-        :inverted="$q.theme === 'ios'"
-      >
-        <q-toolbar-title>
-          UCI Web Socket
-          <div slot="subtitle">web socket tester</div>
-        </q-toolbar-title>
-      </q-toolbar>
-    </q-layout-header>
-    <q-page-container>
-      <router-view />
-    </q-page-container>
-  </q-layout>
-</template>
-
-<script>
-import { openURL } from 'quasar'
-
-export default {
-  name: 'LayoutDefault',
-  data () {
-    return {
-      leftDrawerOpen: this.$q.platform.is.desktop
-    }
-  },
-  methods: {
-    openURL
-  }
-}
-</script>
-
-<style>
-</style>
diff --git a/test-client/src/pages/index.vue b/test-client/src/pages/index.vue
deleted file mode 100644
index bcc5576..0000000
--- a/test-client/src/pages/index.vue
+++ /dev/null
@@ -1,125 +0,0 @@
-<template>
-
-<q-page padding class="" >
-<q-list class="">
-<q-field
-label="Command"
-orientation="vertical"
->
-<q-item><q-input inverted color="secondary" v-model="cmd" /><q-btn class="row" color="green-8" round @click="send" icon="send" /></q-item>
-</q-field>
-<q-field class=""
-  label="Payload"
-  orientation="vertical"
-  >
-<q-item><div class="col">Key</div>:<div class="col">Value</div></q-item>
-<q-item><q-input class="col" inverted color="secondary" v-model="key[0]" />:<q-input class="col" inverted color="secondary" v-model="value[0]" /></q-item>
-<q-item><q-input class="col" inverted color="secondary" v-model="key[1]" />:<q-input class="col" inverted color="secondary" v-model="value[1]" /></q-item>
-<q-item><q-input class="col" inverted color="secondary" v-model="key[2]" />:<q-input class="col" inverted color="secondary" v-model="value[2]" /></q-item>
-</q-field>
-</q-list>
-<q-btn :class="switches[0]" @click="toggle(1)">Switch 1</q-btn>
-<q-btn :class="switches[1]"  @click="toggle(2)">Switch 2</q-btn>
-<q-btn :class="switches[2]"  @click="toggle(3)">Switch 3</q-btn>
-<q-btn :class="switches[3]"  @click="toggle(4)">Switch 4</q-btn>
-<q-input class="row" rows="2" v-model="packet" readonly inverted type="textarea" float-label="Sending Packet:" />
-<q-input class="row" rows="2" v-model="response" readonly inverted color="secondary" type="textarea" float-label="Socket/Server Response:" />
-<q-input class="row" rows="2" v-model="respayload" readonly inverted color="secondary" type="textarea" float-label="Socket/Server Response Payload:" />
-<q-input class="row" rows="2" v-model="pushed" readonly inverted color="tertiary" type="textarea" float-label="Pushed from Socket/Server:" />
-</q-page>
-</template>
-<script>
-import btc from 'better-try-catch'
-// import socket from '../socket.js'
-
-export default {
-  data () {
-    return {
-      cmd: '',
-      packet: '',
-      response: '',
-      respayload: {},
-      key: [],
-      value: [],
-      pushed: '',
-      switches: ['off', 'off', 'off', 'off']
-    }
-  },
-  methods: {
-    async send () {
-      let packet = {
-        cmd: this.cmd,
-        [this.key[0]]: this.value[0],
-        [this.key[1]]: this.value[1],
-        [this.key[2]]: this.value[2]
-      }
-      this.packet = JSON.stringify(packet)
-      let [err, res] = await btc(this.$socket.send)(packet)
-      if (err) console.log('error ', err)
-      else {
-        delete res._header
-        this.response = res.log
-        delete res.Response
-        this.packet_process(res)
-        this.respayload = JSON.stringify(res)
-      }
-    },
-    setcolor (id) {
-      return this.switches[id]
-    },
-    packet_process (packet) {
-      if (packet.cmd === 'switch/status') {
-        this.switches[packet.id - 1] = packet.status
-        this.pushed = ''
-      }
-    },
-    async toggle (id) {
-      let packet = {
-        cmd: 'switch/toggle',
-        id: id,
-        status: this.switches[id - 1]
-      }
-      this.packet = JSON.stringify(packet)
-      let [err, res] = await btc(this.$socket.send)(packet)
-      if (err) console.log('error ', err)
-      else {
-        delete res._header
-        this.response = JSON.stringify(res)
-      }
-    }
-  },
-  async mounted () {
-    console.log('mounting')
-    this.$q.notify({
-      type: 'info',
-      message: `Client connecting to', ${this.$socket.url}`
-    })
-    let [err] = await btc(this.$socket.connect)()
-    if (err) {
-      this.$q.notify({
-        type: 'negative',
-        message: 'Websocket Server Not Available'
-      })
-    } else {
-      this.$q.notify({ type: 'positive', message: 'Ready' })
-      this.$socket.listen()
-    }
-    this.$socket.on('pushed', packet => {
-      delete packet._header
-      this.packet_process(packet)
-      this.pushed = JSON.stringify(packet)
-    })
-  }
-}
-</script>
-
-<style lang="stylus">
-@import '~variables'
-
-.on
-    background $positive
-
-.off
-    background grey
-
-</style>
diff --git a/test-client/src/router/index.js b/test-client/src/router/index.js
deleted file mode 100644
index 67486b2..0000000
--- a/test-client/src/router/index.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import Vue from 'vue'
-import VueRouter from 'vue-router'
-
-import routes from './routes'
-
-Vue.use(VueRouter)
-
-const Router = new VueRouter({
-  /*
-   * NOTE! Change Vue Router mode from quasar.conf.js -> build -> vueRouterMode
-   *
-   * When going with "history" mode, please also make sure "build.publicPath"
-   * is set to something other than an empty string.
-   * Example: '/' instead of ''
-   */
-
-  // Leave as is and change from quasar.conf.js instead!
-  mode: process.env.VUE_ROUTER_MODE,
-  base: process.env.VUE_ROUTER_BASE,
-  scrollBehavior: () => ({ y: 0 }),
-  routes
-})
-
-export default Router
diff --git a/test-client/src/router/routes.js b/test-client/src/router/routes.js
deleted file mode 100644
index e098954..0000000
--- a/test-client/src/router/routes.js
+++ /dev/null
@@ -1,15 +0,0 @@
-
-export default [
-  {
-    path: '/',
-    component: () => import('layouts/default'),
-    children: [
-      { path: '', component: () => import('pages/index') }
-    ]
-  },
-
-  { // Always leave this as last one
-    path: '*',
-    component: () => import('pages/404')
-  }
-]
diff --git a/test-client/src/socket.js b/test-client/src/socket.js
deleted file mode 100644
index 48ac4b9..0000000
--- a/test-client/src/socket.js
+++ /dev/null
@@ -1,6 +0,0 @@
-// import WebSocket from '@uci/websocket-client'
-import WebSocket from '../../browser-client'
-
-const ws = new WebSocket(process.env.WSS || 'ws://0.0.0.0:8090')
-
-export default ws
diff --git a/test-client/src/statics/icons/apple-icon-152x152.png b/test-client/src/statics/icons/apple-icon-152x152.png
deleted file mode 100644
index c918acd..0000000
Binary files a/test-client/src/statics/icons/apple-icon-152x152.png and /dev/null differ
diff --git a/test-client/src/statics/icons/favicon-16x16.png b/test-client/src/statics/icons/favicon-16x16.png
deleted file mode 100644
index 177c86e..0000000
Binary files a/test-client/src/statics/icons/favicon-16x16.png and /dev/null differ
diff --git a/test-client/src/statics/icons/favicon-32x32.png b/test-client/src/statics/icons/favicon-32x32.png
deleted file mode 100644
index b8e6cdf..0000000
Binary files a/test-client/src/statics/icons/favicon-32x32.png and /dev/null differ
diff --git a/test-client/src/statics/icons/icon-128x128.png b/test-client/src/statics/icons/icon-128x128.png
deleted file mode 100644
index 590e8ce..0000000
Binary files a/test-client/src/statics/icons/icon-128x128.png and /dev/null differ
diff --git a/test-client/src/statics/icons/icon-192x192.png b/test-client/src/statics/icons/icon-192x192.png
deleted file mode 100644
index 2a9b50b..0000000
Binary files a/test-client/src/statics/icons/icon-192x192.png and /dev/null differ
diff --git a/test-client/src/statics/icons/icon-256x256.png b/test-client/src/statics/icons/icon-256x256.png
deleted file mode 100644
index 8450959..0000000
Binary files a/test-client/src/statics/icons/icon-256x256.png and /dev/null differ
diff --git a/test-client/src/statics/icons/icon-384x384.png b/test-client/src/statics/icons/icon-384x384.png
deleted file mode 100644
index 2d6dd7b..0000000
Binary files a/test-client/src/statics/icons/icon-384x384.png and /dev/null differ
diff --git a/test-client/src/statics/icons/icon-512x512.png b/test-client/src/statics/icons/icon-512x512.png
deleted file mode 100644
index a57354e..0000000
Binary files a/test-client/src/statics/icons/icon-512x512.png and /dev/null differ
diff --git a/test-client/src/statics/icons/ms-icon-144x144.png b/test-client/src/statics/icons/ms-icon-144x144.png
deleted file mode 100644
index b0880e8..0000000
Binary files a/test-client/src/statics/icons/ms-icon-144x144.png and /dev/null differ
diff --git a/test-client/src/statics/quasar-logo.png b/test-client/src/statics/quasar-logo.png
deleted file mode 100644
index 590e8ce..0000000
Binary files a/test-client/src/statics/quasar-logo.png and /dev/null differ