Skip to content

refactor: Updated dependency versions #17

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
NickIliev merged 1 commit into from
Dec 11, 2017
Merged

refactor: Updated dependency versions #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions app/app.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
33 changes: 18 additions & 15 deletions app/full-screen-page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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) {
Expand Down
12 changes: 6 additions & 6 deletions app/full-screen-page.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<Page xmlns="http://www.nativescript.org/tns.xsd" navigatedTo="navigatedTo">
<StackLayout class="details-page">
<Button text="Go Back" tap="onGoBack" />
<Label text="{{ name }}" textWrap="true" class="details-label"/>
<Image src="{{ image }}" class="details-image"/>
</StackLayout>
</Page>
<StackLayout class="details-page" backgroundColor="gray">
<Button text="Go Back" tap="onGoBack" />
<Label text="{{ uri }}" textWrap="true" class="details-label" />
<Image src="{{ thumb }}" class="details-image" />
</StackLayout>
</Page>
Binary file added app/icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
153 changes: 75 additions & 78 deletions app/main-page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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",
Expand All @@ -74,78 +75,74 @@ 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
});
}

exports.mainViewModel = mainViewModel;

exports.pageLoaded = pageLoaded;
exports.onSelectMultipleTap = onSelectMultipleTap;
exports.onSelectSingleTap = onSelectSingleTap;
Expand Down
34 changes: 18 additions & 16 deletions app/main-page.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded">
<GridLayout rows="*, auto, auto" class="pick-page">
<ListView items="{{ imageItems }}" itemTap="listViewItemTap" id="urls-list">
<ListView.itemTemplate>
<GridLayout columns="110, auto" rows="*, *, *, *" class="cell-view">
<Image rowSpan="4" width="94" height="94" src="{{ thumb }}" />
<Label col="1" row="0" text="{{ uri }}" textWrap="true"/>
<Progress col="1" row="1" value="{{ uploadTask.upload }}" maxValue="{{ uploadTask.totalUpload }}" />
<Label col="1" row="2" text="{{ uploadTask.upload }}" />
<Label col="1" row="3" text="{{ uploadTask.totalUpload }}" />
</GridLayout>
</ListView.itemTemplate>
</ListView>
<Button text="Pick & Upload Multiple Images" row="1" tap="onSelectMultipleTap" horizontalAlignment="center" />
<Button text="Pick & Upload Single Image" row="2" tap="onSelectSingleTap" horizontalAlignment="center" />
</GridLayout>
</Page>
<GridLayout rows="*, auto, auto, 40">
<GridLayout row="0" rows="*" columns="*" margin="10" >
<ListView row="0" items="{{ items }}" id="list" itemTap="listViewItemTap">
<ListView.itemTemplate>
<GridLayout height="160" rows="*, *, *, *" columns="200, auto" class="cell-view">
<Image src="{{ thumb }}" row="0" col="0" rowSpan="4" stretch="aspectFill"/>
<Label col="1" row="0" text="{{ uri }}" textWrap="true" />
<Progress col="1" row="1" value="{{ uploadTask.upload }}" maxValue="{{ uploadTask.totalUpload }}" />
<Label col="1" row="2" text="{{ uploadTask.upload }}" />
<Label col="1" row="3" text="{{ uploadTask.totalUpload }}" />
</GridLayout>
</ListView.itemTemplate>
</ListView>
</GridLayout>
<Button row="1" text="Pick & Upload Multiple Images" tap="onSelectMultipleTap" />
<Button row="2" text="Pick & Upload Single Image" tap="onSelectSingleTap" />
</GridLayout>
</Page>
13 changes: 13 additions & 0 deletions app/main-view-model.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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;
Loading