I'm trying to use the image upload feature of kendo editor. Image uploading is working fine, but the thumbnails in the browse window is not showing correctly. For achieving this, I'm trying to call a function in thumbnail attribute. But, this is not firing. Please find the code snippet below and help me to find the issue.
transport: {
read: "api/imagebrowser/read",
thumbnailUrl: function (path, name) {
alert('inside thumbnail');
//return "api/imagebrowser/thumbnail?path=" + path + file;
},
uploadUrl: "api/imagebrowser/upload",
imageUrl: "Content/Images/{0}"
}
I'm using WEB API and angularjs. Any other suggestions to show the thumbnails are also welcome.
thumbnailUrl: function (path, name) {
path = "yourAPI/read" + "/" + name;
return path;
}
default path is "", and name is fileName.
I think you already solved...
Good luck.
Related
I can get an SVG file downloaded, additionally, I can display svg files as you would normally within an image tag. I do not know how to access the folder location for downloads or the wgt-private folder so I may download images to a client's watch and then use the downloaded version.
I'm sure my file is downloading as I've console logged on successful download and when I list the items in the directory the file shows up.
Placing downloads/[filename] or wgt-private/[filename] does not appear to work as these are virtual file locations however I've no idea how to access these files within the application without using the filesystem methods.
Download:
var download_obj = new tizen.DownloadRequest('someFile.svg', 'wgt-private');//Hidden the actual location however this file does display when enterting the whole file location
tizen.download.start(download_obj, {
onprogress: function(id, receivedSize, totalSize) {
console.log(id);
console.log(receivedSize);
console.log(totalSize);
},
onpaused: function(id) {
console.log(id);
},
oncanceled: function(id) {
console.log(id);
},
oncompleted: function(id, fullPath) {
console.log(id);
console.log(fullPath);
},
onfailed: function(id, error) {
console.log(id);
console.log(JSON.stringify(error));
}
});
Full path comes out as: wgt-private/someFile.svg
Doesn't display as displays a file error in the console on all attempts.
I understand that your questions relates to how to show the image downloaded with tizen.download API in html img tag.
I can see two workarounds that could help you with it:
You can use filesystem API (which you would like to avoid), BUT since 5.0 there is a method which needs no additional privileges and I hope it will match your needs - FileSystemManager.toURI(). It just gets the path to file (returned by download API) and returns the full URI, able to be used in img.
I noticed that download to non-public directories on the device, download API returns the 'hidden' path which uses virtual root, but when downloading to public directory as 'downloads', the full path is returned and it works for img as well.
If both of above is not acceptable for you, I am afraid that the only alternative is to use regular tizen.filesystem API and resolve the path from download API and then use File.toURI() function to get the path.
var link = "http://techslides.com/demos/samples/sample.jpg"
var download_obj = new tizen.DownloadRequest(link, 'wgt-private');//Hidden the actual location however this file does display when enterting the whole file location
tizen.download.start(download_obj, {
oncompleted: function(id, fullPath) {
console.log("completed " + id + " : " + fullPath);
tizen.filesystem.resolve(fullPath, (s)=>{console.log("Resovled full path: " + s.toURI())}, (e) => {console.log(e)})
},
onfailed: function(id, error) {
console.log("failed " + id);
console.log(JSON.stringify(error));
}
});
You can find the proper web sample app: new Tizen project - Sample - Mobile 4.0 - Web application - Content - Download Manager
Open index.html and replace https://www.sample-videos.com/video/mkv/720/big_buck_bunny_720p_10mb.mkv with your file address.
I followed the interactive live sdk and added it into my HTML page.
Also, I have successfully added the callback.html page where I am successfully getting the file picker dialog box. Once I select file from the file dialog box it's getting downloaded which I understand because of WL.download function.
But all I want is to attach the files rather than downloading it. how to change the javascript in interactive live sdk
Any suggestions?
Sorry about that. You can either use the "source" or the "link" to accomplish this. On the ISDK for "Using the open from OneDrive picker", change the code following code snippet (I used "file.link" below). The Output box should give you some idea on what the link would be if you include it in your app. You'll, of course, will want to remove the "WL.download" function so that it doesn't download the file and add the file.link or file.source somewhere into your code instead of logging it like the ISDK does.
function openFromSkyDrive() {
WL.fileDialog({
mode: 'open',
select: 'single'
}).then(
function(response) {
log("The following file is being downloaded:");
log("");
var files = response.data.files;
for (var i = 0; i < files.length; i++) {
var file = files[i];
log(file.link);
WL.download({ "path": file.id + "/content" });
}
},
function(errorResponse) {
log("WL.fileDialog errorResponse = " + JSON.stringify(errorResponse));
}
);
}
In the ISDK (http://isdk.dev.live.com), you'll want to try using the "Using the save to OneDrive picker". You'll notice that WL.fileDialog is set to ({ mode: 'save' }) and the WL.upload function is called. I hope that helps.
Summary
I am attempting to find out why the wl.download function will not download more than one file even though the Microsoft examples seem to indicate that they can.
And, the code seems to be called for each file you attempt to download, but only the one file is actually downloaded.
Details
Here are the details of how you can see this problem which I've tried in IE 11.x and Chrome 30.x
If you will kindly go to :
http://isdk.dev.live.com/dev/isdk/ISDK.aspx?category=scenarioGroup_skyDrive&index=0
You will be able to run an example app which allows you to download files from your skydrive.
Note: the app does require you to allow the app to access your skydrive.
Once you get there you'll see code that looks like this on the right side of the page:
Alter One Value: select:
You need to alter one value: Change the
select: 'single'
to
select: 'multi'
which will allow you to select numerous files to download to your computer. If you do not make that one change then you won't be able to choose more than one file in the File dialog.
Click the Run Button to Start
Next, you'll see a [Run] button to start the app (above the code sample).
Go ahead and click that button.
Pick Files For Download
After that just traverse through your skydrive files and choose more than one in a folder and click the [Open] button. At that point, you will see one of the files actually downloads, and a number of file names are displayed in the bottom (output) section of the example web page.
My Questions
Why is it that the others do not download, even though wl.download is called in the loop, just as the console.log is called in the loop?
Is this a known limitation of the browser?
Is this a known bug in skydrive API?
Is this just a bug in the example code?
The problem here is that the call to wl.download({ "path": file.id + "/content" }) stores some internal state (among other things, the file being downloaded and the current status thereof). By looping over the list of files, that state is in fact overwritten with each call. When I tried downloading three text files at once, it was always the last one that was actually downloaded and never the first two.
The difficulty here is that the downloads are executed in the traditional fashion, whereby the server adds Content-Disposition: attachment to the response headers to force the browser to download the file. Because of this, it is not possible to receive notification of any kind when the download has actually completed, meaning that you can't perform the downloads serially to get around the state problem.
One approach that I thought might work is inspired by this question. According to the documentation, we can get a download link to a file if we append /content?suppress_redirects=true to its id. Using this approach, we can set the src property of an IFrame and download the file that way. This works OK, but it will only force a download for file types that the browser can't natively display (zip files, Exe files, etc.) due to the lack of the Content-Disposition: attachment response header.
The following is what I used in the Interactive Live SDK.
WL.init({ client_id: clientId, redirect_uri: redirectUri });
WL.login({ "scope": "wl.skydrive wl.signin" }).then(
function(response) {
openFromSkyDrive();
},
function(response) {
log("Failed to authenticate.");
}
);
function openFromSkyDrive() {
WL.fileDialog({
mode: 'open',
select: 'multi'
}).then(
function(response) {
log("The following file is being downloaded:");
log("");
var files = response.data.files;
for (var i = 0; i < files.length; i++) {
var file = files[i];
log(file.name);
WL.api({
path: file.id + "/content?suppress_redirects=true",
method: "GET"
}).then(
function (response) {
var iframe = document.createElement("iframe");
iframe.src = response.location;
iframe.style.display = "none";
document.body.appendChild(iframe);
},
function (responseFailed) {
log("Error calling API: " + responseFailed.error.message);
}
);
}
},
function(errorResponse) {
log("WL.fileDialog errorResponse = " + JSON.stringify(errorResponse));
}
);
}
function log(message) {
var child = document.createTextNode(message);
var parent = document.getElementById('JsOutputDiv') || document.body;
parent.appendChild(child);
parent.appendChild(document.createElement("br"));
}
Did you try to bind some events to the WL.download() method? According to the documentation:
The WL.download method accepts only one parameter:
The required path parameter specifies the unique SkyDrive file ID of the file to download.
If the WL.download method call is unsuccessful, you can use its then method's onError parameter to report the error. In this case, the WL.download doesn't support the onSuccess and onProgress parameters. If the WL.download method call is successful, the user experience for actually downloading the files will differ based on the type of web browser in use.
Perhaps you are getting some errors in your log to identify the problem.
For me, one suggestion without having checked the documentation, I can think of the fact that you are not waiting for each download to end. Why not change your loop in such a manner that you call WL.download() only if you know no other download is currently running ( like calling the next WL.download only in the success/complete event ):
WL.download({ "path": file.id + "/content" }).then(
function (response) {
window.console && console.log("File downloaded.");
//call the next WL.download() here <!-----------------
},
function (responseFailed) {
window.console && console.log( "Error downloading file: " + responseFailed.error.message);
}
);
i have a problem with the the downloaded files in my PhoneGap-App for Android.
The download-Function from PhoneGap actually works quite well i think. It gets the file from the URL and
stores it on the SD-Card. (Code is below)
So where is the Problem? When I download a JPG or PNG to the
Download-folder, i want it be accessible through the native Gallery.
But the picture donĀ“t appear in the gallerie. To see it I have to
restart the phone or I have to use another App like Astro.
Is there a "Refresh_the_native_Gallerie"-Function or something like that?
Thank you very much.
try {
var filePath = 'file:///mnt/sdcard/Download/google.png'; // Correct filePath
var url = "https://www.google.de/images/srpr/logo3w.png"; //Correct URL
var fileTransfer = new FileTransfer();
fileTransfer.download(url, filePath, function(entry) {
console.log("s3_download download complete: " + entry.
// Do i need a "Refresh_all_other_Apps"-function here?
}, function(error) {
// Normally no Error
console.log("s3_download download error source " + error.source);
console.log("s3_download download error target " + error.target);
console.log("s3_download download error code" + error.code);
});
} catch (e) {
console.log("downloadTest ERROR: " + e);
}
Cannot answer my own question so fast only edit my question. So here is the answer:
I wrote a little PhoneGap-Plugin, which does actually nothing more than calling the code from zapl. Thanks again. Hope it will help someone with the same problem.
You can find the code here: https://github.com/philipp-at-greenqloud/pluginRefreshMedia
I don't know if that helps you in PhoneGap / JavaScript context:
Your problem is that the gallery will only display files that are indexed in the device media-database. Just adding a file to the file system will not automatically add it to that database. And pretty much the only time a rescan / update of that database happens is when you reboot the device or remount the sdcard (after it was shared with a PC or in case you ejected it and put it back in).
To have a file added to the database the simplest way to to that is to send Intent#ACTION_MEDIA_SCANNER_SCAN_FILE to the MediaScanner to let it add your file to the database. Once that is done the file will show up in the gallery.
Java code for that would be
File newImage = new File("/mnt/sdcard/Download/google.png");
Intent scanIntent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
scanIntent.setData(Uri.fromFile(newImage));
sendBroadcast(scanIntent);
I wrote a little PhoneGap-Plugin, which does actually nothing more than calling the code from zapl. Thanks again.
Hope it will help someone with the same problem.
You can find the code here: https://github.com/philipp-at-greenqloud/pluginRefreshMedia
This is a well needed plugin. I have been trying to do work arounds for this issue and the plugin works a treat. I was looking at developing one myself, but you have done a great job. My headaches are now subsiding. This works for me.
I am using fileupload phonegap plugin to upload jpeg file to my server from iPad.
It is not working for me.
Here is my code:
window.plugins.fileUploader.uploadByUri('http://192.168.1.54:8080/POC/fileUploader', 'file://Documents/flower.jpg', null, 'myPhoto', 'flower.jpg', 'image/jpeg',
function(result) {
console.log('Done: ' + result);
},
function(result) {
console.log("Error: " + result);
}
);
In fileUploader.js file, I put an alert below the uploadbyuri method. But its not displaying. That means that method is not calling.
What mistake I have done?
Please help me.
Please check this plugins its works for me.
https://github.com/phonegap/phonegap-plugins/tree/master/iPhone/FileUploader
and if its not working please specify proper error that you are getting for upload image.
Me too had the same situation. FileUploader worked fine in cordova1.9.0. When i changed to cordova2.7.0 face the same situation. After a long time messing with the issue, I made it work by remnaming "Phonegap" to "cordova" in fileuploader.js file which is in www folder.
PhoneGap.addConstructor(function() {....
to
cordova.addConstructor(function() {....
and
return PhoneGap.exec('FileUploader.' + method, callback + '.success', callback + '.fail', callback + '.progress', server, file, fileKey, fileName, mimeType, params);
to
return cordova.exec(null,null,"FileUploader", "uploadByUri",[ callback + '.success', callback + '.fail', callback + '.progress', server, file, fileKey, fileName, mimeType, params]);