I am using below code to read a ZIP file at client side
var Zfile = new Zipfile( $('#xfilex').val() );
var file = Zfile.entries[0];
// From Here file reading continues... I am giving this to say what I am trying to accomplish
if(file)
{
var reader;
reader = new FileReader();
reader.readAsText(file, "UTF-8");
reader.onload = loaded;
}
But I am unable to read the file... Please help me to find mistakes in the above code. It is pure JavaScript and taken the reference from Unzipping files Question. I hope I can get help.
Related
I am currently trying to import data into illustrator for text field manipulation via a .jsx script.
However how can I get the information from a local file in the same folder and use something like a filereader to parse it?
<input type='file'>playerdata.csv</input>
main(input);
function main(input){
var document = app.activeDocument;
let file = input.files[0];
let reader = new FileReader();
reader.readAsText(file);
reader.onload = function() {
console.log(reader.result);
}
this does not make any sense in a javascript .jsx file right?
I have been trying to use sheetJS and follow examples that completely work in jsfiddle, however I cannot get to work when creating a new js file. I have tried multiple browswers, but keep getting the same error "XLSX is not defined"
I have tried this Excel to JSON javascript code? and wanted to ask on there but needed 50 rep to leave a comment.
Here is the code snippet and am including the following files in this order:
shim.js, jszip.js,xlsx.js
var oFileIn;
$(function() {
oFileIn = document.getElementById('xlf');
if(oFileIn.addEventListener) {
console.log("if hit")
oFileIn.addEventListener('change', filePicked, false);
}
$("#xlf").on("change",function(oEvent){
console.log("jqiey workd?")
filePicked(oEvent)
})
});
function filePicked(oEvent) {
// Get The File From The Input
var oFile = oEvent.target.files[0];
var sFilename = oFile.name;
// Create A File Reader HTML5
var reader = new FileReader();
// Ready The Event For When A File Gets Selected
reader.onload = function(e) {
var data = e.target.result;
var cfb = XLSX.read(data, {type: 'binary'});
console.log(cfb)
cfb.SheetNames.forEach(function(sheetName) {
// Obtain The Current Row As CSV
var sCSV = XLS.utils.make_csv(cfb.Sheets[sheetName]);
var oJS = XLS.utils.sheet_to_json(cfb.Sheets[sheetName]);
$("#my_file_output").html(sCSV);
console.log(oJS)
$scope.oJS = oJS
});
};
I have tried numerous examples, this is just the only one I came across that worked on jsfiddle. The same error occurs if it is XLS or XLSX...
In other examples such as the one provided by sheetJS it has
var X = XLSX;
right under the script segment, and will automatically get error that XLSX is not defined on that line.
Anyone come across this, or know what the issue is?
-Thanks!!!
The included files with the project weren't correct. The project had a corrupt js file. I fixed it by manually adding all sheet project download folder and replacing files.
I want to make a multiple images upload system with prograss bar. I want to do with simaple code(using jquery or js). I want when user has upload his images on browser and i want to show on browser that images and with upload button he starts uploading image via ajax in his folder.
So questions
1.) Is it possible to show uploaded image (without any complicated code) ?
2.) Do i get a variable or array where uploaded images are stored as base64 code (data:/img:dfd5d/d54fs..... something like this) or encoded?
3.) How do i add progressBar ?
I didn't write any code yet because i dont know how to start. I am new in computer science.
But i find this code on this site
function previewFile() {
var preview = document.querySelector('img');
var file = document.querySelector('input[type=file]').files[0];
var reader = new FileReader();
reader.onloadend = function () {
preview.src = reader.result;
}
if (file) {
reader.readAsDataURL(file);
} else {
preview.src = "";
}
}
This is easy code and i understand but one thing is not clear what does mean this line var reader = new FileReader(); why use new and what is it ?
Ty in advance and please dont explain complicate and i am not very good in english. So please try to explain in poor words if possible..
Assuming that you have this field
<input type="file" onchange="showImage(this)"/>
you can create a script to take the binary data and show it
function showImage(input){
var reader = new FileReader();
// validating...
var fileType = input.files[0].type;
var filesize = input.files[0].size;
// filetype (this will validate mimetype, only png, jpeg, jpg allowed)
var fileTypes = ["image/png", "image/jpeg", "image/gif"];
if (fileTypes.indexOf(fileType) < 0){
// return error, invalid mimetype
return false;
}
// file cannot be more than 500kb
if (filesize > 5000000) {
// return error, image too big
return false;
}
reader.onload = function (e) {
// e will contain the image info
jQuery('#myimagetopreview').attr('src', e.target.result)
}
reader.readAsDataURL(input.files[0]);
}
This should work, if you have problem tell me
edit: FileReader is not supported by all the browsers, check the documentation for more https://developer.mozilla.org/en/docs/Web/API/FileReader
The FileReader in JS has Status "Working Draft" and isn't part of the official JS API. I think you have to wait until the Browsers support this ne API or you have to activate experimental JS API in the Browser.
I do not understand why this code is not working I am new to coding in javascript and I can't figure out the filereader.
var reader = new FileReader();
reader.onload = function {
var data = reader.result;
alert(data);
};
reader.readAsText("file:///C:/test.txt");
simply put, you cannot access the clients Filesystem with javascript. it's a security measure. you can't use the file protocol.
I have the following file structure:
test.html
test.json
And the following JS function:
function get_file(){
var app_path = app.activeDocument.path,
file = new File(app_path + '/test.json');
console.log(file);
}
How can I make the function log the file's content?
I'm not sure if everything you can do in the browsers environment translates to everything you can do in photoshops environment. But you should look at a few things.
Doing This in the Browser
The File object.
https://developer.mozilla.org/en-US/docs/Web/API/File
Notable that it extends the Blob object.
https://developer.mozilla.org/en-US/docs/Web/API/Blob
Which if you researched you would find it can be read using the FileReader.
https://developer.mozilla.org/en-US/docs/Web/API/FileReader
So this would work in the browser but may/may-not work in the photoshop scripting set.
function get_file(){
var app_path = app.activeDocument.path,
file = new File(app_path + '/test.json');
var reader = new FileReader();
reader.onloadend = function() {
console.log(reader.result);
}
reader.readAsText(file);
}
This is asynchronous so you may need to use a callback depending on what you're trying to do with this. You won't be able to return the string from inside the reader.onloadend event.
Doing This in Photoshop
Take a look at their scripting references. Specifically the javascript reference.
All Resources: http://www.adobe.com/devnet/photoshop/scripting.html
Javascript PDF: http://wwwimages.adobe.com/content/dam/Adobe/en/devnet/photoshop/pdfs/photoshop-cc-javascript-ref-2015.pdf
It looks like they don't have the FileReader but instead the File object can be used to read content. The File API begins on page 109 but it's empty! The documentation is a bit pathetic so I can see why you'd have trouble finding this. With some searching I found someone doing this in 2012 (but I don't know if it will still work- worth a shot)
var b = new File("c:\test.txt");
b.open('r');
var str = "";
while(!b.eof) {
str += b.readln();
}
b.close();
alert(str);
Let me know if that works.