From 4ffe562dbaf4e100bd5873640fe23d8e643f083a Mon Sep 17 00:00:00 2001 From: Richard Hatuev Date: Tue, 15 Aug 2017 13:49:47 +0200 Subject: [PATCH 1/4] Fix error on visibility toggle --- client/PropertyInfoPlugin.js | 2 +- client/client-bundle.js | 84 ++++++++++++++++++------------------ 2 files changed, 43 insertions(+), 43 deletions(-) diff --git a/client/PropertyInfoPlugin.js b/client/PropertyInfoPlugin.js index 421005b..a14df2b 100644 --- a/client/PropertyInfoPlugin.js +++ b/client/PropertyInfoPlugin.js @@ -68,7 +68,7 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) var elements = elementRegistry.getAll(); for (var elementCount in elements) { var elementObject = elements[elementCount]; - if (elementObject.businessObject.$instanceOf('bpmn:FlowNode') || element.businessObject.$instanceOf('bpmn:Participant')) { + if (elementObject.businessObject.$instanceOf('bpmn:FlowNode') || elementObject.businessObject.$instanceOf('bpmn:Participant')) { addStyle(elementObject); } } diff --git a/client/client-bundle.js b/client/client-bundle.js index 4978a40..cda9631 100644 --- a/client/client-bundle.js +++ b/client/client-bundle.js @@ -69,7 +69,7 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) var elements = elementRegistry.getAll(); for (var elementCount in elements) { var elementObject = elements[elementCount]; - if (elementObject.businessObject.$instanceOf('bpmn:FlowNode') || element.businessObject.$instanceOf('bpmn:Participant')) { + if (elementObject.businessObject.$instanceOf('bpmn:FlowNode') || elementObject.businessObject.$instanceOf('bpmn:Participant')) { addStyle(elementObject); } } @@ -299,47 +299,47 @@ var plugin = require('./PropertyInfoPlugin'); registerBpmnJSPlugin(plugin); },{"./PropertyInfoPlugin":1,"camunda-modeler-plugin-helpers":3}],3:[function(require,module,exports){ -/** - * Validate and register a client plugin. - * - * @param {Object} plugin - * @param {String} type - */ -function registerClientPlugin(plugin, type) { - var plugins = window.plugins || []; - window.plugins = plugins; - - if (!plugin) { - throw new Error('plugin not specified'); - } - - if (!type) { - throw new Error('type not specified'); - } - - plugins.push({ - plugin: plugin, - type: type - }); -} - -/** - * Validate and register a bpmn-js plugin. - * - * Example use: - * - * var registerBpmnJSPlugin = require('./camundaModelerPluginHelpers').registerBpmnJSPlugin; - * var module = require('./index'); - * - * registerBpmnJSPlugin(module); - * - * @param {Object} plugin - */ -function registerBpmnJSPlugin(plugin) { - registerClientPlugin(plugin, 'bpmn.modeler.additionalModules'); -} - -module.exports.registerBpmnJSPlugin = registerBpmnJSPlugin; +/** + * Validate and register a client plugin. + * + * @param {Object} plugin + * @param {String} type + */ +function registerClientPlugin(plugin, type) { + var plugins = window.plugins || []; + window.plugins = plugins; + + if (!plugin) { + throw new Error('plugin not specified'); + } + + if (!type) { + throw new Error('type not specified'); + } + + plugins.push({ + plugin: plugin, + type: type + }); +} + +/** + * Validate and register a bpmn-js plugin. + * + * Example use: + * + * var registerBpmnJSPlugin = require('./camundaModelerPluginHelpers').registerBpmnJSPlugin; + * var module = require('./index'); + * + * registerBpmnJSPlugin(module); + * + * @param {Object} plugin + */ +function registerBpmnJSPlugin(plugin) { + registerClientPlugin(plugin, 'bpmn.modeler.additionalModules'); +} + +module.exports.registerBpmnJSPlugin = registerBpmnJSPlugin; },{}],4:[function(require,module,exports){ (function (global){ From 77433a14093861be4196ffa730c0402f53ec1e8c Mon Sep 17 00:00:00 2001 From: Richard Hatuev Date: Tue, 15 Aug 2017 17:15:55 +0200 Subject: [PATCH 2/4] Documentation icon and dialog box added. --- client/PropertyInfoPlugin.js | 7 +++++++ client/client-bundle.js | 7 +++++++ style/style.css | 40 +++++++++++++++++++++++++++++++++++- 3 files changed, 53 insertions(+), 1 deletion(-) diff --git a/client/PropertyInfoPlugin.js b/client/PropertyInfoPlugin.js index a14df2b..1386854 100644 --- a/client/PropertyInfoPlugin.js +++ b/client/PropertyInfoPlugin.js @@ -41,6 +41,13 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } _.defer(function () { addStyle(element); + overlays.add(element, 'badge', { + position: { + top: 4, + right: 4 + }, + html: '
' + }); }); } diff --git a/client/client-bundle.js b/client/client-bundle.js index cda9631..405846b 100644 --- a/client/client-bundle.js +++ b/client/client-bundle.js @@ -42,6 +42,13 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } _.defer(function () { addStyle(element); + overlays.add(element, 'badge', { + position: { + top: 4, + right: 4 + }, + html: '
' + }); }); } diff --git a/style/style.css b/style/style.css index 76e1074..85872c2 100644 --- a/style/style.css +++ b/style/style.css @@ -29,4 +29,42 @@ .badge-red:after { background: #D2335C; -} \ No newline at end of file +} + +.doc-val-true { + background-color: transparent; + width: 24px; + height: 24px; + border-radius: 0px 9px; + margin: -0.25em 0 0 -1.75em; + border-bottom: 12px solid transparent; + border-left: 12px solid transparent; + border-right: 12px solid #7de321; + border-top: 12px solid #7de321; +} + +.doc-val-true::after { + content: "D"; + color: #fff; + background: none; + display: block; + margin: -11px 0 0 1px; + font-size: 10px; + position: absolute; + } + +.doc-val-true:hover + .doc-val-hover { + display: block; +} + +.doc-val-hover { + display: none; + width: 200px; + height: 100px; + position: absolute; + margin: -11.5em 0 0 -13em; + border: 2px solid #7de321; + border-radius: 10px; + box-shadow: 0px 1px 5px 0px #000; + background-color: #fefefe; +} From 3befc468f2bc53746c6393843d024654d940e03b Mon Sep 17 00:00:00 2001 From: Richard Hatuev Date: Wed, 16 Aug 2017 10:13:25 +0200 Subject: [PATCH 3/4] CSS Background Fixing --- style/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style/style.css b/style/style.css index 85872c2..d4c3f71 100644 --- a/style/style.css +++ b/style/style.css @@ -66,5 +66,5 @@ border: 2px solid #7de321; border-radius: 10px; box-shadow: 0px 1px 5px 0px #000; - background-color: #fefefe; + background-color: #B8E986; } From 0a71a6c7a33aa6bed62e11e2d6c5b00d6a82f197 Mon Sep 17 00:00:00 2001 From: Richard Hatuev Date: Wed, 16 Aug 2017 11:42:01 +0200 Subject: [PATCH 4/4] CSS adjustments performed. Dialog box design and colors adapted. --- client/PropertyInfoPlugin.js | 43 +++++++++++++++++++++++++++++------- client/client-bundle.js | 43 +++++++++++++++++++++++++++++------- style/style.css | 12 +++++----- 3 files changed, 77 insertions(+), 21 deletions(-) diff --git a/client/PropertyInfoPlugin.js b/client/PropertyInfoPlugin.js index 1386854..ad1f5cb 100644 --- a/client/PropertyInfoPlugin.js +++ b/client/PropertyInfoPlugin.js @@ -41,13 +41,6 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } _.defer(function () { addStyle(element); - overlays.add(element, 'badge', { - position: { - top: 4, - right: 4 - }, - html: '
' - }); }); } @@ -90,10 +83,35 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } } + elementOverlays[element.id] = []; + + if( element.businessObject.documentation !== undefined && + element.businessObject.documentation.length > 0 && + element.businessObject.documentation[0].text.trim() !== ""){ + + var text = element.businessObject.documentation[0].text; + text = text.replace(/(?:\r\n|\r|\n)/g, '
'); + + + elementOverlays[element.id].push( + overlays.add(element, 'badge', { + position: { + top: 4, + right: 4 + }, + html: '
'+text+'
' + })); + } + if (element.businessObject.extensionElements === undefined && element.businessObject.$instanceOf('bpmn:FlowNode')) { return; } + //Do not process the label of an element + if (element.type === "label") { + return; + } + if (!overlaysVisible) { return; } @@ -278,7 +296,7 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } - elementOverlays[element.id] = badges; + pushArray(elementOverlays[element.id],badges); } function uniqBy(a, key) { @@ -289,6 +307,15 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) }) } + function pushArray(list, other) { + var len = other.length; + var start = list.length; + list.length = start + len; + for (var i = 0; i < len; i++ , start++) { + list[start] = other[i]; + } + } + } PropertyInfoPlugin.$inject = ['eventBus', 'overlays', 'elementRegistry', 'editorActions']; diff --git a/client/client-bundle.js b/client/client-bundle.js index 405846b..3d1f36c 100644 --- a/client/client-bundle.js +++ b/client/client-bundle.js @@ -42,13 +42,6 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } _.defer(function () { addStyle(element); - overlays.add(element, 'badge', { - position: { - top: 4, - right: 4 - }, - html: '
' - }); }); } @@ -91,10 +84,35 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } } + elementOverlays[element.id] = []; + + if( element.businessObject.documentation !== undefined && + element.businessObject.documentation.length > 0 && + element.businessObject.documentation[0].text.trim() !== ""){ + + var text = element.businessObject.documentation[0].text; + text = text.replace(/(?:\r\n|\r|\n)/g, '
'); + + + elementOverlays[element.id].push( + overlays.add(element, 'badge', { + position: { + top: 4, + right: 4 + }, + html: '
'+text+'
' + })); + } + if (element.businessObject.extensionElements === undefined && element.businessObject.$instanceOf('bpmn:FlowNode')) { return; } + //Do not process the label of an element + if (element.type === "label") { + return; + } + if (!overlaysVisible) { return; } @@ -279,7 +297,7 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) } - elementOverlays[element.id] = badges; + pushArray(elementOverlays[element.id],badges); } function uniqBy(a, key) { @@ -290,6 +308,15 @@ function PropertyInfoPlugin(eventBus, overlays, elementRegistry, editorActions) }) } + function pushArray(list, other) { + var len = other.length; + var start = list.length; + list.length = start + len; + for (var i = 0; i < len; i++ , start++) { + list[start] = other[i]; + } + } + } PropertyInfoPlugin.$inject = ['eventBus', 'overlays', 'elementRegistry', 'editorActions']; diff --git a/style/style.css b/style/style.css index d4c3f71..82fc21a 100644 --- a/style/style.css +++ b/style/style.css @@ -39,13 +39,13 @@ margin: -0.25em 0 0 -1.75em; border-bottom: 12px solid transparent; border-left: 12px solid transparent; - border-right: 12px solid #7de321; - border-top: 12px solid #7de321; + border-right: 12px solid #FFDE00; + border-top: 12px solid #FFDE00; } .doc-val-true::after { content: "D"; - color: #fff; + color: #000; background: none; display: block; margin: -11px 0 0 1px; @@ -63,8 +63,10 @@ height: 100px; position: absolute; margin: -11.5em 0 0 -13em; - border: 2px solid #7de321; + border: 2px solid #D38C17; border-radius: 10px; box-shadow: 0px 1px 5px 0px #000; - background-color: #B8E986; + background-color: #FFDE00; + padding: 5px 7px; + overflow: hidden; }