CLEditor Roadmap

[Chris Landowski]

Just in case anyone is wondering, here is what I am planning for the
next release:

1) Get rid of depreciated <font> tags across all browsers when the
optional parameter useCSS is true. Believe it or not, this is a ton of
work!

2) Add proper handling of the Enter and Shift+Enter keys based on a
new optional parameter. Enter should always start a new paragraph <p>,
while Shift+Enter should insert a line break <br>. The optional
parameter would allow forcing a line break <br> for both Enter and
Shift+Enter.

3) I am considering writing a YouTube plug-in. Not sure on this one
yet.

4) I am also considering writing a Paste as Word plug-in.

5) Add an button init callback for custom plug-in development.

Here are some other enhancements I am planning for future versions:

1) Add queryCommandState logic for the buttons. This would cause the
bold button to appear pressed when the current selection or cursor
position is bolded.

2) Add keyboard shortcuts Ctrl+B for bold, Ctrl+U for underline,
ect...

3) Add a resize grip.

4) Redesign the icon plug-in so that it uses a single strip of images
when inserting the <img> tag. This can be accomplished using the CSS
backgroundImage property similar to how CLEditor works with the
toolbar buttons.

5) Add image upload capabilities.

6) Add i18n internationalization support.

Let me know what you think?

[Bill Dawes]

Mate, I think you are working f&^%$ing hard here to create a damn fine
application. I honestly don't know how you find the time to deal with all
the questions and do the development. You're a star!

>No virus found in this incoming message.
>Checked by AVG - www.avg.com
>Version: 8.5.448 / Virus Database: 271.1.1/3192 - Release Date: 10/12/10
>06:34:00

[Dudelisius]

Sounds wonderful! A lot of things I would love to see!

At the moment I'm almost done with a youtube plugin. I will post the
code when finished (at the moment it laks of validation and is
designed for cleditor icm with fancybox). It gives the possibilities
to embed a video, create a textlink (and open video on frontend in
fancybox in a user set size) or use the youtube img from a video as
link (also fancybox in a user set size)

[Mike]

Sounds good, although I do have a couple comments.

2) I think the functionality should be reversed. To many users get
frustrated with RTEs inserting <P> tags and not <BR>. In my opinion,
Shift+Enter should be left alone.

- I would also like to see cleditor internal functions use the exposed
cleditor.imagePath function. That way we can override imagePath for
custom CSS locations.

- Mike

[Chris Landowski]

Hi Mike,

If you look at TinyMCE and CKEditor, I believe they are handling the Enter
key issue as I indicated. Microsoft Word also does the same thing. By adding
in an optional parameter, you would be able to override this behavior to
only insert breaks.

I totally agree with cleditor using the exposed imagePath function
internally and have already added to the list of items for the next release.

Chris

[Dudelisius]

I agree, I've spent a long time searching for a wysiwyg editor, before
deciding to use cleditor.

The enter behavior is maybe not a natural progress, but most users
(including users who use a system with tinymce) are accustomed to this
behavior.

By adding in an optional parameter, like Chris said would be the best
complete package.

Like posted before I added some validation to a youtubeplugin.
I created a separate discussion for this:
http://groups.google.com/group/cleditor/browse_thread/thread/b336cf30e716089a

[Patrick]

Chris,

I share Bill D's sentiments. I greatly appreciate the time and work
you put into what is quickly becoming an essential utility. Thank
you.

Regarding the list, I am very interested in future enhancement #2
(keyboard shortcuts). After you informed us that it works in IE, it
has made the user experience EXPONENTIALLY BETTER. Any time users can
avoid taking their hands off the keyboard to move the mouse to click a
button, productivity increases ten-fold, and I would argue, the
attractiveness for users to use cleditor. It has become the only
reason I would ever want to use IE.

Future enhancement #5 (image upload capabilities) is also of keen
interest to me. Not sure how you would implement it, as I am
currently developing my site on Google's App Engine. There's no
filesystem, but a Blobstore. I have it on my list of to-do's as to
how to integrate the current image functionality with GAE's
infrastructure.

Cheers,

Patrick

On Oct 12, 4:14 pm, Chris Landowski <chrislandow...@gmail.com> wrote:

[chadoh]

I agree, CLeditor is wonderful, and I'm very happy to see what you
have planned next. All very great features.

More specifically:

