Skip to content

Commit f94e508

Browse files
shuartshuart
committed
add icons in evaluators node selection
1 parent 3f4e4c0 commit f94e508

File tree

7 files changed

+160
-79
lines changed

7 files changed

+160
-79
lines changed

‎src/js/modules/common_evaluators/evaluator_node_ui.js

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,22 @@ var setUp = function (event, data, instance) {
1313
setTimeout(() => {
1414
var element= instance.query('.graph')
1515
element.innerHTML = ''//TODO GRAPH IS LOADED 2 TIMES. PREVENT THAT
16-
data.graph = createStellae({container:element, fullSize:true,})
16+
data.graph = createStellae({
17+
container:element,
18+
fullSize:true,
19+
addListDefaultIconPath:"./img/icons/hexagon.svg",
20+
addListCustomCategoriesIconPath:{
21+
input:"./img/icons/arrow-right-circle.svg",
22+
Input:"./img/icons/arrow-right-circle.svg",
23+
Mathematics:"./img/icons/plus-square.svg",
24+
data:"./img/icons/box.svg",
25+
attribute:"./img/icons/book.svg",
26+
relations:"./img/icons/share-2.svg",
27+
Actions:"./img/icons/play-circle.svg",
28+
output:"./img/icons/monitor.svg",
29+
Helpers:"./img/icons/coffee.svg",
30+
},
31+
})
1732

1833
var repo = createEvaluatorsManagement()
1934
var currentGraph = repo.getById(instance.props.get("evaluatorId"))

‎src/js/modules/common_evaluators/evaluator_nodes_templates.js

Lines changed: 85 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,7 @@ evaluatorTemplates.sourceEntity = {
8585
headerColor:nodeColors.inputData,
8686
},
8787
category:"input",
88+
iconPath:"./img/icons/arrow-right-circle.svg",
8889
props :[
8990
{id:"output", expect:"data", isSquare:false, label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
9091
{id:"outputReference", expect:"string", label:"Type Reference", type:"hidden", editable:false, socket:"output", value:""},
@@ -138,6 +139,7 @@ evaluatorTemplates.sourceEntity = {
138139
evaluatorTemplates.sourceInstance = {
139140
templateName : "source_instance",
140141
name : "Source Instance",
142+
iconPath:"./img/icons/arrow-right.svg",
141143
style:{
142144
headerColor:nodeColors.inputObject,
143145
},
@@ -232,6 +234,7 @@ evaluatorTemplates.searchParam = {
232234
evaluatorTemplates.debugAlert = {
233235
templateName : "debug_alert",
234236
name : "debug alert",
237+
category:"Actions",
235238
props :[
236239
{id:"message", expect:"string", label:"Message", type:"text", editable:true, socket:"input", value:"This is a debug alert"},
237240
],
@@ -330,6 +333,7 @@ evaluatorTemplates.extractProperty = {
330333
evaluatorTemplates.extractProperty = {
331334
templateName : "attribute",
332335
name : "Attribute",
336+
category:"data",
333337
props :[
334338
{id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
335339
// {id:"id", label:"prop id", type:"hidden", editable:false, socket:"output", value:false},
@@ -391,83 +395,83 @@ evaluatorTemplates.extractProperty = {
391395
},
392396
}
393397

394-
evaluatorTemplates.joinFields = {
395-
templateName : "join_fields",
396-
name : "join_fields",
397-
props :[
398-
{id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
399-
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
400-
{id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
401-
{id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
402-
],
403-
methods:{
404-
},
405-
event:{
406-
onEvaluate:(props) =>{
407-
console.log(props.fields_to_join.get());
408-
var newFields = []
409-
var sourceField = props.field.get()
410-
var fieldsToJoin = props.fields_to_join.get()
411-
if (sourceField && fieldsToJoin) {
412-
var fieldsQt = fieldsToJoin.length
413-
console.log(sourceField);
414-
// alert("f")
415-
for (let i = 0; i < sourceField.length; i++) {
416-
const sourceFieldElement = sourceField[i];
417-
var newFieldElement = Object.assign({},sourceFieldElement)
418-
for (let j = 0; j < fieldsToJoin.length; j++) {
419-
const fieldToJoin = fieldsToJoin[j];
420-
newFieldElement = Object.assign(sourceFieldElement,fieldToJoin[i])
421-
}
422-
newFields.push(newFieldElement)
423-
}
424-
props.output.set(newFields)
425-
}
398+
// evaluatorTemplates.joinFields = {
399+
// templateName : "join_fields",
400+
// name : "join_fields",
401+
// props :[
402+
// {id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
403+
// // {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
404+
// {id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
405+
// {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
406+
// ],
407+
// methods:{
408+
// },
409+
// event:{
410+
// onEvaluate:(props) =>{
411+
// console.log(props.fields_to_join.get());
412+
// var newFields = []
413+
// var sourceField = props.field.get()
414+
// var fieldsToJoin = props.fields_to_join.get()
415+
// if (sourceField && fieldsToJoin) {
416+
// var fieldsQt = fieldsToJoin.length
417+
// console.log(sourceField);
418+
// // alert("f")
419+
// for (let i = 0; i < sourceField.length; i++) {
420+
// const sourceFieldElement = sourceField[i];
421+
// var newFieldElement = Object.assign({},sourceFieldElement)
422+
// for (let j = 0; j < fieldsToJoin.length; j++) {
423+
// const fieldToJoin = fieldsToJoin[j];
424+
// newFieldElement = Object.assign(sourceFieldElement,fieldToJoin[i])
425+
// }
426+
// newFields.push(newFieldElement)
427+
// }
428+
// props.output.set(newFields)
429+
// }
426430

427-
},
428-
onInit:(props) =>{
431+
// },
432+
// onInit:(props) =>{
429433

430-
},
431-
},
432-
}
433-
evaluatorTemplates.joinAllProperties = {
434-
templateName : "join_all_properties",
435-
name : "join_all_properties",
436-
props :[
437-
{id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
438-
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
439-
{id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
440-
// {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
441-
],
442-
methods:{
443-
},
444-
event:{
445-
onEvaluate:(props) =>{
434+
// },
435+
// },
436+
// }
437+
// evaluatorTemplates.joinAllProperties = {
438+
// templateName : "join_all_properties",
439+
// name : "join_all_properties",
440+
// props :[
441+
// {id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
442+
// // {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
443+
// {id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
444+
// // {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
445+
// ],
446+
// methods:{
447+
// },
448+
// event:{
449+
// onEvaluate:(props) =>{
446450

447-
var sourceField = props.field.get()
448-
if (sourceField) {
449-
for (let i = 0; i < sourceField.length; i++) {
450-
const currentItem = sourceField[i];
451-
var fieldsProperties = currentItem.properties
452-
for (const propName in fieldsProperties) {
453-
if (Object.hasOwnProperty.call(fieldsProperties, propName)) {
454-
const prop = fieldsProperties[propName];
455-
currentItem[propName] =prop
451+
// var sourceField = props.field.get()
452+
// if (sourceField) {
453+
// for (let i = 0; i < sourceField.length; i++) {
454+
// const currentItem = sourceField[i];
455+
// var fieldsProperties = currentItem.properties
456+
// for (const propName in fieldsProperties) {
457+
// if (Object.hasOwnProperty.call(fieldsProperties, propName)) {
458+
// const prop = fieldsProperties[propName];
459+
// currentItem[propName] =prop
456460

457-
}
458-
}
459-
}
461+
// }
462+
// }
463+
// }
460464

461465

462-
props.output.set(sourceField)
463-
}
466+
// props.output.set(sourceField)
467+
// }
464468

465-
},
466-
onInit:(props) =>{
469+
// },
470+
// onInit:(props) =>{
467471

468-
},
469-
},
470-
}
472+
// },
473+
// },
474+
// }
471475

472476

473477

@@ -478,7 +482,7 @@ evaluatorTemplates.outputTable = {
478482
headerColor:nodeColors.output,
479483
},
480484
category:"output",
481-
485+
iconPath:"./img/icons/table.svg",
482486
props :[
483487
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
484488
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -505,6 +509,7 @@ evaluatorTemplates.outputGraph = {
505509
headerColor:nodeColors.output,
506510
},
507511
category:"output",
512+
iconPath:"./img/icons/git-merge.svg",
508513
props :[
509514
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
510515
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -534,7 +539,7 @@ evaluatorTemplates.outputFolders = {
534539
headerColor:nodeColors.output,
535540
},
536541
category:"output",
537-
542+
iconPath:"./img/icons/table.svg",
538543
props :[
539544
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
540545
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -561,6 +566,7 @@ evaluatorTemplates.outputProperties = {
561566
headerColor:nodeColors.output,
562567
},
563568
category:"output",
569+
iconPath:"./img/icons/credit-card.svg",
564570
props :[
565571
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
566572
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -585,6 +591,7 @@ evaluatorTemplates.outputTextEditor = {
585591
headerColor:nodeColors.output,
586592
},
587593
category:"output",
594+
iconPath:"./img/icons/credit-card.svg",
588595
props :[
589596
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
590597
{id:"attribute", label:"Attribute", type:"text", editable:true, socket:"input", value:false},
@@ -610,6 +617,7 @@ evaluatorTemplates.outputInstanceCard = {
610617
headerColor:nodeColors.output,
611618
},
612619
category:"output",
620+
iconPath:"./img/icons/credit-card.svg",
613621
props :[
614622
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
615623
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -750,6 +758,7 @@ evaluatorTemplates.colCustomButton = {
750758
evaluatorTemplates.actionAddInstance = {
751759
templateName : "action_add_instance",
752760
name : "action_add_instance",
761+
category:"Actions",
753762
props :[
754763
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
755764
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -783,6 +792,7 @@ evaluatorTemplates.actionAddInstance = {
783792
evaluatorTemplates.actionRemoveInstance = {
784793
templateName : "action_remove_instance",
785794
name : "action_remove_instance",
795+
category:"Actions",
786796
props :[
787797
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
788798
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -822,6 +832,7 @@ evaluatorTemplates.actionRemoveInstance = {
822832
evaluatorTemplates.previewInstance = {
823833
templateName : "action_preview_instance",
824834
name : "action_preview_instance",
835+
category:"Actions",
825836
props :[
826837
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
827838
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -868,7 +879,7 @@ evaluatorTemplates.previewInstance = {
868879
evaluatorTemplates.setLocalParam = {
869880
templateName : "action_set_local_param",
870881
name : "Set local parameter",
871-
category:"action",
882+
category:"Actions",
872883
props :[
873884
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
874885
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
@@ -903,6 +914,7 @@ evaluatorTemplates.setLocalParam = {
903914
evaluatorTemplates.actionShowMessage = {
904915
templateName : "action_show_message",
905916
name : "action_show_message",
917+
category:"Actions",
906918
props :[
907919
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
908920
{id:"message",expect:"string", label:"Message", type:"text", editable:true, socket:"input", value:""},
@@ -1025,6 +1037,7 @@ evaluatorTemplates.findInstanceDirectRelation = {
10251037
evaluatorTemplates.actionEditRelation = {
10261038
templateName : "action_edit_relation",
10271039
name : "action_edit_relation",
1040+
category:"Actions",
10281041
props :[
10291042
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
10301043
{id:"relationType",expect:"string", label:"Relation Type", type:"text", editable:true, socket:"input", value:""},

‎src/js/modules/common_settings/model_settings.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ var getItemsList = function (data, instance){
6363
listData.cols = [
6464
// {title:"id", field:"uuid", },
6565
{title:"Name", field:"name", cellClick:(e,cell)=>state_manager.goTo("/:/"+instance.props.modelElementType.get()+"/"+cell.getData().uuid) }, ///evaluators/:evaluatorId
66-
{customButton: {value:"+", style:"smallCircle", onClick:function(e, cell){
66+
{customButton: {value:"", iconPath:"copy.svg", style:"", onClick:function(e, cell){
6767
var dataToCopy = projectManagement.getProjectStore(projectId,data.modelElementType).getById(cell.getRow().getData().uuid);
6868
var newName = prompt("Set Name", dataToCopy.name+"_copy")
6969
if (newName) {

‎src/js/modules/common_ui_components/table/table_custom_formaters.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,14 +90,20 @@ var checkColsForCustomFormating = function(rows, cols){
9090

9191
var getCustomButtonFormatterForCol = function(rows, col){
9292
var styleClass=""
93+
var iconElement=""
9394

9495
if (col.customButton.style) {
9596
styleClass = col.customButton.style
9697

98+
}
99+
if (col.customButton.iconPath) {
100+
// iconElement = `<img class="darkModeCompatibleIcons" style="height: 16px;position: relative;left: 2px; top: -1px;" src="./img/icons/${col.customButton.iconPath}" >`
101+
iconElement = `<img class="darkModeCompatibleIcons" style="width: 105%; height: auto;" src="./img/icons/${col.customButton.iconPath}" >`
102+
97103
}
98104

99105
var printIcon = function(cell, formatterParams, onRendered){ //plain text value
100-
return "<i class='fa fa-print "+styleClass+ " '>"+col.customButton.value+"</i>";
106+
return "<i class='fa fa-print "+styleClass+ " '>"+ iconElement+ col.customButton.value+"</i>";
101107
};
102108
var formatterButton = {formatter:printIcon, width:40, hozAlign:"center", cellClick:col.customButton.onClick};
103109
return formatterButton

‎src/js/vendor/stellae/stellae.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ function createStellae({
1818
showToolbar =false,
1919
highlightConnections= false,
2020
addNodesFromCustomList= false,
21+
addListDefaultIconPath=false,
22+
addListCustomCategoriesIconPath=false,
2123
allowCustomNameForNodes= false,
2224
allowCustomNameForRelations = false,
2325
} = {}) {
@@ -63,6 +65,7 @@ function createStellae({
6365
if (headless) {
6466
nodeManager = createNodeManager()
6567
}else{
68+
6669
ui = createStellaeUi({
6770
container:container,
6871
canvasWidth:canvasWidth,
@@ -75,6 +78,8 @@ function createStellae({
7578
showToolbar:showToolbar,
7679
useConnectionHighlighter:highlightConnections,
7780
useCustomNodeAddList:addNodesFromCustomList,
81+
addListDefaultIconPath:addListDefaultIconPath,
82+
addListCustomCategoriesIconPath:addListCustomCategoriesIconPath,
7883
allowCustomNameForNodes:allowCustomNameForNodes,
7984
allowCustomNameForRelations:allowCustomNameForRelations,
8085
})

0 commit comments

Comments
 (0)