Skip to content

Commit

Permalink
add icons in evaluators node selection
Browse files Browse the repository at this point in the history
  • Loading branch information
shuart committed Nov 19, 2023
1 parent 3f4e4c0 commit f94e508
Show file tree
Hide file tree
Showing 7 changed files with 160 additions and 79 deletions.
17 changes: 16 additions & 1 deletion src/js/modules/common_evaluators/evaluator_node_ui.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,22 @@ var setUp = function (event, data, instance) {
setTimeout(() => {
var element= instance.query('.graph')
element.innerHTML = ''//TODO GRAPH IS LOADED 2 TIMES. PREVENT THAT
data.graph = createStellae({container:element, fullSize:true,})
data.graph = createStellae({
container:element,
fullSize:true,
addListDefaultIconPath:"./img/icons/hexagon.svg",
addListCustomCategoriesIconPath:{
input:"./img/icons/arrow-right-circle.svg",
Input:"./img/icons/arrow-right-circle.svg",
Mathematics:"./img/icons/plus-square.svg",
data:"./img/icons/box.svg",
attribute:"./img/icons/book.svg",
relations:"./img/icons/share-2.svg",
Actions:"./img/icons/play-circle.svg",
output:"./img/icons/monitor.svg",
Helpers:"./img/icons/coffee.svg",
},
})

var repo = createEvaluatorsManagement()
var currentGraph = repo.getById(instance.props.get("evaluatorId"))
Expand Down
157 changes: 85 additions & 72 deletions src/js/modules/common_evaluators/evaluator_nodes_templates.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ evaluatorTemplates.sourceEntity = {
headerColor:nodeColors.inputData,
},
category:"input",
iconPath:"./img/icons/arrow-right-circle.svg",
props :[
{id:"output", expect:"data", isSquare:false, label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
{id:"outputReference", expect:"string", label:"Type Reference", type:"hidden", editable:false, socket:"output", value:""},
Expand Down Expand Up @@ -138,6 +139,7 @@ evaluatorTemplates.sourceEntity = {
evaluatorTemplates.sourceInstance = {
templateName : "source_instance",
name : "Source Instance",
iconPath:"./img/icons/arrow-right.svg",
style:{
headerColor:nodeColors.inputObject,
},
Expand Down Expand Up @@ -232,6 +234,7 @@ evaluatorTemplates.searchParam = {
evaluatorTemplates.debugAlert = {
templateName : "debug_alert",
name : "debug alert",
category:"Actions",
props :[
{id:"message", expect:"string", label:"Message", type:"text", editable:true, socket:"input", value:"This is a debug alert"},
],
Expand Down Expand Up @@ -330,6 +333,7 @@ evaluatorTemplates.extractProperty = {
evaluatorTemplates.extractProperty = {
templateName : "attribute",
name : "Attribute",
category:"data",
props :[
{id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"id", label:"prop id", type:"hidden", editable:false, socket:"output", value:false},
Expand Down Expand Up @@ -391,83 +395,83 @@ evaluatorTemplates.extractProperty = {
},
}

evaluatorTemplates.joinFields = {
templateName : "join_fields",
name : "join_fields",
props :[
{id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
{id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
{id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
],
methods:{
},
event:{
onEvaluate:(props) =>{
console.log(props.fields_to_join.get());
var newFields = []
var sourceField = props.field.get()
var fieldsToJoin = props.fields_to_join.get()
if (sourceField && fieldsToJoin) {
var fieldsQt = fieldsToJoin.length
console.log(sourceField);
// alert("f")
for (let i = 0; i < sourceField.length; i++) {
const sourceFieldElement = sourceField[i];
var newFieldElement = Object.assign({},sourceFieldElement)
for (let j = 0; j < fieldsToJoin.length; j++) {
const fieldToJoin = fieldsToJoin[j];
newFieldElement = Object.assign(sourceFieldElement,fieldToJoin[i])
}
newFields.push(newFieldElement)
}
props.output.set(newFields)
}
// evaluatorTemplates.joinFields = {
// templateName : "join_fields",
// name : "join_fields",
// props :[
// {id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// // {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
// {id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
// {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
// ],
// methods:{
// },
// event:{
// onEvaluate:(props) =>{
// console.log(props.fields_to_join.get());
// var newFields = []
// var sourceField = props.field.get()
// var fieldsToJoin = props.fields_to_join.get()
// if (sourceField && fieldsToJoin) {
// var fieldsQt = fieldsToJoin.length
// console.log(sourceField);
// // alert("f")
// for (let i = 0; i < sourceField.length; i++) {
// const sourceFieldElement = sourceField[i];
// var newFieldElement = Object.assign({},sourceFieldElement)
// for (let j = 0; j < fieldsToJoin.length; j++) {
// const fieldToJoin = fieldsToJoin[j];
// newFieldElement = Object.assign(sourceFieldElement,fieldToJoin[i])
// }
// newFields.push(newFieldElement)
// }
// props.output.set(newFields)
// }

},
onInit:(props) =>{
// },
// onInit:(props) =>{

},
},
}
evaluatorTemplates.joinAllProperties = {
templateName : "join_all_properties",
name : "join_all_properties",
props :[
{id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
{id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
// {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
],
methods:{
},
event:{
onEvaluate:(props) =>{
// },
// },
// }
// evaluatorTemplates.joinAllProperties = {
// templateName : "join_all_properties",
// name : "join_all_properties",
// props :[
// {id:"output", expect:"data", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// // {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
// {id:"field", expect:"data", label:"Source Field", type:"hidden", editable:true, socket:"input", value:false},
// // {id:"fields_to_join",expect:"array", isSquare:true, multiple:true, label:"Fields to join", type:"hidden", editable:true, socket:"input", value:false},
// ],
// methods:{
// },
// event:{
// onEvaluate:(props) =>{

var sourceField = props.field.get()
if (sourceField) {
for (let i = 0; i < sourceField.length; i++) {
const currentItem = sourceField[i];
var fieldsProperties = currentItem.properties
for (const propName in fieldsProperties) {
if (Object.hasOwnProperty.call(fieldsProperties, propName)) {
const prop = fieldsProperties[propName];
currentItem[propName] =prop
// var sourceField = props.field.get()
// if (sourceField) {
// for (let i = 0; i < sourceField.length; i++) {
// const currentItem = sourceField[i];
// var fieldsProperties = currentItem.properties
// for (const propName in fieldsProperties) {
// if (Object.hasOwnProperty.call(fieldsProperties, propName)) {
// const prop = fieldsProperties[propName];
// currentItem[propName] =prop

}
}
}
// }
// }
// }


props.output.set(sourceField)
}
// props.output.set(sourceField)
// }

},
onInit:(props) =>{
// },
// onInit:(props) =>{

},
},
}
// },
// },
// }



Expand All @@ -478,7 +482,7 @@ evaluatorTemplates.outputTable = {
headerColor:nodeColors.output,
},
category:"output",

iconPath:"./img/icons/table.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand All @@ -505,6 +509,7 @@ evaluatorTemplates.outputGraph = {
headerColor:nodeColors.output,
},
category:"output",
iconPath:"./img/icons/git-merge.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -534,7 +539,7 @@ evaluatorTemplates.outputFolders = {
headerColor:nodeColors.output,
},
category:"output",

iconPath:"./img/icons/table.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand All @@ -561,6 +566,7 @@ evaluatorTemplates.outputProperties = {
headerColor:nodeColors.output,
},
category:"output",
iconPath:"./img/icons/credit-card.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand All @@ -585,6 +591,7 @@ evaluatorTemplates.outputTextEditor = {
headerColor:nodeColors.output,
},
category:"output",
iconPath:"./img/icons/credit-card.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
{id:"attribute", label:"Attribute", type:"text", editable:true, socket:"input", value:false},
Expand All @@ -610,6 +617,7 @@ evaluatorTemplates.outputInstanceCard = {
headerColor:nodeColors.output,
},
category:"output",
iconPath:"./img/icons/credit-card.svg",
props :[
// {id:"output", label:"output", type:"hidden", editable:false, socket:"output", value:"output"},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -750,6 +758,7 @@ evaluatorTemplates.colCustomButton = {
evaluatorTemplates.actionAddInstance = {
templateName : "action_add_instance",
name : "action_add_instance",
category:"Actions",
props :[
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -783,6 +792,7 @@ evaluatorTemplates.actionAddInstance = {
evaluatorTemplates.actionRemoveInstance = {
templateName : "action_remove_instance",
name : "action_remove_instance",
category:"Actions",
props :[
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -822,6 +832,7 @@ evaluatorTemplates.actionRemoveInstance = {
evaluatorTemplates.previewInstance = {
templateName : "action_preview_instance",
name : "action_preview_instance",
category:"Actions",
props :[
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -868,7 +879,7 @@ evaluatorTemplates.previewInstance = {
evaluatorTemplates.setLocalParam = {
templateName : "action_set_local_param",
name : "Set local parameter",
category:"action",
category:"Actions",
props :[
{id:"output", expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
// {id:"method", label:"A", type:"text", editable:true, socket:"input", value:"0"},
Expand Down Expand Up @@ -903,6 +914,7 @@ evaluatorTemplates.setLocalParam = {
evaluatorTemplates.actionShowMessage = {
templateName : "action_show_message",
name : "action_show_message",
category:"Actions",
props :[
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
{id:"message",expect:"string", label:"Message", type:"text", editable:true, socket:"input", value:""},
Expand Down Expand Up @@ -1025,6 +1037,7 @@ evaluatorTemplates.findInstanceDirectRelation = {
evaluatorTemplates.actionEditRelation = {
templateName : "action_edit_relation",
name : "action_edit_relation",
category:"Actions",
props :[
{id:"output",expect:"function", label:"output", type:"hidden", editable:false, socket:"output", value:()=>alert("No Action")},
{id:"relationType",expect:"string", label:"Relation Type", type:"text", editable:true, socket:"input", value:""},
Expand Down
2 changes: 1 addition & 1 deletion src/js/modules/common_settings/model_settings.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ var getItemsList = function (data, instance){
listData.cols = [
// {title:"id", field:"uuid", },
{title:"Name", field:"name", cellClick:(e,cell)=>state_manager.goTo("/:/"+instance.props.modelElementType.get()+"/"+cell.getData().uuid) }, ///evaluators/:evaluatorId
{customButton: {value:"+", style:"smallCircle", onClick:function(e, cell){
{customButton: {value:"", iconPath:"copy.svg", style:"", onClick:function(e, cell){
var dataToCopy = projectManagement.getProjectStore(projectId,data.modelElementType).getById(cell.getRow().getData().uuid);
var newName = prompt("Set Name", dataToCopy.name+"_copy")
if (newName) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -90,14 +90,20 @@ var checkColsForCustomFormating = function(rows, cols){

var getCustomButtonFormatterForCol = function(rows, col){
var styleClass=""
var iconElement=""

if (col.customButton.style) {
styleClass = col.customButton.style

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

}

var printIcon = function(cell, formatterParams, onRendered){ //plain text value
return "<i class='fa fa-print "+styleClass+ " '>"+col.customButton.value+"</i>";
return "<i class='fa fa-print "+styleClass+ " '>"+ iconElement+ col.customButton.value+"</i>";
};
var formatterButton = {formatter:printIcon, width:40, hozAlign:"center", cellClick:col.customButton.onClick};
return formatterButton
Expand Down
5 changes: 5 additions & 0 deletions src/js/vendor/stellae/stellae.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,8 @@ function createStellae({
showToolbar =false,
highlightConnections= false,
addNodesFromCustomList= false,
addListDefaultIconPath=false,
addListCustomCategoriesIconPath=false,
allowCustomNameForNodes= false,
allowCustomNameForRelations = false,
} = {}) {
Expand Down Expand Up @@ -63,6 +65,7 @@ function createStellae({
if (headless) {
nodeManager = createNodeManager()
}else{

ui = createStellaeUi({
container:container,
canvasWidth:canvasWidth,
Expand All @@ -75,6 +78,8 @@ function createStellae({
showToolbar:showToolbar,
useConnectionHighlighter:highlightConnections,
useCustomNodeAddList:addNodesFromCustomList,
addListDefaultIconPath:addListDefaultIconPath,
addListCustomCategoriesIconPath:addListCustomCategoriesIconPath,
allowCustomNameForNodes:allowCustomNameForNodes,
allowCustomNameForRelations:allowCustomNameForRelations,
})
Expand Down
Loading

0 comments on commit f94e508

Please sign in to comment.