CKEditor Image Upload - asp.net-mvc

I am looking to include CKEditor in a project I am working on and I need the image upload support provided by the CKFinder plugin, however I do not particularly need the rest of the CKFinder tool and thus purchasing a license is a little overkill. Has anyone taken the time to implement a custom image uploader for CKEditor 3 that will work with ASP.NET MVC? If need be I can create my own, just wanted to check here first.
Alternatively, does anyone know of a decent WYSIWYG editor on par with CKEditor / Cute Editor that supports image uploading and will work in ASP.NET MVC?

Here is a image uploader I originally wrote in ASP.NET WebForms for Fckeditor (hence the theme no longer matches), that I've modified to work with Ckeditor.
https://github.com/mcm-ham/ckeditor-image-uploader
Update: I've now added an example showing how you can add this WebForms image uploader to a MVC project.
Update 2: I've now added a Razor Pages version which can be used in .NET Core MVC projects.

Here is a tutorial on how to upload image with ASP:NET MVC2 (not Webforms) using CKEditor
http://arturito.net/2010/11/03/file-and-image-upload-with-asp-net-mvc2-with-ckeditor-wysiwyg-rich-text-editor/

I have used ckeditor and the upload control using ASP.NET, but not MVC specifically. I haven't found anything on par with ckeditor that is even close to being as easy to set up or offers the same features.
Not sure of the restrictions for MVC, but I set up file upload support by using the following:
The basic documentation referring mostly to the CKFinder plugin you mentioned:
http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_%28Uploader%29
Better documentation on how to implement the upload component:
How can you integrate a custom file browser/uploader with CKEditor?
Otherwise, I believe ckeditor just stuffs all the image bytes in the request object and sends it to the page configured for uploading. This page can take those bytes and do whatever it pleases (i.e. save them to the file system, sql server, etc.) This is where the custom implementation comes in.
Instead of using a page to do the upload, I used an httphandler implementation. The page ckeditor redirects to calls the requisite javascript function to indicate the status of the upload after it is complete, but the handler really controls the actual file upload. The basic implementation for the httphandler I used is at:
http://darrenjohnstone.net/2008/07/15/aspnet-file-upload-module-version-2-beta-1/
Hope this at least gives you a starting point.
UPDATE: found this while searching for some other stuff. Didn't look at in depth, but seems to be right up your alley:
http://interactiveasp.net/blogs/spgilmore/archive/2009/06/03/how-to-support-file-uploads-in-asp-net-mvc.aspx

If you need to implement it quickly and have a reliable solution, you may consider a hosted solution to upload and store images for CKEditor - for example, our plugin:
http://ckeditor.com/addon/uploadcare

Related

.NET 4.5 System.Web.Optimization bundling use on CDN

I'm building a CDN, and looking for a ways to utilize .NET minification/bundling mechanism (System.Web.Optimization) there.
The question is how can I return minified bundle from MVC controller.
Note: I'm looking to use native .NET 4.5 capabilities, I do not want 3rd party solutions.
I'm only looking for ways to utilize this on CDN side. Not on client application side.
Additional question: If the above is possible at all, please explain how can I take advantage of caching, which is normally achieved through adding unique query string parameter to request.
The asp.net bundling and minification uses WebGrease internally.
Grab it off nuget and add just start using it. It looks like the codeplex site doesnt have any examples on there so you will need to look at the source code or download/decompile the asp.net source code to see how they use it.
For the query string parameter I believe that is mainly to prevent/aid client side caching it doesnt neccessarily have anything to do with your server side.
You haven't said how you plant to serve up the JS files from your custom CDN so I can't help much with the caching, I would highly suggest not serving them through mvc though, there will be a lot of extra things happening in the pipeline that you dont really need if all you're doing is serving static files.
Perhaps look at having some process that parses the files and sticks them in a certain directory that IIS can serve directly without delegating to asp.net

How do I redirect requests for certain images in ASP.NET MVC 4?

