Ticket #7044 (closed New Feature: fixed)

Opened 3 years ago

Last modified 3 years ago

Create a BBCode sample

Reported by: wwalc Owned by: garry.yao
Priority: Normal Milestone: CKEditor 3.6
Component: Core : Parser Version: 3.0
Keywords: Cc:

Description

It would be nice to have a sample BBCode plugin, just to show that CKEditor is capable to produce other markup than HTML.

As a sample set of bbcodes to support we could take the following list from phpBB forum: BBCode guide.

Note that the color tag may require #1653 to be fixed.

Things we could show on the sample page:

  1. Auto fixing broken tags (e.g. [b][i]boldanditalic[/b])
  2. Transparent bbcode parsing (requires no intermediate HTML)
  3. Configurable output formating
  4. Toogle like in the Ajax sample, for the one that would not like to have CKEditor enabled by default (starting with plain textarea element with some initial bbcodes looks like a way to go)

Attachments

7044.patch (3.5 KB) - added by wwalc 3 years ago.

Change History

comment:1 Changed 3 years ago by garry.yao

  • Owner set to garry.yao
  • Status changed from new to review

Feature branch created with [6504].

comment:2 follow-up: ↓ 4 Changed 3 years ago by wwalc

Looks nice! I have noticed one problem, see below:

1) Load the following:

[list=1]
[*]werwer
[*]asdf [img]http://localhost/bbcode/_source/plugins/smiley/images/sad_smile.gif[/img]
[*]rwerwer
[/list]

switch between source and wysiwyg mode, the list is now broken.

2) Maybe it would be better to disable all fields/tabs in Link and Image dialogs that are not supported (like the Advanced tab etc.) in bbcode.html sample?

3) How about leaving just a couple of smileys and translating them back to their ASCII equivalent in source mode (e.g. regular_smile.gif = :)), to show that this is doable as well?

comment:3 Changed 3 years ago by wwalc

  • Status changed from review to review_failed

(see my previous comment)

comment:4 in reply to: ↑ 2 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

1) Load the following:

switch between source and wysiwyg mode, the list is now broken. A bug exists when handling image element, fixed with [6531].

2) Maybe it would be better to disable all fields/tabs in Link and Image dialogs that are not supported (like the Advanced tab etc.) in bbcode.html sample?

I agree that we should eventually tackle that in the sample page, just for better demonstration.

3) How about leaving just a couple of smileys and translating them back to their ASCII equivalent in source mode (e.g. regular_smile.gif = :)), to show that this is doable as well?

How would this contribute to promoting this feature? (not sure smiley are part of bbcode world) At least this will requires just very few efforts from the end developers.

Changed 3 years ago by wwalc

comment:5 Changed 3 years ago by wwalc

  • Status changed from review to review_failed

Ad 3) most of the time smileys are inserted into posts using plain text and later, on the server side, changed into appropiate images. That's why I thought about converting CKEditor smileys into their ascii equivalents. It is also the way how smileys work on or forum, just to mention some of them:

 :D  :)  ;)  :(  :o  :shock:  :?  8-)  :lol:  :x  :P  :oops:  :cry: 

Anyway, it should not be a blocker for this ticket.

Ad 2) How about altering dialogs inside of a plugin? The source code of a sample should be as clean as possible. Besides if one would like to use this plugin, he'd definitely disable unsupported fields anyway.

The attached patch is just a dirt sample of proposed changes. The following issues are not solved there:

4) Reset Size / Lock Ratio should be removed in the Image dialog.

5) It would be nice to support all colors in the "Text Color" button. Note that there is still a link to "More colors" available, so instead of providing values for colorButton_colors, I'd simply use the same function as we have in the HTML4 sample to use the hex value in all browsers in the [color] tag.

comment:6 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

Ok, those changes are committed for review with [6694], though personally I don't like text emoticon, at least you'll not find it as a standard definition for BBCode. At the moment I've left out those smileys that are causing troubles with HTML syntax or missing a emoticon.

