diff --git a/ccm-cms-tinymce/src/main/resources/scripts/ccm-cms/tinymce/plugins/insertimage.js b/ccm-cms-tinymce/src/main/resources/scripts/ccm-cms/tinymce/plugins/insertimage.js
index 721f61ea6..25cc16f83 100644
--- a/ccm-cms-tinymce/src/main/resources/scripts/ccm-cms/tinymce/plugins/insertimage.js
+++ b/ccm-cms-tinymce/src/main/resources/scripts/ccm-cms/tinymce/plugins/insertimage.js
@@ -30,18 +30,21 @@ function openDialog(editor) {
console.log("Opening dialog");
- const selectedImage = {
+ // const selectedImage = {
+ //
+ // selectedUuid: undefined,
+ //
+ // get imageUuid() {
+ // this.selectedUuid;
+ // },
+ // set imageUuid(value) {
+ // this.selectedUuid = value;
+ // console.log(`Set imageUuid to ${this.selectedUuid}`);
+ // editor.windowManager
+ // },
+ // };
- selectedUuid: undefined,
-
- get imageUuid() {
- this.selectedUuid;
- },
- set imageUuid(value) {
- this.selectedUuid = value;
- console.log(`Set imageUuid to ${this.imageUuid}`);
- },
- };
+ let imageUuid = undefined;
editor.windowManager.open({
body: [
@@ -51,22 +54,40 @@ function openDialog(editor) {
direction: "row",
items: [
{
- disabled: true,
- label: "Image",
- name: "imageUuid",
- type: "textbox",
- value: "foobar",
+ // disabled: true,
+ // label: "Image",
+ // name: "imageUuid",
+ // type: "textbox",
+ // value: "foobar",
+ border: "1 1 1 1",
+ minWidth: 150,
+ minHeight: 150,
+ name: "imageViewer",
+ type: "container",
},
{
name: "browse",
- onclick: function() {
- openBrowseDialog(editor, selectedImage);
+ onclick: (event) => {
+ openBrowseDialog(editor, (uuid) => {
+ console.log(`Selected image ${uuid}`);
+ // editor.windowManager.getWindows()[0].find("#imageUuid").value(uuid);
+ imageUuid = uuid;
+ const contextPrefix = editor.getParam("contextprefix");
+ const contentSection = editor.getParam("contentsection");
+ const imageViewer = editor
+ .windowManager
+ .getWindows()[0]
+ .find("#imageViewer")
+ .toArray()[0];
+ imageViewer
+ .innerHtml(``);
+ });
},
text: "Browse",
type: "button",
},
],
- label: "Image",
+ label: "Selected image",
layout: "flex",
type: "container",
},
@@ -104,7 +125,7 @@ function openDialog(editor) {
onPostRender: function() {
// console.log(`imageUuid = ${this.find("#imageUuid").value()}`);
const imageUuid = this.find("#imageUuid").value();
- console.log(`imageUuid = ${imageUuid}`);
+ console.log(`imageUuid = ${imageUuid}`);
// this.find("#imagePanel").innerHTML = `
${imageUuid}`;
this.find("#imagePanel").append([
{
@@ -120,7 +141,7 @@ function openDialog(editor) {
},
],
onsubmit: function(event) {
- console.log(selectedImage.imageUuid);
+ // console.log(selectedImage.imageUuid);
},
title: "Insert image",
});
@@ -128,7 +149,7 @@ function openDialog(editor) {
console.log("Dialog opened.");
}
-function openBrowseDialog(editor, selectedImage) {
+function openBrowseDialog(editor, selectImage) {
editor.windowManager.open({
body: [
@@ -157,7 +178,8 @@ function openBrowseDialog(editor, selectedImage) {
console.log("Click in Image Container...");
console.log(`...on image ${event.target.getAttribute("data-uuid")}`);
- selectedImage.imageUuid = event.target.getAttribute("data-uuid");
+ // selectedImage.imageUuid = event.target.getAttribute("data-uuid");
+ selectImage(event.target.getAttribute("data-uuid"));
editor.windowManager.close();
},
onPostRender: function() {
@@ -207,7 +229,7 @@ function openBrowseDialog(editor, selectedImage) {
`