Web Based WYSIWYG Editor with Photo Upload support - javascript

Does anyone know what my options are for Web-based WYSIWYG editors (the type which acts like a textarea but produces HTML) are?
I need one with support for image uploads - This would be for a basic CMS that I am developing which needs to be fairly user-friendly. I can handle the server-side upload processing, but I need an upload option to be there.
A combination of CKEditor and CKFinder may have been ideal, but CKEditor seems to have been commercialised - I'm looking for something which is free/open source.
I think that this post belongs here... It was a tossup between stackoverflow and webmasters. Sorry if I'm wrong!

I use TinyMCE and there are several upload plugins that you can use with it, including these here.

Related

Async file upload in IE 9 and 10 only

Objective
I am creating a web application and have been looking for an async file upload solution other than iframe and form support.
Browser Support
I am fully willing to exclude everything but IE9+. IE tends to be the browser I have the most trouble with.
Goal
I have a table and I want to be able to click on a link, show a file dialog and then upload the file immediately after selection. No page refresh.
More specifically I am trying to figure out how Trello does their file uploads. After looking through the javascript, I found that they bind the the file input to an on change listener, but after that I can't see what they are doing. Im under the impression that they use websockets with node.js to transfer data, but after doing a little research, most people say that websockets wouldn't be good for that. Trello blocks all versions of IE except 9 and 10 so I looked into HTML5 File upload think that may be a solution. However, after some research IE9 does not support the HTML5 File API.
Question
So finally I am looking for some way to upload files without the iframe and form solution. Can someone list the possible methods I could use?
Sidenote
I am using Rails for backend and Ember.js for front end.
If the browser does not support the File API and XMLHttpRequest level 2, there is no other way to upload files in an async/"ajaxy" manner other than reverting to the hidden iframe method. You could, of course, use Flash or Java, but neither of those (especially Java) seem like a good solution to me.
Regardless of the browser, you will have to include a file input element on the page if you want to provide a file chooser for the user. The onchange listener you speak of is vital to determining when the user has actually selected a file or files. In browsers that support the File API, you can also allow users to drop files they wish to upload onto your page. This behavior alone does not require a file input element.
IE9 and older do not support the File API.
I'm quite familiar with this territory as I maintain a fairly popular javascript-only upload library: Fine Uploader.

Multiple file upload (client side)

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.

Component to upload multiple images with client side crop

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.

Javascript(or maybe not) text editor with Image Upload functionality

I'm working in Ruby On Rails 2.3.8 and I need to use a text editor in which I could upload images.
Currently, I'm using TinyMCE, but doesn't have that feature. So, I've tried the TinyFCK, but I could not make it work (it uses PHP, so I'm not sure whether it will work or not in ruby on rails).
Does anybody know any?
Here a TinyMCE Rails version with Image Uploading.
So you've tried ckeditor? It's Javascript, not PHP. Some of the upload examples show PHP scripts to handle the browsing and uploading of images on the server but there's nothing to stop you creating these with Ruby.
You might want to have a look at TinyFCK or other plugins described and evaluated here.

How to implement gmail like file upload/attachment using HTML 5

I remember some options where Ajax like(No post back world) file upload was supported,
Hidden iframe
Using flash object (Though i still have curiosity of why SWF is used ? and what advantages it offer ?)
However by looking at blogs it appears that HTML 5 is promising, i tried some small examples and it really works :)
But recently i found that gmail has new drap drop file feature implemented using the HTML 5 (No flash).
Can some one guide me how this can be achieved and what all i need to prepare ? Is there change in XMLHTTP...(Ajax object) api in HTML 5 ?
Any threads will be helpful
thanks all,
I could be wrong, but I think the only help that HTML5 gives for such an upload-pattern is that it supports the attribute 'multiple' for upload fields.
This allows you to select multiple files from the file-chooser dialog without using flash
.
The uploading itself still has to be done by JS or PHP or [yourfavorite]. A nice helper could be
http://code.google.com/p/jquery-html5-upload/
for example.

Categories