Add camera capability (#45)
Closes: #29 Fixes access to the camera in the android cordova build and maintains access when using the vite build. Reviewed-on: Georgi_Lab/ALVINN_f7#45
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<?xml version='1.0' encoding='utf-8'?>
|
||||
<widget id="edu.midwestern.alvinn" version="0.1.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
|
||||
<widget id="edu.midwestern.alvinn" version="0.1.2" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<name>ALVINN</name>
|
||||
<description>Anatomy Lab Visual Identification Neural Network.</description>
|
||||
<author email="jgeorg@midwestern.edu" href="https://midwestern.edu">
|
||||
@@ -14,12 +14,16 @@
|
||||
<access origin="*" />
|
||||
|
||||
<platform name="android">
|
||||
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
|
||||
<application android:usesCleartextTraffic="true" />
|
||||
</edit-config>
|
||||
<preference name="StatusBarOverlaysWebView" value="false" />
|
||||
<preference name="android-minSdkVersion" value="22" />
|
||||
<preference name="SplashMaintainAspectRatio" value="true" />
|
||||
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="res/screen/android/splashscreen.xml" />
|
||||
<preference name="AndroidWindowSplashScreenBackground" value="#0f206c" />
|
||||
<preference name="AndroidInsecureFileModeEnabled" value="true" />
|
||||
<preference name="hostname" value="localhost" />
|
||||
<icon density="ldpi" src="res/icon/android/mipmap-ldpi/ic_launcher.png" />
|
||||
<icon density="mdpi" src="res/icon/android/mipmap-mdpi/ic_launcher.png" />
|
||||
<icon density="hdpi" src="res/icon/android/mipmap-hdpi/ic_launcher.png" />
|
||||
|
||||
47
cordova/package-lock.json
generated
47
cordova/package-lock.json
generated
@@ -12,6 +12,7 @@
|
||||
"cordova-android": "^12.0.1",
|
||||
"cordova-browser": "^7.0.0",
|
||||
"cordova-ios": "^7.0.1",
|
||||
"cordova-plugin-camera": "^7.0.0",
|
||||
"cordova-plugin-keyboard": "^1.2.0",
|
||||
"cordova-plugin-statusbar": "^4.0.0"
|
||||
}
|
||||
@@ -501,6 +502,46 @@
|
||||
"node": ">=16.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/cordova-plugin-camera": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/cordova-plugin-camera/-/cordova-plugin-camera-7.0.0.tgz",
|
||||
"integrity": "sha512-OVQWZTBb18Y6e5c+bbXt3E4Z1yGnYqaywh2h5vVr/+nxMcdMIE+lm527bRK5vLN/RUqhGYP/Z+5n+O7Fk7fVNw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"cordovaDependencies": {
|
||||
"3.0.0": {
|
||||
"cordova-android": ">=6.3.0"
|
||||
},
|
||||
"4.1.0": {
|
||||
"cordova": ">=7.1.0",
|
||||
"cordova-android": ">=6.3.0"
|
||||
},
|
||||
"5.0.0": {
|
||||
"cordova": ">=9.0.0",
|
||||
"cordova-android": ">=9.0.0",
|
||||
"cordova-ios": ">=5.1.0"
|
||||
},
|
||||
"5.0.4-dev": {
|
||||
"cordova": ">=9.0.0",
|
||||
"cordova-android": "<10.0.0",
|
||||
"cordova-ios": ">=5.1.0"
|
||||
},
|
||||
"6.0.0": {
|
||||
"cordova": ">=9.0.0",
|
||||
"cordova-android": ">=10.0.0",
|
||||
"cordova-ios": ">=5.1.0"
|
||||
},
|
||||
"7.0.0": {
|
||||
"cordova": ">=9.0.0",
|
||||
"cordova-android": ">=12.0.0",
|
||||
"cordova-ios": ">=5.1.0"
|
||||
},
|
||||
"8.0.0": {
|
||||
"cordova": ">100"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/cordova-plugin-keyboard": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/cordova-plugin-keyboard/-/cordova-plugin-keyboard-1.2.0.tgz",
|
||||
@@ -2605,6 +2646,12 @@
|
||||
"xml-escape": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"cordova-plugin-camera": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/cordova-plugin-camera/-/cordova-plugin-camera-7.0.0.tgz",
|
||||
"integrity": "sha512-OVQWZTBb18Y6e5c+bbXt3E4Z1yGnYqaywh2h5vVr/+nxMcdMIE+lm527bRK5vLN/RUqhGYP/Z+5n+O7Fk7fVNw==",
|
||||
"dev": true
|
||||
},
|
||||
"cordova-plugin-keyboard": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/cordova-plugin-keyboard/-/cordova-plugin-keyboard-1.2.0.tgz",
|
||||
|
||||
@@ -16,13 +16,17 @@
|
||||
"cordova-android": "^12.0.1",
|
||||
"cordova-browser": "^7.0.0",
|
||||
"cordova-ios": "^7.0.1",
|
||||
"cordova-plugin-camera": "^7.0.0",
|
||||
"cordova-plugin-keyboard": "^1.2.0",
|
||||
"cordova-plugin-statusbar": "^4.0.0"
|
||||
},
|
||||
"cordova": {
|
||||
"plugins": {
|
||||
"cordova-plugin-statusbar": {},
|
||||
"cordova-plugin-keyboard": {}
|
||||
"cordova-plugin-keyboard": {},
|
||||
"cordova-plugin-camera": {
|
||||
"ANDROIDX_CORE_VERSION": "1.6.+"
|
||||
}
|
||||
},
|
||||
"platforms": [
|
||||
"ios",
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
<SvgIcon icon="videocam" fill-color="var(--avn-theme-color)"/>
|
||||
</f7-button>
|
||||
</f7-segmented>
|
||||
<input type="file" ref="image_chooser" @change="getImage()" accept="image/*" style="display: none;"/>
|
||||
<input v-if="!isCordova" type="file" ref="image_chooser" @change="getImage()" accept="image/*" capture="environment" style="display: none;"/>
|
||||
</f7-block>
|
||||
|
||||
<f7-panel :id="detectorName + '-settings'" right cover>
|
||||
@@ -55,6 +55,7 @@
|
||||
</f7-list>
|
||||
</f7-accordion-content>
|
||||
</f7-list-item>
|
||||
<f7-list-item title="Cordova">{{ isCordova }}</f7-list-item>
|
||||
<f7-list-item title="Turn on debugging">
|
||||
<f7-toggle v-model:checked="debugOn" style="margin-right: 16px;" />
|
||||
</f7-list-item>
|
||||
@@ -225,13 +226,13 @@
|
||||
imageRegion: '',
|
||||
imageLoaded: false,
|
||||
imageView: '',
|
||||
reader: new FileReader(),
|
||||
detectorName: '',
|
||||
detectorLevel: 50,
|
||||
detectorLabels: [],
|
||||
serverSettings: {},
|
||||
debugOn: false,
|
||||
debugText: ['Variables loaded']
|
||||
debugText: ['Variables loaded'],
|
||||
isCordova: !!window.cordova
|
||||
}
|
||||
},
|
||||
created () {
|
||||
@@ -334,7 +335,7 @@
|
||||
var doodsData = {
|
||||
"detector_name": this.detectorName,
|
||||
"detect": detectStructures,
|
||||
"data": this.reader.result.split(',')[1]
|
||||
"data": this.imageView.split(',')[1]
|
||||
}
|
||||
*/
|
||||
var doodsData = {
|
||||
@@ -359,7 +360,14 @@
|
||||
}
|
||||
},
|
||||
selectImage () {
|
||||
if (this.isCordova) {
|
||||
navigator.camera.getPicture(this.getImage, this.onFail, { quality: 50, destinationType: Camera.DestinationType.DATA_URL, correctOrientation: true });
|
||||
} else {
|
||||
var loadResult = this.$refs.image_chooser.click()
|
||||
}
|
||||
},
|
||||
onFail (message) {
|
||||
alert(`Camera fail: ${message}`)
|
||||
},
|
||||
selectChip ( iChip ) {
|
||||
if (this.selectedChip == iChip) {
|
||||
@@ -394,21 +402,26 @@
|
||||
this.resetView()
|
||||
});
|
||||
},
|
||||
getImage () {
|
||||
getImage (searchImage) {
|
||||
var self = this
|
||||
let loadImage =new Promise(resolve => {
|
||||
if (this.isCordova) {
|
||||
this.imageView = 'data:image/jpg;base64,' + searchImage
|
||||
} else {
|
||||
const searchImage = this.$refs.image_chooser.files[0]
|
||||
let loadImage =new Promise((resolve, reject) => {
|
||||
this.imageView = URL.createObjectURL(searchImage)
|
||||
this.reader.readAsDataURL(searchImage)
|
||||
var reader = new FileReader()
|
||||
reader.addEventListener("loadend", () => {this.imageView = reader.result})
|
||||
reader.readAsDataURL(searchImage)
|
||||
}
|
||||
resolve()
|
||||
})
|
||||
loadImage.then(() => {
|
||||
loadImage.then((imageData) => {
|
||||
this.imageLoaded = true
|
||||
this.resultData = {}
|
||||
this.resetView()
|
||||
}).catch((e) => {
|
||||
console.log(e.message)
|
||||
f7.dialog.alert('Error loading image')
|
||||
f7.dialog.alert(`Error loading image: ${e.message}`)
|
||||
})
|
||||
},
|
||||
resetView() {
|
||||
|
||||
Reference in New Issue
Block a user