Skip to content

Commit 95f14de

Browse files
odeimaizodeimaiz
committed
renamings
1 parent a01502b commit 95f14de

File tree

1 file changed

+76
-65
lines changed
  • services/static-webserver/client/source/class/osparc/form/tag

1 file changed

+76
-65
lines changed

‎services/static-webserver/client/source/class/osparc/form/tag/TagItem.js‎

Lines changed: 76 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -29,34 +29,40 @@ qx.Class.define("osparc.form.tag.TagItem", {
2929
id: {
3030
check: "Integer"
3131
},
32+
3233
name: {
3334
check: "String",
3435
event: "changeName",
3536
init: ""
3637
},
38+
3739
description: {
3840
check: "String",
3941
nullable: true,
4042
event: "changeDescription",
4143
init: ""
4244
},
45+
4346
color: {
4447
check: "Color",
4548
event: "changeColor",
4649
init: "#303030"
4750
},
51+
4852
accessRights: {
4953
check: "Object",
5054
nullable: false,
55+
event: "changeAccessRights",
5156
apply: "__renderLayout",
52-
event: "changeAccessRights"
5357
},
58+
5459
mode: {
5560
check: "String",
5661
init: "display",
5762
nullable: false,
5863
apply: "_applyMode"
5964
},
65+
6066
appearance: {
6167
init: "tagitem",
6268
refine: true
@@ -78,57 +84,7 @@ qx.Class.define("osparc.form.tag.TagItem", {
7884
__colorButton: null,
7985
__loadingIcon: null,
8086
__validationManager: null,
81-
/**
82-
* Renders this tag item from scratch.
83-
*/
84-
__renderLayout: function() {
85-
this._removeAll();
86-
if (this.getMode() === this.self().modes.EDIT) {
87-
this.__renderEditMode();
88-
} else if (this.getMode() === this.self().modes.DISPLAY) {
89-
this.__renderDisplayMode();
90-
}
91-
},
92-
__renderEditMode: function() {
93-
const nameContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox()).set({
94-
width: 90
95-
});
96-
nameContainer.add(new qx.ui.basic.Label(this.tr("Name")).set({
97-
buddy: this.getChildControl("nameinput")
98-
}));
99-
nameContainer.add(this.getChildControl("nameinput").set({
100-
value: this.getName()
101-
}));
102-
this._add(nameContainer);
103-
const descInputContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox());
104-
descInputContainer.add(new qx.ui.basic.Label(this.tr("Description")).set({
105-
buddy: this.getChildControl("descriptioninput")
106-
}));
107-
descInputContainer.add(this.getChildControl("descriptioninput").set({
108-
value: this.getDescription()
109-
}));
110-
this._add(descInputContainer, {
111-
flex: 1
112-
});
113-
this._add(this.__colorPicker());
114-
this._add(this.__tagItemEditButtons());
115-
},
116-
__renderDisplayMode: function() {
117-
const tagContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox()).set({
118-
width: 100
119-
});
120-
tagContainer.add(this.getChildControl("tag"));
121-
this._add(tagContainer);
122-
const descriptionContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox());
123-
descriptionContainer.add(this.getChildControl("description"), {
124-
width: "100%"
125-
});
126-
this._add(descriptionContainer, {
127-
flex: 1
128-
});
129-
this._add(this.__tagItemButtons());
130-
this.resetBackgroundColor();
131-
},
87+
13288
_createChildControlImpl: function(id) {
13389
let control;
13490
switch (id) {
@@ -151,7 +107,7 @@ qx.Class.define("osparc.form.tag.TagItem", {
151107
}
152108
control = this.__description;
153109
break;
154-
case "nameinput":
110+
case "name-input":
155111
// Tag name input in edit mode
156112
if (this.__nameInput === null) {
157113
this.__nameInput = new qx.ui.form.TextField().set({
@@ -162,7 +118,7 @@ qx.Class.define("osparc.form.tag.TagItem", {
162118
}
163119
control = this.__nameInput;
164120
break;
165-
case "descriptioninput":
121+
case "description-input":
166122
// Tag description input in edit mode
167123
if (this.__descriptionInput === null) {
168124
this.__descriptionInput = new qx.ui.form.TextArea().set({
@@ -172,35 +128,90 @@ qx.Class.define("osparc.form.tag.TagItem", {
172128
}
173129
control = this.__descriptionInput;
174130
break;
175-
case "colorinput":
131+
case "color-input":
176132
// Color input in edit mode
177133
if (this.__colorInput === null) {
178134
this.__colorInput = new qx.ui.form.TextField().set({
179135
value: this.getColor(),
180136
width: 60,
181137
required: true
182138
});
183-
this.__colorInput.bind("value", this.getChildControl("colorbutton"), "backgroundColor");
184-
this.__colorInput.bind("value", this.getChildControl("colorbutton"), "textColor", {
139+
this.__colorInput.bind("value", this.getChildControl("color-button"), "backgroundColor");
140+
this.__colorInput.bind("value", this.getChildControl("color-button"), "textColor", {
185141
converter: value => osparc.utils.Utils.getContrastedBinaryColor(value)
186142
});
187143
this.__validationManager.add(this.__colorInput, osparc.utils.Validators.hexColor);
188144
}
189145
control = this.__colorInput;
190146
break;
191-
case "colorbutton":
147+
case "color-button":
192148
// Random color generator button in edit mode
193149
if (this.__colorButton === null) {
194150
this.__colorButton = new qx.ui.form.Button(null, "@FontAwesome5Solid/sync-alt/12");
195151
this.__colorButton.addListener("execute", () => {
196-
this.getChildControl("colorinput").setValue(osparc.utils.Utils.getRandomColor());
152+
this.getChildControl("color-input").setValue(osparc.utils.Utils.getRandomColor());
197153
}, this);
198154
}
199155
control = this.__colorButton;
200156
break;
201157
}
202158
return control || this.base(arguments, id);
203159
},
160+
161+
/**
162+
* Renders this tag item from scratch.
163+
*/
164+
__renderLayout: function() {
165+
this._removeAll();
166+
if (this.getMode() === this.self().modes.EDIT) {
167+
this.__renderEditMode();
168+
} else if (this.getMode() === this.self().modes.DISPLAY) {
169+
this.__renderDisplayMode();
170+
}
171+
},
172+
173+
__renderEditMode: function() {
174+
const nameContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox()).set({
175+
width: 90
176+
});
177+
nameContainer.add(new qx.ui.basic.Label(this.tr("Name")).set({
178+
buddy: this.getChildControl("name-input")
179+
}));
180+
nameContainer.add(this.getChildControl("name-input").set({
181+
value: this.getName()
182+
}));
183+
this._add(nameContainer);
184+
const descInputContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox());
185+
descInputContainer.add(new qx.ui.basic.Label(this.tr("Description")).set({
186+
buddy: this.getChildControl("description-input")
187+
}));
188+
descInputContainer.add(this.getChildControl("description-input").set({
189+
value: this.getDescription()
190+
}));
191+
this._add(descInputContainer, {
192+
flex: 1
193+
});
194+
this._add(this.__colorPicker());
195+
this._add(this.__tagItemEditButtons());
196+
},
197+
198+
__renderDisplayMode: function() {
199+
const tagContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox()).set({
200+
width: 100
201+
});
202+
tagContainer.add(this.getChildControl("tag"));
203+
this._add(tagContainer);
204+
const descriptionContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox());
205+
descriptionContainer.add(this.getChildControl("description"), {
206+
width: "100%"
207+
});
208+
this._add(descriptionContainer, {
209+
flex: 1
210+
});
211+
this._add(this.__tagItemButtons());
212+
this.resetBackgroundColor();
213+
},
214+
204215
/**
205216
* Generates and returns the buttons for deleting and editing an existing label (display mode)
206217
*/
@@ -295,11 +306,11 @@ qx.Class.define("osparc.form.tag.TagItem", {
295306
__colorPicker: function() {
296307
const container = new qx.ui.container.Composite(new qx.ui.layout.VBox());
297308
container.add(new qx.ui.basic.Label(this.tr("Color")).set({
298-
buddy: this.getChildControl("colorinput")
309+
buddy: this.getChildControl("color-input")
299310
}));
300311
const innerContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox());
301-
const refreshButton = this.getChildControl("colorbutton");
302-
const colorInput = this.getChildControl("colorinput");
312+
const refreshButton = this.getChildControl("color-button");
313+
const colorInput = this.getChildControl("color-input");
303314
innerContainer.add(refreshButton);
304315
innerContainer.add(colorInput);
305316
container.add(innerContainer);
@@ -309,9 +320,9 @@ qx.Class.define("osparc.form.tag.TagItem", {
309320
* Creates an object containing the updated tag info
310321
*/
311322
__serializeData: function() {
312-
const name = this.getChildControl("nameinput").getValue();
313-
const description = this.getChildControl("descriptioninput").getValue();
314-
const color = this.getChildControl("colorinput").getValue();
323+
const name = this.getChildControl("name-input").getValue();
324+
const description = this.getChildControl("description-input").getValue();
325+
const color = this.getChildControl("color-input").getValue();
315326
return {
316327
name: name.trim(),
317328
description: description ? description.trim() : "",

0 commit comments

Comments
 (0)