MyBB Community Forums

Hello,
+ I have myBB installed
+ I am the only one who has access to the forums
+ I enabled HTML
+ JS and CSS are not allowed, I used MyCode
+ JS and CSS are working using MyCode (as far as I've tested)
+ I'm trying to include Ace Editor into posts/threads, which isn't working.
+ I'm trying the following specifically:

[style]  #editor {height:500px; width:500px; font-size:50px;} [/style]

<div id="editor">function foo(items) {
    var x = "All this is syntax highlighted";
    return x;
}</div>

[javascript="/src-min/ace.js"]
[javascript] var editor = ace.edit("editor"); editor.setTheme("ace/theme/monokai"); editor.session.setMode("ace/mode/javascript");[/javascript]

which results in

<div id="editor">function foo(items) {
var x = "All this is syntax highlighted";
return x;
}</div>

(no Ace editor/textbox... plain text)

-----------------------------------------

note: MyCodes:

1)
Name: CSS: block
Regular Expression: \[style(.*?)\](.*?)\[/style\]
Replacement: <style$1>$2</style>

2)
Name: JavaScript: Inline
Regular Expression: \[javascript\](.*?)\[/javascript\]
Replacement: <script type="text/javascript">$1</script>

3)
Name: Javascript: External
Regular Expression: \[javascript=(.*?)\]
Replacement: <script type="text/javascript" src="$1"></script>
The MyCodes are baffling, but I think they are working anyway... I don't know why the editor isn't working.

------------------------------------------

Please note I installed/configured the editor correctly (i.e., I can access it through regular HTML page)

Really, a div?

I don't know about Ace editor, but no editor works this way. You need a textbox to target.
And, trust me, editor is not a plug-and-play thing. You need to write a complete 'bridge' to make it compatible with MyBB.

Edit:
Sorry, I thought a general editor you are talking about.
Now as I know its a Code editor, I am curious where exactly you wanna use this ...

Hello,
I try this, in a regular HTML page, and it works

<html>
<head>
</head>
<body>

<div id="editor">function foo(items) {
    var x = "All this is syntax highlighted";
    return x;
}</div>

<script>
document.getElementById("editor").style.fontSize = "18px";
document.getElementById("editor").style.height = "300px";
document.getElementById("editor").style.width = "500px";
</script>

<script src="/src-min/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/monokai");
    editor.session.setMode("ace/mode/javascript");
</script>

</body>
</html>

However I try this in a MyBB post, and the width, height, font-size scripts work, as opposed to the Ace Editor script, it has no effect:

<div id="editor">function foo(items) {
    var x = "All this is syntax highlighted";
    return x;
}</div>

[javascript] document.getElementById("editor").style.fontSize = "30px"; [/javascript]
[javascript] document.getElementById("editor").style.height = "300px"; [/javascript]
[javascript] document.getElementById("editor").style.width = "300px"; [/javascript]

[javascript="/src-min/ace.js"]
[javascript] var editor = ace.edit("editor"); editor.setTheme("ace/theme/monokai"); editor.session.setMode("ace/mode/javascript");[/javascript]

EDIT: I found the problem.
entering external Javascript link needs to be: [javascript=/src-min/ace.js]
instead of [javascript="/src-min/ace.js"]
(which is according to the MyCode I provided)

wajed

effone

wajed