Skip to content

Commit

Permalink
build: 1.0.1
Browse files Browse the repository at this point in the history
  • Loading branch information
@prathamVaidya
prathamVaidya committed Apr 7, 2024
1 parent ace7070 commit 961e180
Show file tree
Hide file tree
Showing 3 changed files with 58 additions and 47 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "supercode-tinymce-plugin",
"version": "1.0.0",
"version": "1.0.1",
"description": "Opensource and Powerful Source Code editor for TinyMCE. Also enables more than just HTML editing enabling Markdown Editing or any source code editing.",
"main": "index.js",
"scripts": {
Expand Down
41 changes: 27 additions & 14 deletions supercode/plugin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
return false;
}

let editorWidth = 0, originalHeader, isScreenSizeChanged = true, session;
let editorWidth = 0, originalHeader, isScreenSizeChanged = false, session;


let Config = {
Expand Down Expand Up @@ -119,7 +119,8 @@
throw new Error("Supercode Icon name is invalid");
}
}


// Builds ace editor only on the first run
const buildAceEditor = (view) => {
// Attach Ace Editor to shadow dom to prevent tinymce css affecting it
view.attachShadow({mode: 'open'})
Expand Down Expand Up @@ -160,11 +161,10 @@
// add a copy of original header to give original header look
const newHeader = originalHeader.cloneNode(true);
newHeader.style.position = 'relative';
// If menu-bar exists utilize the space to show Title "Source Code Editor"
const menubar = newHeader.querySelector('.tox-menubar');
if(menubar){
menubar.innerHTML = `
<b style='font-size: 14px; font-weight: bold; padding: 9px;'>Source Code Editor</b>
`
menubar.innerHTML = `<b style='font-size: 14px; font-weight: bold; padding: 9px;'>Source Code Editor</b>`
}

// hide all the buttons except supercode button, attach event listener
Expand Down Expand Up @@ -203,7 +203,7 @@
div.append(button);
newHeader.append(div);
}

view.innerHTML = ''; // delete any existing header
view.append(newHeader);
}

Expand Down Expand Up @@ -251,12 +251,19 @@
const CodeView = {
onShow: (api) => {
const codeView = api.getContainer();
codeView.style.padding = 0;
codeView.style.display = 'flex';
codeView.style.flexDirection = 'column';

// On tinymce size change => resize code view
if(isScreenSizeChanged){
setHeader(codeView.querySelector('.supercode-header'), originalHeader, onSaveHandler);
codeView.querySelector('.supercode-body ').style.width = editorWidth+'px';
}

if(isScreenSizeChanged || codeView.childElementCount === 0){
codeView.innerHTML = `<div class="supercode-header"></div><div class="supercode-body no-tox-style" id="no-tox-style"></div>`
// Only on First time plugin opened => mount view
if(codeView.childElementCount === 0){
codeView.style.padding = 0;
codeView.style.display = 'flex';
codeView.style.flexDirection = 'column';
codeView.innerHTML = `<div class="supercode-header"></div><div class="supercode-body"></div>`

// Ctrl + Space Toggle Shortcut, Escape to Exit Source Code Mode
if(Config.shortcut){
Expand All @@ -268,6 +275,7 @@
setMainView(codeView.querySelector('.supercode-body '), editorWidth);
}

// Logic to run every time view opened => update editor content
let content = getSourceCode(editor.getContent());
if(!session){
session = ace.createEditSession(content, `ace/mode/${Config.language}`);
Expand All @@ -287,8 +295,13 @@

const startPlugin = function() {
const container = editor.getContainer();
isScreenSizeChanged = editorWidth != container.clientWidth;

if(editorWidth){
isScreenSizeChanged = editorWidth != container.clientWidth;
}

editorWidth = container.clientWidth;

if(isScreenSizeChanged || !originalHeader){
originalHeader = container.querySelector('.tox-editor-header');
}
Expand All @@ -311,8 +324,8 @@
return {
getMetadata: function () {
return {
name: "Source Code Editor",
url: ""
name: "Supercode",
url: "https://github.com/prathamVaidya/supercode-tinymce-plugin"
};
}
}
Expand Down
62 changes: 30 additions & 32 deletions supercode/plugin.min.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
(function() {
let i;
const b = (n) => {
const l = {
const S = (n) => {
const c = {
"ace-default": {
url: "https://cdnjs.cloudflare.com/ajax/libs/ace/1.9.6/ace.js",
loaded: !1,
Expand All @@ -18,16 +18,16 @@
required: !1
}
};
n.autocomplete && (l["ace-autocomplete"].required = !0), Object.values(l).forEach((d) => {
if (d.loaded)
n.autocomplete && (c["ace-autocomplete"].required = !0), Object.values(c).forEach((l) => {
if (l.loaded)
return;
let c = document.createElement("script");
c.src = d.url, c.type = "text/javascript", document.body.appendChild(c);
let d = document.createElement("script");
d.src = l.url, d.type = "text/javascript", document.body.appendChild(d);
});
}, S = (n) => n.getParam("inline") !== !0, w = function(n) {
if (!S(n))
}, w = (n) => n.getParam("inline") !== !0, x = function(n) {
if (!w(n))
return console.error("Supercode Plugin is not supported in inline mode"), !1;
let l = 0, d, c = !0, u, t = {
let c = 0, l, d = !1, u, t = {
theme: "chrome",
fontSize: 14,
// in px
Expand All @@ -43,7 +43,7 @@
aceCss: null,
fontFamily: null
};
const x = (e) => {
const C = (e) => {
const o = e.getParam("supercode");
if (o && typeof o == "object") {
for (const r in o)
Expand Down Expand Up @@ -74,7 +74,7 @@
}
if (t.icon = e.ui.registry.getAll().icons[t.iconName], !t.icon)
throw new Error("Supercode Icon name is invalid");
}, C = (e) => {
}, E = (e) => {
if (e.attachShadow({ mode: "open" }), t.aceCss) {
const s = new CSSStyleSheet();
s.replaceSync(t.aceCss), e.shadowRoot.adoptedStyleSheets.push(s);
Expand All @@ -85,14 +85,12 @@
o.style.width = "100%", o.style.height = "100%", i = ace.edit(o), i.renderer.attachToShadowRoot();
const r = {};
t.autocomplete && (r.enableLiveAutocompletion = !0), t.fontFamily && (r.fontFamily = t.fontFamily), i.setOptions(r), i.setTheme(`ace/theme/${t.theme}`), i.setFontSize(t.fontSize), i.setShowPrintMargin(!1);
}, E = (e, o, r) => {
}, m = (e, o, r) => {
const s = o.cloneNode(!0);
s.style.position = "relative";
const y = s.querySelector(".tox-menubar");
y && (y.innerHTML = `
<b style='font-size: 14px; font-weight: bold; padding: 9px;'>Source Code Editor</b>
`);
let g = !0;
const g = s.querySelector(".tox-menubar");
g && (g.innerHTML = "<b style='font-size: 14px; font-weight: bold; padding: 9px;'>Source Code Editor</b>");
let b = !0;
if (s.querySelectorAll(".tox-tbtn, .tox-split-button").forEach((a) => {
if (a.getAttribute("data-mce-name") != "supercode") {
if (a.getAttribute("data-mce-name") === "overflow-button") {
Expand All @@ -101,51 +99,51 @@
}
a.classList.remove("tox-tbtn--enabled"), a.classList.add("tox-tbtn--disabled"), a.removeAttribute("data-mce-name");
} else
g = !1, a.setAttribute("data-mce-name", "supercode-toggle"), a.classList.add("tox-tbtn--enabled"), a.onclick = r;
}), g) {
b = !1, a.setAttribute("data-mce-name", "supercode-toggle"), a.classList.add("tox-tbtn--enabled"), a.onclick = r;
}), b) {
const a = document.createElement("div");
a.classList = "tox-toolbar__group", a.style.position = "absolute", a.style.right = 0, a.style.height = "100%";
const p = document.createElement("button");
p.classList = "tox-tbtn tox-tbtn--enabled", p.innerHTML = `<span class="tox-icon tox-tbtn__icon-wrap">${t.icon}</span>`, p.onclick = r, a.append(p), s.append(a);
}
e.append(s);
e.innerHTML = "", e.append(s);
}, v = (e, o) => {
e.style.width = o + "px", e.style.height = "100%", e.style.position = "relative", C(e);
e.style.width = o + "px", e.style.height = "100%", e.style.position = "relative", E(e);
};
x(n), b(t);
C(n), S(t);
const f = () => {
n.focus(), n.undoManager.transact(function() {
let e = i.getValue();
t.renderer && (e = t.renderer(e)), n.setContent(e);
}), n.selection.setCursorLocation(), n.nodeChanged(), n.execCommand("ToggleView", !1, "supercode");
}, m = (e) => {
}, h = (e) => {
(e.key === " " && e.ctrlKey || e.key === "Escape") && f();
}, L = (e) => t.parser ? t.parser(e) : html_beautify(e), j = {
onShow: (e) => {
const o = e.getContainer();
o.style.padding = 0, o.style.display = "flex", o.style.flexDirection = "column", (c || o.childElementCount === 0) && (o.innerHTML = '<div class="supercode-header"></div><div class="supercode-body no-tox-style" id="no-tox-style"></div>', t.shortcut && o.addEventListener("keydown", m), E(o.querySelector(".supercode-header"), d, f), v(o.querySelector(".supercode-body "), l));
d && (m(o.querySelector(".supercode-header"), l, f), o.querySelector(".supercode-body ").style.width = c + "px"), o.childElementCount === 0 && (o.style.padding = 0, o.style.display = "flex", o.style.flexDirection = "column", o.innerHTML = '<div class="supercode-header"></div><div class="supercode-body"></div>', t.shortcut && o.addEventListener("keydown", h), m(o.querySelector(".supercode-header"), l, f), v(o.querySelector(".supercode-body "), c));
let r = L(n.getContent());
u || (u = ace.createEditSession(r, `ace/mode/${t.language}`), u.setUseWrapMode(t.wrap), i.setSession(u)), u.setValue(r), i.gotoLine(1 / 0), i.focus();
},
onHide: () => {
t.shortcut && removeEventListener("keydown", m);
t.shortcut && removeEventListener("keydown", h);
}
}, h = function() {
}, y = function() {
const e = n.getContainer();
c = l != e.clientWidth, l = e.clientWidth, (c || !d) && (d = e.querySelector(".tox-editor-header")), n.execCommand("ToggleView", !1, "supercode");
c && (d = c != e.clientWidth), c = e.clientWidth, (d || !l) && (l = e.querySelector(".tox-editor-header")), n.execCommand("ToggleView", !1, "supercode");
};
return n.ui.registry.addView("supercode", j), n.ui.registry.addButton("supercode", {
icon: t.iconName,
tooltip: "Source Code Editor (Ctrl + space)",
onAction: h
}), t.shortcut && n.shortcuts.add("ctrl+32", "Toggles Source Code Editing Mode", h), {
onAction: y
}), t.shortcut && n.shortcuts.add("ctrl+32", "Toggles Source Code Editing Mode", y), {
getMetadata: function() {
return {
name: "Source Code Editor",
url: ""
name: "Supercode",
url: "https://github.com/prathamVaidya/supercode-tinymce-plugin"
};
}
};
};
tinymce.PluginManager.add("supercode", w);
tinymce.PluginManager.add("supercode", x);
})();

0 comments on commit 961e180

Please sign in to comment.