comment:7 Changed 3 years ago by Saare

  • Status changed from review to review_failed
  • When dealing with emoticons, elements path should indicate that instead of "img".
  • When dealing with [email] tags, elements path should indicate that instead of "link".
  • [IE] When one hits OK in the image dialog, JS error is triggered (possibly the outdated branch, but for reference).
  • As for preview.. it does the exact same action source mode does. Not sure if we should go with that. For me we can just remove this button, because parsing is to be done on server side.

comment:8 Changed 3 years ago by wwalc

As I wrote earlier, if converting smileys is causing too much troubles, we can ingore this specific feature for now.

While testing smileys I saw that content is duplicated when switching to source mode and back, try the following:

one :) two :) three

You can switch to wysiwyg and back approximately 7 times before you reach millions of smileys and the browser will hang.

@Saar regarding Preview button, good point. I initially thought that it is the right approach to display BBCodes in the Preview window, after all we want to show users that CKEditor is capable of producing BBCodes. But this can be checked with the Source button and the purpose of the preview window is a bit different, so I'm ok with removing this button.

comment:9 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

Update branch with above mentioned fixed.

comment:10 Changed 3 years ago by wwalc

I'm leaving the review to Saare, but for me it looks pretty good. Nice work!

comment:11 Changed 3 years ago by Saare

  • Status changed from review to review_failed
  • Type a line of text and click on the quote button.
  • Switch to source and back to wysiwyg.
  • Click inside the line you've written and click on the quote button.

Expected: blockquote is removed. Actual: nothing happens.

In the special characetrs dialog ther're some characters (like &) that are inserted as entites into the contents. That leads to wrong result (& is displayed, and when you switch to source and back to wysiwyg it shows &).

comment:12 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

Above issues fixed on branch.

comment:13 Changed 3 years ago by Saare

  • Status changed from review to review_failed

The editor does not load at all in IE now. Looks great besides.

comment:14 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

Oops, it doesn't turn out on my last try, but it's caused by an empty regexp failure on IE, addressed in branch.

comment:15 Changed 3 years ago by Saare

  • Status changed from review to review_failed

Appearently there are a few more:

  • In source mode put the following and switch to wysiwyg. See that the list becomes [list=a].
    [list=square]
    [*]kjhjkhjkhjkh
    [/list]
    
  • Empty the editor and click on the quote button. Type a line and press ENTER. Hit the quote key.

Result:

[quote]text
[/quote]

Expected (last line break should be ignored):

[quote]text[/quote]

comment:16 follow-up: ↓ 17 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

[list=square]...

Invalid, as we're implementing in this plugin just the phpBB variant of BBCode format, we need to understand BBCode is non-standarded so the plugin will need to be forked by other parties for their use, what is missing here might be a declaration on the sample page.

Empty the editor and click on the quote button. Type a line and press ENTER. Hit the quote key.

Not sure, The plugin utilize enter mode br and we current hold this behavior this mode in the editor. Even it make sense to fix, it should be filed as a trunk ticket.

comment:17 in reply to: ↑ 16 Changed 3 years ago by Saare

  • Status changed from review to review_failed

Replying to garry.yao:

Invalid, as we're implementing in this plugin just the phpBB variant of BBCode format, we need to understand BBCode is non-standarded so the plugin will need to be forked by other parties for their use, what is missing here might be a declaration on the sample page.

Then the bulleted list style dialog must be disabled.

Not sure, The plugin utilize enter mode br and we current hold this behavior this mode in the editor. Even it make sense to fix, it should be filed as a trunk ticket.

True, filed #7698.

comment:18 Changed 3 years ago by garry.yao

Then the bulleted list style dialog must be disabled.

Perhaps the best option for us here is to remove those plugins, updated with [6763].

comment:19 Changed 3 years ago by garry.yao

  • Status changed from review_failed to review

comment:20 Changed 3 years ago by Saare

  • Status changed from review to review_passed

I've committed [6782] to remove dead code chunk.
R+, congratulations.

comment:21 Changed 3 years ago by garry.yao

  • Status changed from review_passed to closed
  • Resolution set to fixed

Feature landed with [6787].

Note: See TracTickets for help on using tickets.
© 2003 – 2012 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy