Copy link to clipboard
Copied
Hi,
I have a problem with a script that I am doing and I hope you can help me.
The initial idea was to use a combination of DoubleClick + Alt when clicking on a listbox but with onClick the problem happens the same and i make a simple script to recreate the problem.
What i want is to be able to reduce the interface layout to a single element by button, and when I click again it returns to the previous configuration, as many times as necessary. But the problem is that I only get it to work twice, and then everything inside the function stops working.
function buildUI() {
var myScript = new Window("dialog", "test", undefined, {resizable: false});
var resMain = "group{ orientation:'column', \
main_panel: Group { type: 'group', orientation: 'column', alignChildren:['center','center'], margins: [0,0,0,0], borderless: 1, \
gr1: Group{ orientation: 'row', justify: 'center', spacing: 10, \
but_1: Button { preferredSize: [200,30], helpTip: 'new' },\
},\
gr2: Group { orientation: 'column', spacing:10,\
bMain: Button { preferredSize: [200,200] },\
grp_but: Group { orientation: 'row', spacing: 10,\
but_2: Button { text: '', preferredSize: [200,30]},\
},\
},\
},\
}";
myScript.grp = myScript.add(resMain);
var butOne = myScript.grp.main_panel.gr1.but_1;
var butTwo = myScript.grp.main_panel.gr2.grp_but.but_2;
var butMain = myScript.grp.main_panel.gr2.bMain;
butOne.text = butTwo.text = "HIDE";
butMain.text = "RESIZE";
butMain.onClick = function () {
if(bool==true) {
myScript.remove(myScript.children[0]);
myScript.add(resMain);
} else {
myScript.grp.main_panel.remove(myScript.grp.main_panel.gr1);
myScript.grp.main_panel.gr2.remove(myScript.grp.main_panel.gr2.grp_but);
}
myScript.layout.layout(true);
if(bool==true)bool=false else bool=true
}
butOne.onClick = butTwo.onClick = function () {
alert("NOTHING");
}
return myScript;
}
var bool = false;
var myScript = buildUI();
if((myScript != null) && (myScript instanceof Window)){
myScript.center();
myScript.show();
}
I solve this and because i get a lot of help in forums and sometimes one simple thing help other i put here the snippet, thanks both for the help! Hope all goes well!!
var myScript = new Window("dialog", "test", undefined, {
resizable: false
})
var resMain = "group{ orientation:'column', \
main_panel: Group { type: 'group', orientation: 'column', alignChildren:['center','center'], margins: [0,0,0,0], borderless: 1, \
gr1: Group{ orientation: 'row', justify: 'center', spacing: 10, \
...
Copy link to clipboard
Copied
I tried to change .onClick to myScript.onMove and works perfect, its something about calling the button after rebuild the ui but i cant solve whats the key there.
Copy link to clipboard
Copied
I wrote something, but it was not correct and now I can't delete my post.
*Martin
Copy link to clipboard
Copied
Long story short: when you rebuild the UI on `bunMain.onClick()` event, the reference to `butOne`, `butTwo` and `butMain` are gone. That's why, when you click on those buttons nothing happens since no action is being assigned to them after panel recreation.
Copy link to clipboard
Copied
Thanks Tomas,
i realized that after public the post, but if i try to assign again the value of the variable bMain after rebuild de UI looks like the path of it has changed and get error.
butMain.onClick = function () {
if(bool==true) {
myScript.remove(myScript.children[0]);
myScript.grp = myScript.add(resMain);
butOne = myScript.grp.main_panel.gr1.but_1;
butTwo = myScript.grp.main_panel.gr2.grp_but.but_2;
} else {
myScript.grp.main_panel.remove(myScript.grp.main_panel.gr1);
myScript.grp.main_panel.gr2.remove(myScript.grp.main_panel.gr2.grp_but);
}
myScript.layout.layout(true);
butMain = myScript.grp.main_panel.gr2.bMain;
if(bool==true)bool=false else bool=true
}
Im stuck in this and dont know how to solve, is there a better way to clean and rebuild a window? How can i assign again the variable with correct path? What changed? I dont know..
Copy link to clipboard
Copied
I think the standard workflow for such application is to create 2 layouts and stack them over each other.
With the button press, you hide/display the layouts as you need to.
Some snippets:
container = myPanel.add('group');
container.orientation = 'stack';
container.alignChildren = ['fill','fill'];
mainres = // layout 1
mainPanel = container.add(mainres);
aboutres = // layout 2
aboutPanel = container.add(aboutres);
aboutPanel.hide();
mainPanel.groupOne.infoBtn.onClick = function(){
mainPanel.hide();
aboutPanel.show();
}
aboutPanel.groupOne.backBtn.onClick = function(){
mainPanel.show();
aboutPanel.hide();
}
*Martin
Copy link to clipboard
Copied
Thanks a lot martinr,
that is a solution that i evaluated before but i dismissed because in my real script i launch several window dialogs and palettes from this main window and if i have two on show i have problems with the rest of the code and script workflow.
I need to resize main window maintaining it open and i think the only thing to resolve is the lost of the variables data, i need to get the correct path for them but im still trying how...
Copy link to clipboard
Copied
I solve this and because i get a lot of help in forums and sometimes one simple thing help other i put here the snippet, thanks both for the help! Hope all goes well!!
var myScript = new Window("dialog", "test", undefined, {
resizable: false
})
var resMain = "group{ orientation:'column', \
main_panel: Group { type: 'group', orientation: 'column', alignChildren:['center','center'], margins: [0,0,0,0], borderless: 1, \
gr1: Group{ orientation: 'row', justify: 'center', spacing: 10, \
but_1: Button { preferredSize: [200,30], helpTip: 'new' },\
},\
gr2: Group { orientation: 'column', spacing:10,\
bMain: Button { preferredSize: [200,200] },\
grp_but: Group { orientation: 'row', spacing: 10,\
but_2: Button { text: '', preferredSize: [200,30]},\
},\
},\
},\
}"
init();
if ((myScript != null) && (myScript instanceof Window)) {
myScript.center();
myScript.show();
}
function buildUI() {
myScript.grp = myScript.add(resMain);
var butOne = myScript.grp.main_panel.gr1.but_1;
var butTwo = myScript.grp.main_panel.gr2.grp_but.but_2;
var butMain = myScript.grp.main_panel.gr2.bMain;
butOne.text = butTwo.text = "HIDE";
butMain.text = "RESIZE";
return {
butMain: butMain,
butOne: butOne,
butTwo: butTwo,
};
}
function init() {
var bool = false
var UI = buildUI()
function doIt() {
alert("Do it!")
}
function toggle() {
if (bool) {
myScript.remove(myScript.children[0]);
UI = buildUI()
UI.butOne.onClick = UI.butTwo.onClick = doIt
UI.butMain.onClick = toggle
} else {
myScript.grp.main_panel.remove(myScript.grp.main_panel.gr1);
myScript.grp.main_panel.gr2.remove(myScript.grp.main_panel.gr2.grp_but);
}
myScript.layout.layout(true);
bool = !bool
}
UI.butMain.onClick = toggle
UI.butOne.onClick = UI.butTwo.onClick = doIt
}