I'm integrating a 3rd party jquery plugin into a page on my ASP.NET MVC website and I have found that it expects that the images are in an img folder relative to the page it is on. It generates img tags looking like this:
<img src="img/blah.jpg">
The trouble is, my page is at a URL like mysite.com/mycontroller/view/id and so there is no easy way of putting the img folder in the right place for it to pick up the images. I need the img tags to be like this:
<img src="/Content/img/blah.jpg">
Obviously I could edit the 3rd party javascript to output a different path every time it creates an img tag, but I am wondering whether there is a better way in ASP.NET MVC (perhaps with rerouting?).
(I am very new to ASP.NET MVC and web development, so please tell me if I'm going about this in completely the wrong way).
I would recommend avoiding trying to fix this via routing. It's going to be easier and most performant to edit the script to have the path be correct. Fixing it in the client script is likely as easy as a find and replace or just editing a single string object.

File upload control for asp.net mvc

I'm writing an asp.net mvc application. I'm looking for free control to make file(s) upload. (Multiple files upload is not required). I found uploadify, ajax uploader, c5 filemanager.
I'm looking rather example which I could include in Razor form and add additional fields such as i.e. file description.
Do you have any specific control which you could suggest?
Uploadify in my opinion is the best.
Check out:
How do I get jQuery's Uploadify plugin to work with ASP.NET MVC?
its the same in mvc3.

Combine, minimize and gzip for CSS and JavaScript files for ASP.NET MVC

Good day!
I'm looking for solution to combine, minimize and gzip CSS and JavaScript files. It seems they come in two forms:
In form of ASP.NET handler\module with processing files on the fly (with caching results)
In form of VS build tasks (to perform processing while building)
Generally I'm ok with either.
I've looked on a number of solutions (and I use ASP.NET handler from this article http://www.codeproject.com/KB/aspnet/httpcompression.aspx a lot), but maybe something "must have" came out and I've missed it.
Thanks in advance!
Here's my advice to you: use build tasks and HTTP cache the output.
In terms of build tasks, you'll want to check out your favorite JavaScript minifier (my favorite is Google Closure Minifier) that has a command line utility that you can just plug into your project file, MSBUILD file or NANT file. Same deal with CSS (I personally use Yahoo! YUI Compressor). If you're into using LESS, you can certainly combine this with the YUI compressor. To optimize images, I'd use optipng. There's directions on how these guys work on their individual sites.
Now, after you have these files all nice and optimized, you'll want to output them using a handler or controller action for MVC. To set the expiration so that subsequent requests will default to the file downloaded on the first request, you'll want this to run in your code:
Response.ExpiresAbsolute = DateTime.Now.AddYears(1);
More than likely you'll want a cache-buster strategy so that you can change the content files. You'd do this by passing a random parameter to your handler. There are a few different ways to go about this... just Google it.
Hope this helps.
I'm using the telerik mvc components for small-medium sites. It was simple to add and configure with NuGet.
Moth can (among other things) handle all your javascript / css requests on the fly. See Wiki: Javascript.
Best of all, it can also put all javascript at the bottom of the page, including parts you write in your partial views! Wiki: Inline script.

ASP.NET MVC Server File Browsers

On my current project we would like to expose some server directories to the client so they can control their own assets/static HTML/CSS etc. The existing web forms project is being replaced by MVC and I am struggling to find an out of the box server file browser with which to expose this functionality.
Here is an example for WebForms: Telerik FileExplorer demo
Can anyone recommend a decent alternative which is designed for the MVC framework? We don't mind paying license fees, however something extensible and preferably open source would be better :)
Look for some jQuery,Ajax based file managers
some links to start with
http://plugins.jquery.com/project/SFBrowser
http://riderdesign.com/articles/Build-a-file-tree-explorer-with-jQuery-and-ASP.NET.aspx
jQuery File Tree works well for me.
It is read-only and you can set root directory and other options.
It has an ASPX connector included in package.
[Full Disclosure: I work for Telerik.]
Telerik has not yet recreated the RadFileExplorer reusable UI experience for MVC, but we do have a powerful Treeview in our open source Telerik Extensions for ASP.NET MVC. Using the Treeview, you can easily create a server file explorer using techniques similar to those in the RiderDesign article highlighted by Ajay. One advantage of using the Telerik Extensions vs. something like a JavaScript UI plug-in is that you get server and client-side rendering, improving your application's accessibility and behavior in non-JS clients.
You can learn more about using the Treeview in these online examples:
http://demos.telerik.com/aspnet-mvc/TreeView
Hope that helps.

Resources