1) <font> removal
Hip hip hooray. For my application, I'll be turning off the features
that cause this until your next release (here's looking at you, text
colors).

2) <p>s and <br>s
I support your vision here. Does this mean all of the <div>s will no
longer be inserted? Right now we end up with a lot of markup like
"Hello, <div><br></div><div>My name is Sven</div>" -- which is awfully
wonky.

3) Youtube plugin
I'm interested to see what the community comes up with. Could be
really cool.

4) Paste as Word
HELLS YES. Such a problem for my users. In order to kill the beast, we
must play along with its shenanigans for now.

5) button init callback
Not sure what the implications are of this.

1) queryCommandState logic for the buttons
A much desired UX tweak. It's disconcerting to not know if you've
selected something unless you start typing again.

2) keyboard shortcuts
This would be wonderful. If possible, replace Control with Command for
we Mac users.

3) resize grip
Yum.

4) Icon plugin redesign
Don't use this and can't speak to it.

5) Image upload
This would be delicious. But. It needs to be very configurable on the
backend. Everyone probably wants to upload images differently. I want
to upload mine to Amazon S3. Patrick might want a blob in his
database. Unless I'm mistaken, no matter how you do this it's going to
require some interesting ajax acrobatics (tell me if I'm wrong!). So,
perhaps the best option would be:

* Make a configuration option called something like imageUploadPostURL
* Setting this option will enable the feature (without it set,
clicking the 'Image' button in the toolbar results in the current
behavior)
* CLeditor will post the file specified by the user to the URL
specified in the imageUploadPostURL parameter
* CLeditor displays a loader wheel
* CLeditor receives a JSON response from the backend with an error
message if upload failed ("Only .jpg, .png, or .bmp files, por
favor!") or the image's URL if upload succeeded
* CLeditor displays the error message the user or inserts "<img
src=[returnedURL] />" into the document

6) i18n
This would be great. I haven't used i18n outside of Rails, though, and
I'm not sure how other folks tackle the problem. Rails has a config/
locales directory with files like "en.yml" and "es.yml" that all of my
other i18n stuff is stored in. I doubt my javascripts even have access
to this directory, though... I don't know. I'll be interested to see
how the community tackles this.


Other thought:
Pretty pretty please move the project to Github? Personally, I'm more
familiar with Git, but I think we can *all* agree that Github is a
much nicer website than Gode. Also, anyone can clone the entire repo,
make modifications, and send you a pull request. Honestly, I'm not
familiar with Subversion and so I can't articulate why Git is better,
but I know some very good software developers who switched to Git and
champion it.


And finally, thank you!
You're doing fantastic work here, and I'm very pleased to see the
direction you're taking it in. Spot-on. I am feeling well taken-care-
of in your hands, and I'll gladly lend you mine if I have the time and
know how to tackle something.

[Chris]

Chris,
Please retain the functionality to generate source that contains
deprecated tags. We use CLEditor to style text for a Flash
application, and unfortunately Flash only recognizes the <font>, <b>,
and <u> tags. It does not recognize <span> and contemporary CSS
practices. I'm sure it's a less common use for your editor, but
thought you should be aware.

Thanks for your effort!

On Oct 12, 4:14 pm, Chris Landowski <chrislandow...@gmail.com> wrote:

[Chris Landowski]

I also use CLEditor to generate HTML source that is later converted into PDF
files. The conversion program I wrote is only capable of handling font tags
and I have no plans of adding CSS support, so I pretty much need this
capability!

-----Original Message-----
From: cled...@googlegroups.com [mailto:cled...@googlegroups.com] On Behalf
Of Chris
Sent: Friday, October 22, 2010 2:23 PM
To: cleditor
Subject: Re: CLEditor Roadmap

[MasterChief]

Great news! I love clEditor :)
Great piece of software.

[M.P.C]

The enter handling and resize will make this unbeatable.

Cleditor is in my mind the cleanest WYSIWYG out there and writing plugins for it is far simpler than any of the other options.

[Mike McKee]

Chris Landowski:

For me, the resize thing would be very necessary. Also, please ensure that IE9 support is handled because people have been claiming that your control doesn't work in IE9 during a POST. I don't have IE9, so I cannot confirm.

As for image upload, I assume you'll make a set of requirements (like the multipart form data FORM tag, etc.) and share a PHP example to handle it.

[Nicolas Péré]

Hello chris,

