Working with PSD on psd.js library - javascript

I have a requirement from a client to show images from a PSD(photoshop) file which have multiple layers, on each layer there will be an image, I did some research about it but haven't got any leads, so far I come up with a JS library named psd.js, but I think that is only for parsing and converting to image format(not sure haven't found much documentation on internet). please suggest me if there is any open source library for reading and editing PSD files. (javascript or asp.net preferred)
here is my snippet I have tried so far but haven't got any success, please let me know if there is any way to work with PSDs
thanks.
PSD.fromURL("images/example.psd")
.then(function(psd) {
psd.tree()._children[3]._children[0].visble = false;
document.getElementById('ImageContainer')
.appendChild(psd.image.toPng());
console.log(psd.tree().export());
});

I did something similar for a project of mine, for that you can use imagemagick they even have a command line tool that can make the process very easy. It will let you extract the images from each layer. You can also use psd.js to get information about the each layer positioning and other information.
Hope this helps.

Related

How to convert PDF into image or compress the PDF JS?

I am using next js for my web application, I am having a requirement where when a user uploads a pdf to my input, I will have to compress it (for example: 1MB). I searched here and there, but I am not able to get a prominent solution which can help me out! If I cannot compress a pdf, I would at least like to convert it into an Image, which I can use a library to convert? Can someone help me out on how to compress a PDF?
I would recommend:
Convert API
You have to pay, but it is a very easy and clean solution.
Alternatively, you can use:
Shrink PDF
...which is a wrapper for ghost script. more complex than the Convert API but easier than implementing ghost script yourself.
Or:
Ghost script
...You can implement it yourself if you wish.
Realistically, you are not going to be able to get a simple Node package where you can just do pdf.compress() and it is done well, unless it is a paid API.

read text file and save the content in an array using JavaScript

I've searched a lot about this topic, but couldn't find solution. I have a *.txt file containing coordinates (each line has one coordinate) in one column. So, I want to read this file from my file system and use those coordinates to visualize the tracking route on Google Maps API v3. I've already visualized the track for three coordinates and it works fine.
Can anybody just share a sample code of reading a *.txt file and fill an array with the file content? Maybe this is quite easy thing, but I am really stuck on this and would appreciate your help!
Thanks in advance!
You can't read a file using javascript. It's a client-side programming language. But some developpers have developped a solution.
Check this link and tell me if it was helpful for you: http://www.htmlgoodies.com/beyond/javascript/read-text-files-using-the-javascript-filereader.html#fbid=iTAoMveIKhq
I'm not going to share a sample code but you could read the answers to that similar question :
Javascript - read local text file
Basically loading the txt file with Ajax, and read the responseTextattribute of the response.
Although it would be easier to read a xml file or a json file, which would be easier to parse than a simple txt file.

Best approach to generate a third-app party file preview in Google Drive?

Google Drive team has recently announced that third-party Drive app can provide their own thumbnail as a file preview (http://googleappsdeveloper.blogspot.com/2012/10/thumbnails-for-your-custom-file-types.html).
What is for you the simplest way to achieve that?
Our app is using AngularJS on front-end and Python webapp2 on the backend-side.
The fact that the file URL is not public and since we won't make our users' files public, it sounds harder to make it on the server-side so I started my research by looking front-end solution.
I found html2canvas (http://html2canvas.hertzen.com) which sounds great but which does not generate a correct render of our app (missing part).
I was also thinking about something with PhantomJS to generate this preview but it sounds a little bit overkill.
Thanks for your help.
Edit
It actually works, but Google Drive renders it in small (like 300x200px) whereas the original canvas is 630x456px. Any thoughts on this issue?
Please find the original thumbnail and its render in Google Drive attached.
I would have suggested html2canvas, but as you found out it has some limitations which may make it a non-starter. Depending on what you'd like as the preview, a full screenshot might not be necessary. If, for example, you're referring to http://www.videonot.es/, a still/thumbnail image from the video might be a sufficient preview image.

pulling pages from a pdf file and display it?

this is just a rough idea, i am trying to create a magazine reading platform and i need the reading flow to be smooth, and so is the magazine upload process, it must be fast and easy. so i am thinking of using pdf file.
I am thinking is it possible to have a module(maybe a system?) to pull each page from the pdf and display it in a interface written in html? i know there is something similar in flash, but what i want it is something lighter and easier from development. coz at the end i am gonna put this module into maybe a cms system.
thanks in advance guys:)
Regards,
WJ
hi guys i just found this solution, pdf.js, it uses javacript to implement pdf displaying on the web page, it also able to create pdf file from javascript.
anyway the reader is there, and interface is able to change since it is html, i guess this should be the solution.

Eclipse Javascript code assist problem in using WTP

I'm new to WTP so excuse me if the solution to this is obvious. When i define and use a class from within the same file i get nice code assist help, i also get code assist for classes from the standard libraries. Unortunatly, when i try to use code and declarations from one file in another file i no longer get t he nice code assist features. I have searched the web and tried a couple of things, making shoure JS is enabled for the project, making sure the folder the scripts are in is added to the JS source folder list and even trying making a new folder with the decleration files in and adding it as a library. I would really like ot get this feature working so any help would be appreciated.
you can try spket IDE. after install, you need to config javascript profile to get code assist works for you.

Categories