feat(input): Past native clipboard content on inputs long press

Tap in into the native clipboard with cordova. Still not the native pop-over past Fixes #97
Toolwatchapp · Mar 14, 2017 · 4750f46 · 4750f46
1 parent 77cd643
commit 4750f46
Show file tree

Hide file tree

Showing 4 changed files with 128 additions and 134 deletions.
diff --git a/config.xml b/config.xml
@@ -1,93 +1,94 @@
-<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<?xml version='1.0' encoding='utf-8'?>
 <widget id="Toolwatch.Toolwatch" version="1.1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
-  <name>Toolwatch - Watch accuracy app</name>
-  <description>Measure and track the accuracy of your mechanical watches. Toolwatch is a free watch accuracy app trusted by the watchmaking industry's leaders and 15 000+ monthly users. Is your watch accurate? Should it be serviced? How does it compare versus other watches? Find out now by measuring the accuracy of your watch!</description>
-  <author email="[email protected]" href="https://toolwatch.io/">Mathieu Nayrolles</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:*"/>
-  <platform name="android">
-    <allow-intent href="market:*"/>
-    <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
-    <icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
-    <icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
-    <icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
-    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
-    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
-    <splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
-    <splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
-    <splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
-    <splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
-    <splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
-    <splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
-  </platform>
-  <platform name="ios">
-    <allow-intent href="itms:*"/>
-    <allow-intent href="itms-apps:*"/>
-    <icon src="resources/ios/icon/icon.png" width="57" height="57"/>
-    <icon src="resources/ios/icon/[email protected]" width="114" height="114"/>
-    <icon src="resources/ios/icon/icon-40.png" width="40" height="40"/>
-    <icon src="resources/ios/icon/[email protected]" width="80" height="80"/>
-    <icon src="resources/ios/icon/[email protected]" width="120" height="120"/>
-    <icon src="resources/ios/icon/icon-50.png" width="50" height="50"/>
-    <icon src="resources/ios/icon/[email protected]" width="100" height="100"/>
-    <icon src="resources/ios/icon/icon-60.png" width="60" height="60"/>
-    <icon src="resources/ios/icon/[email protected]" width="120" height="120"/>
-    <icon src="resources/ios/icon/[email protected]" width="180" height="180"/>
-    <icon src="resources/ios/icon/icon-72.png" width="72" height="72"/>
-    <icon src="resources/ios/icon/[email protected]" width="144" height="144"/>
-    <icon src="resources/ios/icon/icon-76.png" width="76" height="76"/>
-    <icon src="resources/ios/icon/[email protected]" width="152" height="152"/>
-    <icon src="resources/ios/icon/[email protected]" width="167" height="167"/>
-    <icon src="resources/ios/icon/icon-small.png" width="29" height="29"/>
-    <icon src="resources/ios/icon/[email protected]" width="58" height="58"/>
-    <icon src="resources/ios/icon/[email protected]" width="87" height="87"/>
-    <splash src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" height="1136"/>
-    <splash src="resources/ios/splash/Default-667h.png" width="750" height="1334"/>
-    <splash src="resources/ios/splash/Default-736h.png" width="1242" height="2208"/>
-    <splash src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" height="2048"/>
-    <splash src="resources/ios/splash/Default-Portrait~ipad.png" width="768" height="1024"/>
-    <splash src="resources/ios/splash/Default@2x~iphone.png" width="640" height="960"/>
-    <splash src="resources/ios/splash/Default~iphone.png" width="320" height="480"/>
-  </platform>
-  <platform name="wp8">
-    <icon src="resources/wp8/icon/ApplicationIcon.png" width="99" height="99"/>
-    <icon src="resources/wp8/icon/Background.png" width="159" height="159"/>
-    <splash src="resources/wp8/splash/SplashScreenImage.png" width="768" height="1280"/>
-  </platform>
-  <preference name="webviewbounce" value="false"/>
-  <preference name="UIWebViewBounce" value="false"/>
-  <preference name="DisallowOverscroll" value="true"/>
-  <preference name="android-minSdkVersion" value="16"/>
-  <preference name="BackupWebStorage" value="none"/>
-  <preference name="SplashScreenDelay" value="0"/>
-  <preference name="FadeSplashScreen" value="false"/>
-  <preference name="FadeSplashScreenDuration" value="0"/>
-  <preference name="orientation" value="portrait"/>
-  <preference name="SplashScreenBackgroundColor" value="0xFFFFFFFF"/>
-  <preference name="SplashScreen" value="screen"/>
-  <feature name="StatusBar">
-    <param name="ios-package" onload="true" value="CDVStatusBar"/>
-  </feature>
-  <icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
-  <plugin name="cordova-plugin-facebook4" spec="~1.7.4">
-    <variable name="APP_ID" value="807383452677000"/>
-    <variable name="APP_NAME" value="Toolwatch"/>
-  </plugin>
-  <plugin name="cordova-plugin-nativestorage" spec="~2.0.2"/>
-  <plugin name="cordova-plugin-x-socialsharing" spec="~5.1.3"/>
-  <plugin name="cordova-plugin-statusbar" spec="~2.2.0"/>
-  <plugin name="cordova-plugin-console" spec="~1.0.4"/>
-  <plugin name="cordova-plugin-device" spec="~1.1.3"/>
-  <plugin name="cordova-plugin-apprate" spec="~1.2"/>
-  <plugin name="cordova-plugin-inappbrowser" spec="~1.5.0"/>
-  <plugin name="cordova-plugin-app-version" spec="~0.1.9"/>
-  <plugin name="cordova-plugin-whitelist" spec="~1.3.0"/>
-  <plugin name="cordova-plugin-splashscreen" spec="~4.0.0"/>
-  <plugin name="ionic-plugin-keyboard" spec="~2.2.1"/>
-</widget>
+    <name>Toolwatch - Watch accuracy app</name>
+    <description>Measure and track the accuracy of your mechanical watches. Toolwatch is a free watch accuracy app trusted by the watchmaking industry's leaders and 15 000+ monthly users. Is your watch accurate? Should it be serviced? How does it compare versus other watches? Find out now by measuring the accuracy of your watch!</description>
+    <author email="[email protected]" href="https://toolwatch.io/">Mathieu Nayrolles</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:*" />
+    <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="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/[email protected]" width="114" />
+        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
+        <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
+        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
+        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
+        <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
+        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
+        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
+        <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
+        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
+        <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
+        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
+        <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
+        <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
+        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
+        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
+        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
+        <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="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
+        <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" />
+    </platform>
+    <platform name="wp8">
+        <icon height="99" src="resources/wp8/icon/ApplicationIcon.png" width="99" />
+        <icon height="159" src="resources/wp8/icon/Background.png" width="159" />
+        <splash height="1280" src="resources/wp8/splash/SplashScreenImage.png" width="768" />
+    </platform>
+    <preference name="webviewbounce" value="false" />
+    <preference name="UIWebViewBounce" value="false" />
+    <preference name="DisallowOverscroll" value="true" />
+    <preference name="android-minSdkVersion" value="16" />
+    <preference name="BackupWebStorage" value="none" />
+    <preference name="SplashScreenDelay" value="0" />
+    <preference name="FadeSplashScreen" value="false" />
+    <preference name="FadeSplashScreenDuration" value="0" />
+    <preference name="orientation" value="portrait" />
+    <preference name="SplashScreenBackgroundColor" value="0xFFFFFFFF" />
+    <preference name="SplashScreen" value="screen" />
+    <feature name="StatusBar">
+        <param name="ios-package" onload="true" value="CDVStatusBar" />
+    </feature>
+    <icon src="resources/android/icon/drawable-xhdpi-icon.png" />
+    <plugin name="cordova-plugin-facebook4" spec="~1.7.4">
+        <variable name="APP_ID" value="807383452677000" />
+        <variable name="APP_NAME" value="Toolwatch" />
+    </plugin>
+    <plugin name="cordova-plugin-nativestorage" spec="~2.0.2" />
+    <plugin name="cordova-plugin-x-socialsharing" spec="~5.1.3" />
+    <plugin name="cordova-plugin-statusbar" spec="~2.2.0" />
+    <plugin name="cordova-plugin-console" spec="~1.0.4" />
+    <plugin name="cordova-plugin-device" spec="~1.1.3" />
+    <plugin name="cordova-plugin-apprate" spec="~1.2" />
+    <plugin name="cordova-plugin-inappbrowser" spec="~1.5.0" />
+    <plugin name="cordova-plugin-app-version" spec="~0.1.9" />
+    <plugin name="cordova-plugin-whitelist" spec="~1.3.0" />
+    <plugin name="cordova-plugin-splashscreen" spec="~4.0.0" />
+    <plugin name="ionic-plugin-keyboard" spec="~2.2.1" />
+    <plugin name="com.verso.cordova.clipboard" spec="https://github.com/VersoSolutions/CordovaClipboard.git" />
+</widget>
diff --git a/package.json b/package.json
@@ -12,57 +12,35 @@
     "prod": "npm run assets && ionic-app-scripts build --prod"
   },
   "dependencies": {
-    "@angular/common": "2.2.1",
-    "@angular/compiler": "2.2.1",
-    "@angular/compiler-cli": "2.2.1",
-    "@angular/core": "2.2.1",
-    "@angular/forms": "2.2.1",
-    "@angular/http": "2.2.1",
-    "@angular/platform-browser": "2.2.1",
-    "@angular/platform-browser-dynamic": "2.2.1",
-    "@angular/platform-server": "2.2.1",
-    "@ionic/storage": "1.1.7",
+    "@angular/common": "2.4.8",
+    "@angular/compiler": "2.4.8",
+    "@angular/compiler-cli": "2.4.8",
+    "@angular/core": "2.4.8",
+    "@angular/forms": "2.4.8",
+    "@angular/http": "2.4.8",
+    "@angular/platform-browser": "2.4.8",
+    "@angular/platform-browser-dynamic": "2.4.8",
+    "@angular/platform-server": "2.4.8",
+    "@ionic/storage": "^2.0.0",
+    "ng2-translate": "5.0.0",
     "@types/node": "^6.0.45",
     "gsap": "^1.19.0",
-    "ionic-angular": "2.0.0-rc.4",
-    "ionic-native": "2.2.11",
+    "ionic-angular": "2.2.0",
+    "ionic-native": "2.4.1",
     "ionicons": "3.0.0",
     "moment": "2.15.1",
-    "ng2-translate": "5.0.0",
-    "rxjs": "5.0.0-beta.12",
-    "tw-core": "file:///Users/mathosx/Desktop/toolwatch/tw-core",
+    "rxjs": "5.0.1",
+    "sw-toolbox": "3.4.0",
     "tw-i18n": "github:toolwatchapp/tw-i18n",
     "tw-watches": "github:toolwatchapp/tw-watches",
-    "zone.js": "0.6.26"
+    "zone.js": "0.7.2"
   },
   "devDependencies": {
-    "@ionic/app-scripts": "1.0.0",
-    "@types/jasmine": "^2.5.35",
-    "@types/node": "^6.0.45",
-    "bulma": "0.2.3",
-    "core-js": "^2.4.0",
-    "css-loader": "^0.23.1",
+    "@ionic/app-scripts": "1.1.4",
     "cz-conventional-changelog": "^1.2.0",
-    "es6-promise": "^3.0.2",
-    "es6-shim": "^0.35.0",
-    "highlight.js": "^9.1.0",
-    "html-loader": "^0.4.3",
-    "intern": "^3.3.2",
-    "marked": "^0.3.6",
-    "node-sass": "^3.6.0",
-    "raw-loader": "^0.5.1",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.12",
-    "sass-loader": "^3.1.2",
-    "style-loader": "^0.13.1",
-    "sw-toolbox": "^3.4.0",
-    "ts-loader": "^1.0.0",
-    "typescript": "2.0.9",
-    "typings": "^0.6.8",
-    "webpack": "2.1.0-beta.25",
-    "zone.js": "0.6.25"
+    "typescript": "2.0.9"
   },
