I'm looking a quick way to add an (multi) image unloader with client side crop to an ASP.NET MVC site and for some reason the search seems to be much more complicated than I thought :(
upload image (can be via form post or custom, just has to work with ASP.NET)
custom crop possibility before upload
(preferred) multiple images at once
It doesn't matter if js/jquery, silverlight or flash is used, it just has to work, its an internal application and I can force people to have the necessary plugins installed.
Basically this is exactly what I want:
http://i-load.radactive.com/
But they are out of business and it seems impossible to get a license :(
**UPDATE**
This should be an all in one solution, I currently do not have the time to figure out how to connect multiple components.
I'm willing to purchase a component that does this, but I simply can't find one, which I find rather strange.
An internal application where you are comfortable with ASP.NET then Silverlight would be the good direction to look in.
There is free multiple file uploader which is designed to work with an ASP.NET server end here: http://silverlightuploader.codeplex.com/
There are number of ways to manipulate an image in Silverlight, either natively or with other Silverlight tools such as: http://writeablebitmapex.codeplex.com/
Finally you can re-encode images to common formats such as PNG with: http://imagetools.codeplex.com/
Whether you could actually combine these as is to acheive your goals would be another matter.
Related
I am using AngularJS in a MEAN stack based on DaftMonk’s generator (https://github.com/DaftMonk/generator-angular-fullstack). I am fairly new to pretty much everything Angular/JS/Node (and stackoverflow so please feel free to point out if I need to reword my question!).
I am aiming to produce a multipage PDF report for a user from an Angular page that contains six graphs, images and text.
There are a number of questions on stackoverflow and Google that relate to potential solutions to this, but having checked these exhaustively, they do not help with what I need to achieve (or I do not understand how I can use them in my scenario..).
Currently, when the user navigates to the ‘report page’, an http request is sent to Node/Express from the Angular controller, which checks the user role/group ID, queries the database, anaylses the data and sends it back to the browser for rendering into graphs (currently using angular-chartjs and flot).
The user selects graph type and can choose a maximum of six graphs to display from a possible list of 20+. These six graphs are what need to be exported to a PDF report (with other information). I need to make this (within reason) as browser compatible as possible (at least IE8+) although my current solution is IE10+ with PDF export disabled for older browsers using Modernizr.
From stackoverflow and Google, possible solutions include using PhantomJS in Node to capture the screen or using a client-side PDF renderer (e.g. jsPDF). Out of these, my feeling is that PhantomJS would provide the most flexibility/browser compatibility. Also, I need to produce several different reports depending on the user role, so having all the code to produce the reports within the browser is not desirable. But I am totally stuck as to how to access ‘what the client sees’ using the MEAN stack. PhantomJS would need to effectively be logged in as the client, and have access to the six choices for graphs that the client has made.
From my research, using PhantomJS would require creating an html page, somehow transferring what the client sees/data/graph choices to it, and then capturing that to render to a PDF, before sending back to the browser. One way might be to pass the required information back to Express (with a POST?) and then rendering a server-side html page which PhantomJS could be pointed to, but I have no idea how to achieve this (or if it's possible). Another possibility would be to store the client report data, choices, etc in the database and set off a task to render the PDF and send it back to the browser when done, but again, I have no idea how to achieve this.
I have read about cookies in PhantomJS or navigating through the login page using code, but this seems to be a cumbersome way to achieve this. Can an html file be created server-side, with chart.js (or another charting library) injected (and angular?) and all the required user data/chart choices for PhantomJS to render to a PDF? I guess in some ways I need to be able to use a PDF generator, charting library, etc server-side to create a PDF.
Any advice (with possible code examples) on how to achieve this would be appreciated.
I guess I had the same problem as you (only I was using Laravel in server side).
The idea I came up with was to convert the canvas generated by angular-chartjs to images (using toDataURL() on the canvas elements)
$('.theCanvas').each(function () {
var canvas=this;
img=JSON.stringify(canvas.toDataURL());
});
http://plnkr.co/edit/PkZiqYynzQXehbe6p1eH?p=preview
and then sending the images to the server to create the pdf , and finally sending the user the link to the created PDF.
In my case, they are plenty of packages to generate a PDF from an html in server side, and I don't know if a tool exists for Node.
I hope this helps.
I have a node web app that needs to convert a docx file into pdf (using client side resources only and no plugins). I've found a possible solution by converting my docx into HTML using docxjs and then HTML to PDF using jspdf (docx->HTML->PDF).
This solution could make it but I encountered several issues especially with rendering. I know that docxjs doesn't keep the same rendering in HTML as the docx file so it is a problem...
So my question is do you know any free module/solution that could directly do the job without going through HTML (I'm open to odt as a source as well)? If not, what would you advise me to do?
Thanks
As you already know there is no ready-to-use and open libs for this.. You just can't get good results with available variants. My suggesition is:
Use third party API. Like https://market.mashape.com/convertapi/word2pdf-1#!documentation
Create your own service for this purpose. If you have such ability, I suggest to create a small server on node.js (I bet you know how to do this). You can use Libreoffice as a good converter with good render quality like this:
libreoffice -headless -invisible -convert-to pdf {$file_name} -outdir /www-disk/
Don't forget that this is usually takes a lot of time, do not block the request-answer flow: use separate process for each convert operation.
And the last thing. Libreoffice is not very lightweight but it has good quality. You can also find notable unoconv tool.
As of January 2019, there is docx-wasm, which works in node and performs the conversion locally where node is installed. Proprietary but freemium.
It appears that even after three years ncohen had not found an answer. It was also unclear if it had to be a free (as in dollars) solution.
The original requirements were:
using client side resources only and no plugins
Do you mean you don't want server side conversion? Right, I would like my app to be totally autonomous.
Since all the other answers/comments only offered server side component solutions, which the author clearly stated was not what they wanted, here is a proposed answer.
The company I work for has had this solution for a few years now, that can convert DOCX (not odt yet) files to PDF completely in the browser, with no server side component required. This currently uses either asm.js/PNaCl/WASM depending on the exact browser being used.
https://www.pdftron.com/samples/web/samples/viewing/viewing/
Open an office file using the demo above, and you will see no server communication. Everything is done client side. This demo works on mobile browsers also.
I need to detect the size of the file before upload.
I need it to work in IE8, thus not HTML5
It needs to be entirely client side.
I need to be able to specify file size limit.
I am aware that ActiveX can be used, but I cannot use that due to it requiring the user to 'permit' it.
I have tested BlueImps plugin, but it doesn't seem to work and the documentation does not seem to state browser support.
Can anyone suggest a plugin/method with fits with my criteria.
If you're willing to introduce a dependency on Flash, then you could use that to get the file size (and handle the upload too).
Flash supports file-selection via the FileReference class, which gives you access to some metadata including the file size.
With some help from the ExternalInterface class, you could call a JavaScript function and give it this information.
You could then upload the file from Flash instead of with the usual input element, if the file size is appropriate.
Check out YUI's uploader for a really easy-to-use and well-documented free component that handles all this for you (you only need to write a little JavaScript, and you can style the pre-built Flash component however you want).
I'm looking for multiple file upload component with alternative ways.
I need HTML5, Flash and normal upload support, depended by device.
I don't like FancyUpload, because it uses mootools and mootools is very big library.
Also I can't use jQuery, because I'm writing on Ext js and it's not good idea to use two big library like jQuery and Ext js.
I can write it myself but I don't have a time.
If everyone knows any library like this, please post link here.
Thanks!
I am a big fan of Plupload
Here is an example of all run times supported (Flash, HTML4, HTML5, etc...): http://www.plupload.com/example_all_runtimes.php
You can also include only the run times you want.
Here is an ExtJS 4 wrapper I wrote for SWFUpload: https://github.com/JarvusInnovations/Ext.ux.SWFUpload
I'm interested in having a more robust ExtJS4 upload widget though that supports HTML5 and normal form upload too. Maybe we can build one if nothing else turns up.
HTML5 Rich app.
I need to deliver to a user printable (A4 format) report from the application. So that the user could see it preview version in the app, and then print it.
What alternatives do I have to do that?
We are currently doing this at Agency Fusion, and have been looking at some libraries/services like:
WickedPDF (ruby)
DocRaptor (SaaS with multi-lingual api wrappers)
Prawn (ruby)
We have decided to go with Wicked PDF and using css page-break properties
This way we have control over how the pdf is rendered. The user can then download the PDF as the report, and then send it to the printer if they wish to print it.
There are two completly different approaches:
Try to create "printable" HTML, deal with all cross-browser issues (I mean the printing-related ones, that go on top of the "usual" ones), lose control over page headers etc.
Use something, that is "electronic paper" - PDF being the most prominent suspect. There are many libraries to facilitate this approach.
You might be able to infer which version I prefer from my tone.