finalized v4 code
This commit is contained in:
+1
-4
@@ -83,11 +83,8 @@
|
||||
<plugin name="cordova-plugin-ionic-webview" spec="^2.0.0" />
|
||||
<plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
|
||||
<plugin name="cordova-plugin-camera" spec="4.0.3" />
|
||||
|
||||
<!-- Required for iOS 10 Camera access
|
||||
More info: https://github.com/apache/cordova-plugin-camera#ios-quirks -->
|
||||
<edit-config file="*-Info.plist" mode="merge" target="NSCameraUsageDescription">
|
||||
<string>Used to take pictures</string>
|
||||
</edit-config>
|
||||
|
||||
<plugin name="cordova-sqlite-storage" spec="^2.5.1" />
|
||||
</widget>
|
||||
|
||||
Generated
+1731
-2225
File diff suppressed because it is too large
Load Diff
+67
-64
@@ -1,66 +1,69 @@
|
||||
{
|
||||
"name": "email-test",
|
||||
"version": "0.0.1",
|
||||
"author": "Ionic Framework",
|
||||
"homepage": "http://ionicframework.com/",
|
||||
"scripts": {
|
||||
"ng": "ng",
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"test": "ng test",
|
||||
"lint": "ng lint",
|
||||
"e2e": "ng e2e"
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/common": "~7.0.0",
|
||||
"@angular/core": "~7.0.0",
|
||||
"@angular/forms": "~7.0.0",
|
||||
"@angular/http": "~7.0.0",
|
||||
"@angular/platform-browser": "~7.0.0",
|
||||
"@angular/platform-browser-dynamic": "~7.0.0",
|
||||
"@angular/router": "~7.0.0",
|
||||
"@ionic-native/camera": "^5.0.0-beta.21",
|
||||
"@ionic-native/core": "5.0.0-beta.21",
|
||||
"@ionic-native/splash-screen": "5.0.0-beta.21",
|
||||
"@ionic-native/status-bar": "5.0.0-beta.21",
|
||||
"@ionic/angular": "4.0.0-beta.16",
|
||||
"@ionic/pro": "2.0.3",
|
||||
"cordova-plugin-camera": "4.0.3",
|
||||
"core-js": "^2.5.4",
|
||||
"rxjs": "~6.3.3",
|
||||
"zone.js": "~0.8.26"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/architect": "~0.10.0",
|
||||
"@angular-devkit/build-angular": "~0.10.0",
|
||||
"@angular-devkit/core": "~7.0.0",
|
||||
"@angular-devkit/schematics": "~7.0.0",
|
||||
"@angular/cli": "~7.0.0",
|
||||
"@angular/compiler": "~7.0.0",
|
||||
"@angular/compiler-cli": "~7.0.0",
|
||||
"@angular/language-service": "~7.0.0",
|
||||
"@ionic/angular-toolkit": "~1.2.0",
|
||||
"@types/node": "~10.12.0",
|
||||
"@types/jasmine": "~2.8.8",
|
||||
"@types/jasminewd2": "~2.0.3",
|
||||
"codelyzer": "~4.5.0",
|
||||
"jasmine-core": "~2.99.1",
|
||||
"jasmine-spec-reporter": "~4.2.1",
|
||||
"karma": "~3.0.0",
|
||||
"karma-chrome-launcher": "~2.2.0",
|
||||
"karma-coverage-istanbul-reporter": "~2.0.1",
|
||||
"karma-jasmine": "~1.1.2",
|
||||
"karma-jasmine-html-reporter": "^0.2.2",
|
||||
"protractor": "~5.4.0",
|
||||
"ts-node": "~7.0.0",
|
||||
"tslint": "~5.11.0",
|
||||
"typescript": "~3.1.6"
|
||||
},
|
||||
"description": "An Ionic project",
|
||||
"cordova": {
|
||||
"plugins": {
|
||||
"cordova-plugin-camera": {}
|
||||
"name": "email-test",
|
||||
"version": "0.0.1",
|
||||
"author": "Ionic Framework",
|
||||
"homepage": "http://ionicframework.com/",
|
||||
"scripts": {
|
||||
"ng": "ng",
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"test": "ng test",
|
||||
"lint": "ng lint",
|
||||
"e2e": "ng e2e"
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/common": "~7.0.0",
|
||||
"@angular/core": "~7.0.0",
|
||||
"@angular/forms": "~7.0.0",
|
||||
"@angular/http": "~7.0.0",
|
||||
"@angular/platform-browser": "~7.0.0",
|
||||
"@angular/platform-browser-dynamic": "~7.0.0",
|
||||
"@angular/router": "~7.0.0",
|
||||
"@ionic-native/camera": "^5.0.0-beta.21",
|
||||
"@ionic-native/core": "5.0.0-beta.21",
|
||||
"@ionic-native/splash-screen": "5.0.0-beta.21",
|
||||
"@ionic-native/status-bar": "5.0.0-beta.21",
|
||||
"@ionic/angular": "4.0.0-beta.16",
|
||||
"@ionic/pro": "2.0.3",
|
||||
"@ionic/storage": "^2.2.0",
|
||||
"cordova-plugin-camera": "4.0.3",
|
||||
"cordova-sqlite-storage": "^2.5.1",
|
||||
"core-js": "^2.5.4",
|
||||
"rxjs": "~6.3.3",
|
||||
"zone.js": "~0.8.26"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/architect": "~0.10.0",
|
||||
"@angular-devkit/build-angular": "~0.10.0",
|
||||
"@angular-devkit/core": "~7.0.0",
|
||||
"@angular-devkit/schematics": "~7.0.0",
|
||||
"@angular/cli": "~7.0.0",
|
||||
"@angular/compiler": "~7.0.0",
|
||||
"@angular/compiler-cli": "~7.0.0",
|
||||
"@angular/language-service": "~7.0.0",
|
||||
"@ionic/angular-toolkit": "~1.2.0",
|
||||
"@types/node": "~10.12.0",
|
||||
"@types/jasmine": "~2.8.8",
|
||||
"@types/jasminewd2": "~2.0.3",
|
||||
"codelyzer": "~4.5.0",
|
||||
"jasmine-core": "~2.99.1",
|
||||
"jasmine-spec-reporter": "~4.2.1",
|
||||
"karma": "~3.0.0",
|
||||
"karma-chrome-launcher": "~2.2.0",
|
||||
"karma-coverage-istanbul-reporter": "~2.0.1",
|
||||
"karma-jasmine": "~1.1.2",
|
||||
"karma-jasmine-html-reporter": "^0.2.2",
|
||||
"protractor": "~5.4.0",
|
||||
"ts-node": "~7.0.0",
|
||||
"tslint": "~5.11.0",
|
||||
"typescript": "~3.1.6"
|
||||
},
|
||||
"description": "An Ionic project",
|
||||
"cordova": {
|
||||
"plugins": {
|
||||
"cordova-plugin-camera": {},
|
||||
"cordova-sqlite-storage": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,12 +5,18 @@
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<img [src]="currentImage" *ngIf="currentImage">
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col size="6" *ngFor="let photo of photoService.photos">
|
||||
<img [src]="photo.data" />
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<ion-fab vertical="bottom" horizontal="center" slot="fixed">
|
||||
<ion-fab-button (click)="takePicture()">
|
||||
<ion-icon name="camera"></ion-icon>
|
||||
</ion-fab-button>
|
||||
<ion-fab-button (click)="photoService.takePicture()">
|
||||
<ion-icon name="camera"></ion-icon>
|
||||
</ion-fab-button>
|
||||
</ion-fab>
|
||||
|
||||
</ion-content>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { Camera, CameraOptions } from '@ionic-native/camera/ngx';
|
||||
import { PhotoService } from '../services/photo.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-about',
|
||||
@@ -9,23 +9,10 @@ import { Camera, CameraOptions } from '@ionic-native/camera/ngx';
|
||||
export class AboutPage {
|
||||
currentImage: any;
|
||||
|
||||
constructor(private camera: Camera) { }
|
||||
constructor(public photoService: PhotoService) { }
|
||||
|
||||
takePicture() {
|
||||
const options: CameraOptions = {
|
||||
quality: 100,
|
||||
destinationType: this.camera.DestinationType.DATA_URL,
|
||||
encodingType: this.camera.EncodingType.JPEG,
|
||||
mediaType: this.camera.MediaType.PICTURE
|
||||
}
|
||||
|
||||
this.camera.getPicture(options).then((imageData) => {
|
||||
// imageData is either a base64 encoded string or a file URI
|
||||
this.currentImage = 'data:image/jpeg;base64,' + imageData;
|
||||
}, (err) => {
|
||||
// Handle error
|
||||
console.log("Camera issue:" + err);
|
||||
});
|
||||
ngOnInit() {
|
||||
this.photoService.loadSaved();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -9,11 +9,12 @@ import { StatusBar } from '@ionic-native/status-bar/ngx';
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { Camera } from '@ionic-native/camera/ngx';
|
||||
import { IonicStorageModule } from '@ionic/storage';
|
||||
|
||||
@NgModule({
|
||||
declarations: [AppComponent],
|
||||
entryComponents: [],
|
||||
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
|
||||
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, IonicStorageModule.forRoot()],
|
||||
providers: [
|
||||
StatusBar,
|
||||
SplashScreen,
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PhotoService } from './photo.service';
|
||||
|
||||
describe('PhotoService', () => {
|
||||
beforeEach(() => TestBed.configureTestingModule({}));
|
||||
|
||||
it('should be created', () => {
|
||||
const service: PhotoService = TestBed.get(PhotoService);
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,48 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Camera, CameraOptions } from '@ionic-native/camera/ngx';
|
||||
import { Storage } from '@ionic/storage';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class PhotoService {
|
||||
|
||||
public photos: Photo[] = [];
|
||||
|
||||
constructor(private camera: Camera, private storage: Storage) { }
|
||||
|
||||
takePicture() {
|
||||
const options: CameraOptions = {
|
||||
quality: 100,
|
||||
destinationType: this.camera.DestinationType.DATA_URL,
|
||||
encodingType: this.camera.EncodingType.JPEG,
|
||||
mediaType: this.camera.MediaType.PICTURE
|
||||
}
|
||||
|
||||
this.camera.getPicture(options).then((imageData) => {
|
||||
// Add new photo to gallery
|
||||
this.photos.unshift({
|
||||
data: 'data:image/jpeg;base64,' + imageData
|
||||
});
|
||||
|
||||
// Save all photos for later viewing
|
||||
this.storage.set('photos', this.photos);
|
||||
}, (err) => {
|
||||
// Handle error
|
||||
console.log("Camera issue: " + err);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
loadSaved() {
|
||||
this.storage.get('photos').then((photos) => {
|
||||
this.photos = photos || [];
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
class Photo {
|
||||
data: any;
|
||||
}
|
||||
|
||||
Vendored
+3
-1
@@ -1,3 +1,5 @@
|
||||
|
||||
/// <reference path="../.vscode/typings/cordova-ionic/plugins/keyboard.d.ts"/>
|
||||
/// <reference path="../.vscode/typings/jquery/jquery.d.ts"/>
|
||||
/// <reference path="../.vscode/typings/jquery/jquery.d.ts"/>
|
||||
/// <reference path="..\.vscode\typings\cordova-ionic\plugins\keyboard.d.ts"/>
|
||||
/// <reference path="..\.vscode\typings\jquery\jquery.d.ts"/>
|
||||
Reference in New Issue
Block a user