Nice roadmap and thank you for making Cleditor :-)

As far as i am concerned, the best thing should be a better approach of the language (dev) plugins (bbcode for instance).

I still have problems with it, some "<span>" or "<div>" appears.

wouldn't it be great if only one file of the language plugin became priority against the main html parser ?

one bbcode <---> one html equivalent, and STRICTLY that i wrote in the file.

by doing this, add another language (my own one) should be easier... :-)

i love writing my text in databases with no html but bbcode (or like).

really love Cleditor, don't doubt of that ;-)

Best regards,

Nicolas

[Keith Mashinter]

Thanks for a great lean and mean component, unlike the grandiose verbosity of FCK and TinyMCE, which is by not standards Tiny, just smaller than FCK.

 

Below is something we use to strip out Microsoft pasted if endif garbage and also normalise the resulting tags to an xhtml / html5 compatible set: br|b|del|ins|i|li|ol|p|ul.  Using <b></b> is shorter than <strong></strong> to save in a database text field.  This is a lean code approach to removing the Microsoft garbage rather than what FCK or Tiny attempts.  Hopefully this helps in the spirit of open-source contributions.

 

 

(function($) {

$.cleditor.defaultOptions.docType = "<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>";
$.cleditor.defaultOptions.docCSSFile = AkmeWindowUtil.CONTEXT_PATH+"/embed/cleditor/jquery.cleditor.iframe.css";

$.cleditor.defaultOptions.updateTextArea = function(html) { //if (document.forms[0].debugArea) document.forms[0].debugArea.value = html;
// Normalize to xhtml/html5 common standards and only keep allowed tags.
var ary = html.split("<");
var end = -1;
for (var i=0; i<ary.length; i++) {
if (ary[i].lastIndexOf("!--[if ", 7) === 0) { // handle Microsoft <!--[if ... <![endif]-->
ary[i] = "";
var found = false;
for (i++; i<ary.length; i++) {
if (ary[i].lastIndexOf("![endif]-->", 11) === 0) {found = true;}
ary[i] = "";
if (found) break;
}
if (i>=ary.length) break;
}
end = ary[i].indexOf(">");
if (end == -1) continue;
ary[i] = ary[i].substring(0,end).toLowerCase()+ary[i].substring(end);
var search = ["strong>","em>","strike>","u>","br>"];
var replace = ["b>","i>","del>","ins>","br/>"];
for (var j=0; j<search.length; j++) {
var pos = ary[i].lastIndexOf(search[j], search[j].length+1);
if (pos == 0 || (pos == 1 && ary[i].charAt(0) == '/')) {
ary[i] = (pos == 1 ? "/" : "")+ replace[j] +ary[i].substring(search[j].length+pos);
}
}
var spellcheckerRE = /^\/?span[^\/>]*\/?>/m;
var cleanupRE = /^(\/?)(br|b|del|ins|i|li|ol|p|ul)[^a-zA-Z\/>]*[^\/>]*(\/?)>/m;
if (spellcheckerRE.test(ary[i])) {
ary[i] = ary[i].replace(spellcheckerRE, "");
} else if (cleanupRE.test(ary[i])) {
ary[i] = ary[i].replace(cleanupRE, "<$1$2$3>");
ary[i] = ary[i].replace(/^<p>/, "");
ary[i] = ary[i].replace(/^<\/?p\/?>/, "<br/>");
} else {
ary[i] = end+1 < ary[i].length ? ary[i].substring(end+1) : "";
}
ary[i] = ary[i].replace(/&nbsp;/gm, "");
ary[i] = ary[i].replace(/\n\n/gm, "\n");
}
html = ary.join("");
// Trim leading whitespace.
var trimRE = /^(\s+|&nbsp;|<br\/?>|<p>(&nbsp;)*<\/p>)+/m;
if (trimRE.test(html)) {
html = html.replace(trimRE, "");
}
// Test if there is any actual non-whitespace text content.
var body = document.getElementsByTagName("body")[0];
var div = document.createElement("div");
div.style.display = "none";
body.appendChild(div);
div.innerHTML = html;
var text = div.innerText || div.textContent;
body.removeChild(div);
var trimRE = /\S/m;
if (!trimRE.test(text)) html = "";
return html;
};
})(jQuery);

 

[Jeff]

Excellent app.  Thank you so much.  Have you added #2 yet?  I don't see it in the options.