-  "description": "tw-mobile-2rc0: An Ionic project",
+  "description": "tw-mobile: An Ionic project",
   "cordovaPlugins": [
     "cordova-plugin-device",
     "cordova-plugin-console",

diff --git a/src/components/mobile-input/mobile-input.html b/src/components/mobile-input/mobile-input.html
@@ -16,6 +16,7 @@
       (blur)                = "toggleFocus()" 
       (focus)               = "toggleFocus()"
       (keyup)               = "emitChange($event)"
+      (press)               = "onPast()"
     > 
     </ion-input>
 
@@ -32,6 +33,7 @@
       [formControl]         = "control" 
       [(ngModel)]           = "value"
       (ngModelChange)       = "valueChange.emit($event)"
+      (press)               = "onPast()"
     > 
     </ion-input>
 

diff --git a/src/components/mobile-input/mobile-input.ts b/src/components/mobile-input/mobile-input.ts
@@ -2,7 +2,7 @@ import { Component, Input, EventEmitter, Output } from '@angular/core';
 import {   
   FormControl
 } from '@angular/forms';
-
+import { Clipboard } from 'ionic-native';
 
 /*
   Generates a mobile form input
@@ -77,6 +77,19 @@ export class MobileInput {
 	    }
 	}
 
+	onPast(){
+		Clipboard.paste().then(
+			(resolve: string) => {
+				this.value = resolve;
+				this.valueChange.emit(this.value);
+			},
+			(reject: string) => {
+				console.error("Unsucessful pasting")
+			}
+		);
+
+	}
+
 	toggleFocus():void{
 		this.isFocused = !this.isFocused;
 	}