diff --git a/app/app.css b/app/app.css
index 20c4a92..f2f3077 100644
--- a/app/app.css
+++ b/app/app.css
@@ -11,4 +11,23 @@
.cell-view {
border-width: 1;
border-color: lightgray;
+ padding: 10;
+ background-color: gray;
+}
+
+GridLayout {
+ background-color: gray;
+ color: white;
+}
+
+ListView {
+ background-color: gray;
+}
+
+Image {
+ margin: 0 8 0 0;
+}
+
+Button {
+ background-color: orange;
}
\ No newline at end of file
diff --git a/app/full-screen-page.js b/app/full-screen-page.js
index acb7c27..99bac58 100644
--- a/app/full-screen-page.js
+++ b/app/full-screen-page.js
@@ -1,26 +1,29 @@
var Observable = require("data/observable").Observable;
-var mainViewModel = require("./main-page").mainViewModel;
+var mainViewModel = require("./main-page").mainViewModel;
var imageSource = require("image-source");
var fs = require("file-system");
-
var frameModule = require("ui/frame");
function navigatedTo(args) {
var page = args.object;
- var selectedImage = args.context;
-
- page.bindingContext = new Observable({
- name: selectedImage.imageName,
- image: null // This will generate get/set for image that notify on property changes
- });
-
- selectedImage.getImage({ maxWidth: 600, maxHeight: 800}).then(function(imageSource) {
- console.log("Retrieved image: " + imageSource);
- page.bindingContext.image = imageSource;
- }).catch(function(e) {
- console.log("Error: " + e);
- });
+
+ var context = page.navigationContext;
+ page.bindingContext = context;
+
+ for (const key in context) {
+ if (context.hasOwnProperty(key)) {
+ const element = context[key];
+ console.log(element);
+ }
+ }
+
+ // selectedImage.getImage({ maxWidth: 600, maxHeight: 800 }).then(function (imageSource) {
+ // console.log("Retrieved image: " + imageSource);
+ // page.bindingContext.image = imageSource;
+ // }).catch(function (e) {
+ // console.log("Error: " + e);
+ // });
}
function onGoBack(args) {
diff --git a/app/full-screen-page.xml b/app/full-screen-page.xml
index 6f4842d..1d4c07a 100644
--- a/app/full-screen-page.xml
+++ b/app/full-screen-page.xml
@@ -1,7 +1,7 @@
-
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
+
diff --git a/app/icon.png b/app/icon.png
new file mode 100644
index 0000000..ddfc17a
Binary files /dev/null and b/app/icon.png differ
diff --git a/app/main-page.js b/app/main-page.js
index 1e44b82..0da74c3 100644
--- a/app/main-page.js
+++ b/app/main-page.js
@@ -1,70 +1,71 @@
-var platformModule = require("platform");
+var imageSource = require("image-source");
var frameModule = require("ui/frame");
-var observable = require("data/observable");
-var observableArray = require("data/observable-array");
-var ImageModule = require("ui/image");
-var permissions = require( "nativescript-permissions");
+var Observable = require("data/observable").Observable;
+var fromObject = require("data/observable").fromObject;
+var ObservableArray = require("data/observable-array").ObservableArray;
+var platformModule = require("platform");
+
+var permissions = require("nativescript-permissions");
var imagepickerModule = require("nativescript-imagepicker");
-var fs = require('file-system');
var bghttpModule = require("nativescript-background-http");
var session = bghttpModule.session("image-upload");
-var imageItems = new observableArray.ObservableArray();
-var mainViewModel = new observable.Observable();
-var imageSource = require("image-source");
-mainViewModel.set("imageItems", imageItems);
+var fs = require("file-system");
+
+var vm = require("./main-view-model");
+var mainViewModel = vm.createViewModel();
var page;
var imageName;
var counter = 0;
function pageLoaded(args) {
- page = args.object;
+ page = args.object;
page.bindingContext = mainViewModel;
}
-function onSelectMultipleTap(args) {
- var context = imagepickerModule.create({
- mode: "multiple"
- });
+function onSelectMultipleTap(args) {
+ var context = imagepickerModule.create({
+ mode: "multiple"
+ });
- if (platformModule.device.os === "Android" && platformModule.device.sdkVersion >= 23) {
+ if (platformModule.device.os === "Android" && platformModule.device.sdkVersion >= 23) {
permissions.requestPermission(android.Manifest.permission.READ_EXTERNAL_STORAGE, "I need these permissions to read from storage")
- .then(function() {
- console.log("Permissions granted!");
- startSelection(context);
- })
- .catch(function() {
- console.log("Uh oh, no permissions - plan B time!");
- });
+ .then(function () {
+ console.log("Permissions granted!");
+ startSelection(context);
+ })
+ .catch(function () {
+ console.log("Uh oh, no permissions - plan B time!");
+ });
} else {
startSelection(context);
- }
+ }
}
-function onSelectSingleTap(args) {
- var context = imagepickerModule.create({
- mode: "single"
- });
+function onSelectSingleTap(args) {
+ var context = imagepickerModule.create({
+ mode: "single"
+ });
- if (platformModule.device.os === "Android" && platformModule.device.sdkVersion >= 23) {
+ if (platformModule.device.os === "Android" && platformModule.device.sdkVersion >= 23) {
permissions.requestPermission(android.Manifest.permission.READ_EXTERNAL_STORAGE, "I need these permissions to read from storage")
- .then(function() {
- console.log("Permissions granted!");
- startSelection(context);
- })
- .catch(function() {
- console.log("Uh oh, no permissions - plan B time!");
- });
+ .then(function () {
+ console.log("Permissions granted!");
+ startSelection(context);
+ })
+ .catch(function () {
+ console.log("Uh oh, no permissions - plan B time!");
+ });
} else {
startSelection(context);
}
}
function sendImages(uri, fileUri) {
-
+
imageName = extractImageName(fileUri);
-
+
var request = {
url: "http://httpbin.org/post",
method: "POST",
@@ -74,70 +75,67 @@ function sendImages(uri, fileUri) {
},
description: "{ 'uploading': " + imageName + " }"
};
-
+
var task = session.uploadFile(fileUri, request);
task.on("progress", logEvent);
task.on("error", logEvent);
task.on("complete", logEvent);
-
+
function logEvent(e) {
console.log("currentBytes: " + e.currentBytes);
console.log("totalBytes: " + e.totalBytes);
console.log("eventName: " + e.eventName);
}
-
+
return task;
}
function startSelection(context) {
- context
- .authorize()
- .then(function() {
- imageItems.length = 0;
- return context.present();
- })
- .then(function(selection) {
- selection.forEach(function(selected_item) {
- selected_item.getImage().then(function(imagesource){
- // let folder = fs.knownFolders.documents();
-// let path = fs.path.join(folder.path, "Test"+counter+".png");
-// let saved = imagesource.saveToFile(path, "png");
-
- var localPath=null;
-
- if (platformModule.device.os === "Android") {
- localPath = selected_item.android;
- } else {
- localPath = selected_item.ios;
- }
-
- if (localPath) {
- var task = sendImages("Image"+counter+".png", localPath);
- var item = new observable.Observable();
- item.set("thumb", imagesource);
- item.set("uri", "Test"+counter+".png");
- item.set("uploadTask", task);
-
- imageItems.push(item);
+
+ context
+ .authorize()
+ .then(function () {
+
+ return context.present();
+ })
+ .then(function (selection) {
+ selection.forEach(function (selected_item) {
+ selected_item.getImage().then(function (imagesource) {
+ var localPath = null;
+
+ if (platformModule.device.os === "Android") {
+ localPath = selected_item.android;
+ } else {
+ // selected_item.ios for iOS is PHAsset and not path - so we are creating own path
+ let folder = fs.knownFolders.documents();
+ let path = fs.path.join(folder.path, "Test" + counter + ".png");
+ let saved = imagesource.saveToFile(path, "png");
+
+ localPath = path;
+ }
+
+ if (localPath) {
+ var task = sendImages("Image" + counter + ".png", localPath);
+ mainViewModel.get("items").push(fromObject({ thumb: imagesource, uri: "Image" + counter + ".png", uploadTask: task }));
}
counter++;
})
-
- });
- }).catch(function (e) {
- console.log(e.eventName);
- });
+ });
+ }).catch(function (e) {
+ console.log(e.eventName);
+ });
}
function extractImageName(fileUri) {
var pattern = /[^/]*$/;
var imageName = fileUri.match(pattern);
-
+
return imageName;
}
-function listViewItemTap(args) {
+function listViewItemTap(args) {
+
frameModule.topmost().navigate({
moduleName: 'full-screen-page',
context: args.view.bindingContext
@@ -145,7 +143,6 @@ function listViewItemTap(args) {
}
exports.mainViewModel = mainViewModel;
-
exports.pageLoaded = pageLoaded;
exports.onSelectMultipleTap = onSelectMultipleTap;
exports.onSelectSingleTap = onSelectSingleTap;
diff --git a/app/main-page.xml b/app/main-page.xml
index 40fb5d0..ec2d8b1 100644
--- a/app/main-page.xml
+++ b/app/main-page.xml
@@ -1,17 +1,19 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/app/main-view-model.js b/app/main-view-model.js
new file mode 100644
index 0000000..2362cb0
--- /dev/null
+++ b/app/main-view-model.js
@@ -0,0 +1,13 @@
+var Observable = require("data/observable").Observable;
+var fromObject = require("data/observable").fromObject;
+var ObservableArray = require("data/observable-array").ObservableArray;
+
+function createViewModel() {
+ var viewModel = new Observable();
+
+ viewModel.items = new ObservableArray([]);
+
+ return viewModel;
+}
+
+exports.createViewModel = createViewModel;
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..6491a72
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,307 @@
+{
+ "requires": true,
+ "lockfileVersion": 1,
+ "dependencies": {
+ "ansi-regex": {
+ "version": "2.1.1",
+ "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+ "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+ "dev": true
+ },
+ "ansi-styles": {
+ "version": "2.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+ "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+ "dev": true
+ },
+ "babel-code-frame": {
+ "version": "6.26.0",
+ "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+ "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+ "dev": true,
+ "requires": {
+ "chalk": "1.1.3",
+ "esutils": "2.0.2",
+ "js-tokens": "3.0.2"
+ }
+ },
+ "babel-messages": {
+ "version": "6.23.0",
+ "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
+ "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=",
+ "dev": true,
+ "requires": {
+ "babel-runtime": "6.26.0"
+ },
+ "dependencies": {
+ "babel-runtime": {
+ "version": "6.26.0",
+ "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+ "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+ "dev": true,
+ "requires": {
+ "core-js": "2.5.1",
+ "regenerator-runtime": "0.11.1"
+ }
+ }
+ }
+ },
+ "babel-runtime": {
+ "version": "5.8.38",
+ "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-5.8.38.tgz",
+ "integrity": "sha1-HAsC62MxL18If/IEUIJ7QlydTBk=",
+ "dev": true,
+ "requires": {
+ "core-js": "1.2.7"
+ },
+ "dependencies": {
+ "core-js": {
+ "version": "1.2.7",
+ "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+ "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=",
+ "dev": true
+ }
+ }
+ },
+ "babel-traverse": {
+ "version": "6.7.6",
+ "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.7.6.tgz",
+ "integrity": "sha1-oUkoBEBAsqbICqWVFIrwtjeNHJM=",
+ "dev": true,
+ "requires": {
+ "babel-code-frame": "6.26.0",
+ "babel-messages": "6.23.0",
+ "babel-runtime": "5.8.38",
+ "babel-types": "6.7.7",
+ "babylon": "6.7.0",
+ "debug": "2.6.9",
+ "globals": "8.18.0",
+ "invariant": "2.2.2",
+ "lodash": "3.10.1",
+ "repeating": "1.1.3"
+ }
+ },
+ "babel-types": {
+ "version": "6.7.7",
+ "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.7.7.tgz",
+ "integrity": "sha1-iM0fHMDvly0JKswodh3hBVORKRU=",
+ "dev": true,
+ "requires": {
+ "babel-runtime": "5.8.38",
+ "babel-traverse": "6.7.6",
+ "esutils": "2.0.2",
+ "lodash": "3.10.1",
+ "to-fast-properties": "1.0.3"
+ }
+ },
+ "babylon": {
+ "version": "6.7.0",
+ "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.7.0.tgz",
+ "integrity": "sha1-p9aeQMkKWDVcv5tPnK1xEPPAfMo=",
+ "dev": true,
+ "requires": {
+ "babel-runtime": "5.8.38"
+ }
+ },
+ "chalk": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+ "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+ "dev": true,
+ "requires": {
+ "ansi-styles": "2.2.1",
+ "escape-string-regexp": "1.0.5",
+ "has-ansi": "2.0.0",
+ "strip-ansi": "3.0.1",
+ "supports-color": "2.0.0"
+ }
+ },
+ "core-js": {
+ "version": "2.5.1",
+ "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.1.tgz",
+ "integrity": "sha1-rmh03GaTd4m4B1T/VCjfZoGcpQs=",
+ "dev": true
+ },
+ "debug": {
+ "version": "2.6.9",
+ "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+ "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+ "dev": true,
+ "requires": {
+ "ms": "2.0.0"
+ }
+ },
+ "escape-string-regexp": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+ "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+ "dev": true
+ },
+ "esutils": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
+ "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs=",
+ "dev": true
+ },
+ "filewalker": {
+ "version": "0.1.2",
+ "resolved": "https://registry.npmjs.org/filewalker/-/filewalker-0.1.2.tgz",
+ "integrity": "sha1-IVvw6ycD1Pqt/FuKEE56pwpDMfE=",
+ "dev": true,
+ "requires": {
+ "fqueue": "0.0.0"
+ }
+ },
+ "fqueue": {
+ "version": "0.0.0",
+ "resolved": "https://registry.npmjs.org/fqueue/-/fqueue-0.0.0.tgz",
+ "integrity": "sha1-UzIFpPmtIbuqOPxhzvOpMML1SDY=",
+ "dev": true
+ },
+ "globals": {
+ "version": "8.18.0",
+ "resolved": "https://registry.npmjs.org/globals/-/globals-8.18.0.tgz",
+ "integrity": "sha1-k9SmK9ysOM+vr8R9awNHaMsP/LQ=",
+ "dev": true
+ },
+ "has-ansi": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+ "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+ "dev": true,
+ "requires": {
+ "ansi-regex": "2.1.1"
+ }
+ },
+ "invariant": {
+ "version": "2.2.2",
+ "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
+ "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A=",
+ "dev": true,
+ "requires": {
+ "loose-envify": "1.3.1"
+ }
+ },
+ "is-finite": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
+ "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko=",
+ "dev": true,
+ "requires": {
+ "number-is-nan": "1.0.1"
+ }
+ },
+ "js-tokens": {
+ "version": "3.0.2",
+ "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
+ "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
+ "dev": true
+ },
+ "lazy": {
+ "version": "1.0.11",
+ "resolved": "https://registry.npmjs.org/lazy/-/lazy-1.0.11.tgz",
+ "integrity": "sha1-2qBoIGKCVCwIgojpdcKXwa53tpA=",
+ "dev": true
+ },
+ "lodash": {
+ "version": "3.10.1",
+ "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+ "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=",
+ "dev": true
+ },
+ "loose-envify": {
+ "version": "1.3.1",
+ "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
+ "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=",
+ "dev": true,
+ "requires": {
+ "js-tokens": "3.0.2"
+ }
+ },
+ "ms": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+ "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+ "dev": true
+ },
+ "nativescript-background-http": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/nativescript-background-http/-/nativescript-background-http-3.1.0.tgz",
+ "integrity": "sha1-sGPO7S69ECuT19sHzzbs3ilTS1s="
+ },
+ "nativescript-imagepicker": {
+ "version": "4.0.1",
+ "resolved": "https://registry.npmjs.org/nativescript-imagepicker/-/nativescript-imagepicker-4.0.1.tgz",
+ "integrity": "sha1-Yf6D2MvicRmefVRrelXHZJ2GSIM=",
+ "requires": {
+ "nativescript-permissions": "1.2.3",
+ "nativescript-pro-ui": "3.2.0"
+ }
+ },
+ "nativescript-permissions": {
+ "version": "1.2.3",
+ "resolved": "https://registry.npmjs.org/nativescript-permissions/-/nativescript-permissions-1.2.3.tgz",
+ "integrity": "sha1-4+ZVRfmP5IjdVXj3/5DrrjCI5wA="
+ },
+ "nativescript-pro-ui": {
+ "version": "3.2.0",
+ "resolved": "https://registry.npmjs.org/nativescript-pro-ui/-/nativescript-pro-ui-3.2.0.tgz",
+ "integrity": "sha1-GYxrcZUs10IHDmNS6HDX+ruh+5M="
+ },
+ "number-is-nan": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+ "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
+ "dev": true
+ },
+ "regenerator-runtime": {
+ "version": "0.11.1",
+ "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+ "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
+ "dev": true
+ },
+ "repeating": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/repeating/-/repeating-1.1.3.tgz",
+ "integrity": "sha1-PUEUIYh3U3SU+X93+Xhfq4EPpKw=",
+ "dev": true,
+ "requires": {
+ "is-finite": "1.0.2"
+ }
+ },
+ "strip-ansi": {
+ "version": "3.0.1",
+ "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+ "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+ "dev": true,
+ "requires": {
+ "ansi-regex": "2.1.1"
+ }
+ },
+ "supports-color": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+ "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+ "dev": true
+ },
+ "tns-core-modules": {
+ "version": "3.3.0",
+ "resolved": "https://registry.npmjs.org/tns-core-modules/-/tns-core-modules-3.3.0.tgz",
+ "integrity": "sha1-T+sfMRE8VU8LtHmErElvzNta8VY=",
+ "requires": {
+ "tns-core-modules-widgets": "3.3.0"
+ }
+ },
+ "tns-core-modules-widgets": {
+ "version": "3.3.0",
+ "resolved": "https://registry.npmjs.org/tns-core-modules-widgets/-/tns-core-modules-widgets-3.3.0.tgz",
+ "integrity": "sha1-0qp7smrSEkjJ9cH3X+pRNxhmYiY="
+ },
+ "to-fast-properties": {
+ "version": "1.0.3",
+ "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
+ "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
+ "dev": true
+ }
+ }
+}
diff --git a/package.json b/package.json
index cbf7e58..aaee197 100644
--- a/package.json
+++ b/package.json
@@ -1,19 +1,19 @@
{
"nativescript": {
"id": "org.nativescript.backHttpApp",
- "tns-ios": {
- "version": "3.0.0"
- },
"tns-android": {
- "version": "3.0.0"
+ "version": "3.3.1"
+ },
+ "tns-ios": {
+ "version": "3.3.0"
}
},
"dependencies": {
- "nativescript-background-http": "^3.0.0",
- "nativescript-imagepicker": "^3.0.0",
+ "nativescript-background-http": "^3.1.0",
+ "nativescript-imagepicker": "^4.0.1",
"nativescript-permissions": "^1.2.3",
- "nativescript-telerik-ui": "^3.0.0",
- "tns-core-modules": "^3.0.0"
+ "nativescript-pro-ui": "^3.2.0",
+ "tns-core-modules": "^3.3.0"
},
"devDependencies": {
"babel-traverse": "6.7.6",