-
Notifications
You must be signed in to change notification settings - Fork 27
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
✨ Expose message templates to POs (#4943)
- Loading branch information
Showing
11 changed files
with
285 additions
and
11 deletions.
There are no files selected for viewing
151 changes: 151 additions & 0 deletions
151
services/static-webserver/client/source/class/osparc/editor/HtmlEditor.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,151 @@ | ||
| /* ************************************************************************ | ||
| osparc - the simcore frontend | ||
| https://osparc.io | ||
| Copyright: | ||
| 2023 IT'IS Foundation, https://itis.swiss | ||
| License: | ||
| MIT: https://opensource.org/licenses/MIT | ||
| Authors: | ||
| * Odei Maiz (odeimaiz) | ||
| ************************************************************************ */ | ||
|
|
||
| qx.Class.define("osparc.editor.HtmlEditor", { | ||
| extend: qx.ui.core.Widget, | ||
|
|
||
| /** | ||
| * @param initText {String} Initialization text | ||
| */ | ||
| construct: function(initText = "") { | ||
| this.base(arguments); | ||
|
|
||
| this._setLayout(new qx.ui.layout.VBox(2)); | ||
|
|
||
| this.getChildControl("text-area"); | ||
| this.getChildControl("preview"); | ||
| if (initText) { | ||
| this.setText(initText); | ||
| } | ||
|
|
||
| this.__addButtons(); | ||
| }, | ||
|
|
||
| events: { | ||
| "textChanged": "qx.event.type.Data", | ||
| "cancel": "qx.event.type.Event" | ||
| }, | ||
|
|
||
| properties: { | ||
| text: { | ||
| check: "String", | ||
| event: "changeText", | ||
| init: "", | ||
| nullable: true | ||
| } | ||
| }, | ||
|
|
||
| members: { | ||
| _createChildControlImpl: function(id) { | ||
| let control; | ||
| switch (id) { | ||
| case "tabs": | ||
| control = new qx.ui.tabview.TabView().set({ | ||
| contentPadding: 0, | ||
| barPosition: "top" | ||
| }); | ||
| this._add(control, { | ||
| flex: 1 | ||
| }); | ||
| break; | ||
| case "text-area": { | ||
| control = new qx.ui.form.TextArea().set({ | ||
| allowGrowX: true | ||
| }); | ||
| control.addListener("appear", () => { | ||
| if (control.getValue()) { | ||
| control.setTextSelection(0, control.getValue().length); | ||
| } | ||
| }, this); | ||
| this.bind("text", control, "value"); | ||
| const tabs = this.getChildControl("tabs"); | ||
| const writePage = new qx.ui.tabview.Page(this.tr("Write")).set({ | ||
| layout: new qx.ui.layout.VBox(5) | ||
| }); | ||
| writePage.getChildControl("button").getChildControl("label").set({ | ||
| font: "text-13" | ||
| }); | ||
| writePage.add(control, { | ||
| flex: 1 | ||
| }); | ||
| const subtitle = this.getChildControl("subtitle").set({ | ||
| value: this.tr("Supports HTML") | ||
| }); | ||
| writePage.add(subtitle); | ||
| tabs.add(writePage); | ||
| break; | ||
| } | ||
| case "preview": { | ||
| control = new qx.ui.embed.Html(); | ||
| const textArea = this.getChildControl("text-area"); | ||
| textArea.bind("value", control, "html"); | ||
| const tabs = this.getChildControl("tabs"); | ||
| const previewPage = new qx.ui.tabview.Page(this.tr("Preview")).set({ | ||
| layout: new qx.ui.layout.VBox(5) | ||
| }); | ||
| previewPage.getChildControl("button").getChildControl("label").set({ | ||
| font: "text-13" | ||
| }); | ||
| const scrollContainer = new qx.ui.container.Scroll(); | ||
| scrollContainer.add(control); | ||
| previewPage.add(scrollContainer, { | ||
| flex: 1 | ||
| }); | ||
| tabs.add(previewPage); | ||
| break; | ||
| } | ||
| case "subtitle": | ||
| control = new qx.ui.basic.Label().set({ | ||
| font: "text-12" | ||
| }); | ||
| this._add(control); | ||
| break; | ||
| case "buttons": | ||
| control = new qx.ui.container.Composite(new qx.ui.layout.HBox(5).set({ | ||
| alignX: "right" | ||
| })); | ||
| this._add(control); | ||
| break; | ||
| case "cancel-button": { | ||
| const buttons = this.getChildControl("buttons"); | ||
| control = new qx.ui.form.Button(this.tr("Cancel")); | ||
| control.addListener("execute", () => { | ||
| this.fireDataEvent("cancel"); | ||
| }, this); | ||
| buttons.add(control); | ||
| break; | ||
| } | ||
| case "accept-button": { | ||
| const buttons = this.getChildControl("buttons"); | ||
| control = new qx.ui.form.Button(this.tr("Save")); | ||
| control.addListener("execute", () => { | ||
| const newText = this.getChildControl("text-area").getValue(); | ||
| this.fireDataEvent("textChanged", newText); | ||
| }, this); | ||
| buttons.add(control); | ||
| break; | ||
| } | ||
| } | ||
| return control || this.base(arguments, id); | ||
| }, | ||
|
|
||
| __addButtons: function() { | ||
| this.getChildControl("cancel-button"); | ||
| this.getChildControl("accept-button"); | ||
| } | ||
| } | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
107 changes: 107 additions & 0 deletions
107
services/static-webserver/client/source/class/osparc/po/MessageTemplates.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,107 @@ | ||
| /* ************************************************************************ | ||
| osparc - the simcore frontend | ||
| https://osparc.io | ||
| Copyright: | ||
| 2023 IT'IS Foundation, https://itis.swiss | ||
| License: | ||
| MIT: https://opensource.org/licenses/MIT | ||
| Authors: | ||
| * Odei Maiz (odeimaiz) | ||
| ************************************************************************ */ | ||
|
|
||
| qx.Class.define("osparc.po.MessageTemplates", { | ||
| extend: qx.ui.core.Widget, | ||
|
|
||
| construct: function() { | ||
| this.base(arguments); | ||
|
|
||
| this._setLayout(new qx.ui.layout.VBox(10)); | ||
|
|
||
| this.__fetchInfo(); | ||
| }, | ||
|
|
||
| members: { | ||
| __messageTemplates: null, | ||
|
|
||
| __fetchInfo: function() { | ||
| const params = { | ||
| url: { | ||
| productName: osparc.product.Utils.getProductName() | ||
| } | ||
| }; | ||
| osparc.data.Resources.fetch("productMetadata", "get", params) | ||
| .then(respData => { | ||
| this.__messageTemplates = respData["templates"]; | ||
| this.__buildLayout(); | ||
| }); | ||
| }, | ||
|
|
||
| __buildLayout: function() { | ||
| this._removeAll(); | ||
|
|
||
| const templatesSB = new qx.ui.form.SelectBox().set({ | ||
| allowGrowX: false | ||
| }); | ||
| this._add(templatesSB); | ||
|
|
||
| const htmlViewer = this.__htmlViewer = new osparc.editor.HtmlEditor().set({ | ||
| minHeight: 400 | ||
| }); | ||
| htmlViewer.getChildControl("cancel-button").exclude(); | ||
| const container = new qx.ui.container.Scroll(); | ||
| container.add(htmlViewer, { | ||
| flex: 1 | ||
| }); | ||
| this._add(container, { | ||
| flex: 1 | ||
| }); | ||
|
|
||
| templatesSB.addListener("changeSelection", e => { | ||
| const templateId = e.getData()[0].getModel(); | ||
| this.__populateMessage(templateId); | ||
| }, this); | ||
| this.__messageTemplates.forEach(template => { | ||
| const lItem = new qx.ui.form.ListItem(template.id, null, template.id); | ||
| templatesSB.add(lItem); | ||
| }); | ||
| htmlViewer.addListener("textChanged", e => { | ||
| const newTemplate = e.getData(); | ||
| const templateId = templatesSB.getSelection()[0].getModel(); | ||
| this.__saveTemplate(templateId, newTemplate); | ||
| }); | ||
| }, | ||
|
|
||
| __populateMessage: function(templateId) { | ||
| const found = this.__messageTemplates.find(template => template.id === templateId); | ||
| if (found) { | ||
| this.__htmlViewer.setText(found.content); | ||
| } | ||
| }, | ||
|
|
||
| __saveTemplate: function(templateId, newTemplate) { | ||
| const productName = osparc.product.Utils.getProductName(); | ||
| const params = { | ||
| url: { | ||
| productName, | ||
| templateId | ||
| }, | ||
| data: { | ||
| content: newTemplate | ||
| } | ||
| }; | ||
| osparc.data.Resources.fetch("productMetadata", "updateEmailTemplate", params) | ||
| .then(() => osparc.FlashMessenger.logAs(this.tr("Template updated"), "INFO")) | ||
| .catch(err => { | ||
| console.error(err); | ||
| osparc.FlashMessenger.logAs(err.message, "ERROR"); | ||
| }) | ||
| .finally(() => this.__fetchInfo()); | ||
| } | ||
| } | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters