Replace deprecated <font> element with alternative

[cyphix333]

Within the editor interface/toolbar I have noticed it uses the deprecated <font> element; this really should be replaced with something such as <span style="font-size: 18px;">...</span> or similar if needing to utilise inline styling.

[iam1me]

You should be able to override the font-size BBCode with your own BBCode <=>HTML conversion functions.

Agreed that a tag with inline style is preferable, however, and that it would be nice if the default formatting BBCodes did this out of the box.

[brunoais]

SCE was designed to use the browser's text edition commands by default. That's why it shows the tag <font>. If the browsers change the tag that is used, SCE automatically changes too.

[iam1me]

Architecturally SCEditor was made to do a 1 to 1 conversion between BBCode and HTML, making the old font, b, i, etc. tags the natural choice. While it would be nice if were HTML5 compliant (font is not HTML5 compliant, and b,i, etc. are now supposed to be used for their semantic meaning rather than for their presentation) modifying SCEditor to support span tags with the potential for one to many conversions HTML => BBCode would likely require a good amount of re-architecting. So I can understand SC's decision to stick with the older HTML 4 style font tags.

Of course, if you have your own server-side processor in charge of rendering the BBCode back to HTML like I use in my project, then it's a moot point since you can control how these fields are rendered for the end-users when all is said and done.

[cyphix333]

Yeah, I don't have an issue with the output as I have a bbcode => html parser that spits out correct code, just found it weird the editor uses such old tags is all.

If the browsers change the tag that is used, SCE automatically changes too.

I'm not sure how that works? There are <font> tags hardcoded within the .js files.

[samclarke]

SCEditor can convert both font and span tags to BBCode. The reason the font tag is still used is that it's what most browsers insert when using the built in execCommands. Plus it's slightly less code to map from BBCode to HTML again.

It's possible to use span tags but ultimately the output is converted either to BBCode or XHTML so shouldn't really matter. If you want to though you can convert BBCode to span tags by modifying the BBCodes:

$.sceditor.plugins.bbcode.bbcode.set('size', {
  html: function(token, attrs, content) {
    var size = attrs.defaultattr;
    var numToPx = {
      1: 10,
      2: 12,
      3: 16,
      4: 18,
      5: 24,
      6: 32,
      7: 48
    };

    // This is normally done by the browser with font tag
    if (!/[0-9]*\.?[0-9]+(px|em|in|mm|cm)/.test(size)) {
      if (!(size in numToPx)) {
        return content;
      }

      size = numToPx[size] + 'px';
    }

    return '<span style="font-size: ' + size + '">' + content + '</span>';
  }
});

$.sceditor.plugins.bbcode.bbcode.set('font', {
  html: '<span style="font-family: {defaultattr}">{0}</span>'
});

$.sceditor.plugins.bbcode.bbcode.set('color', {
  html: '<span style="color: {defaultattr}">{0}</span>'
});

[cyphix333]

Thanks for the info @samclarke. Not a huge issue since it doesn't affect the code that is eventually generated for display on the page, just was a bit weird seeing the ol' <font> tag still in use - but if it's what the browsers are still using with their execCommand's then that's good enough for me.

[martec]

if use span tag will result in bug like this https://github.com/mybb/mybb/issues/2228

[samclarke]

Oh of course, the built in execCommand fontSize will wrap just wrap the node in a font tag. You would need to override the font command to not use execCommand. I've created an issue to add methods to make it easier to do.

@martec Looking at the bug, do you want the [font] BBCode tag to output pixels or x-large, large, etc? If so that can be done while still using the HTML font tag which will avoid the wrapping issue without needing the new API.

[martec]

@samclarke

bug i already fixed here https://github.com/mybb/mybb/pull/2229/files

problem that mybb team want add too font size with number too https://github.com/mybb/mybb/issues/2217

so for now only solution for this is wait 2.0 https://github.com/samclarke/SCEditor/issues/538 that already proposed by you.

anyway thanks to dispose to create solution for this.