• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
7

Can't call functions from onClick on a button

New Here ,
May 13, 2024 May 13, 2024

Copy link to clipboard

Copied

Hello everyone,
I am writing a script that will allow me to automate the layout grid construction process in InDesign. For the moment I have implemented 2 or 3 construction methods and now I am focusing on the interface through which I can modify custom parameters.
The problem is that it seems impossible to execute a function upon pressing a button in the dialog.
I attach the test code for reference.

var doc = app.activeDocument;

var masterIndex = 0;
var master_spread_left = doc.masterSpreads.item(masterIndex).pages.item(0);
var master_spread_right = doc.masterSpreads.item(masterIndex).pages.item(1);

var pageHeight = Math.round(doc.documentPreferences.pageHeight);
var pageWidth = Math.round(doc.documentPreferences.pageWidth);
var pageRatio;
if (pageHeight >= pageWidth) {
    pageRatio = pageWidth / pageHeight;
} else if (pageWidth > pageHeight) {
    pageRatio = pageHeight / pageWidth;
}
var marginTop, marginBottom, marginLeft, marginRight;
var marginRatio = 1 - pageRatio;


gridWizardDialog();

function gridWizardDialog() {
    var myDialog = new Window ('dialog {text: "Grid Wizard", orientation: "column", alignChildren: ["fill","fill"], properties: {closeButton: false}}');
    myDialog.main = myDialog.add ('group {preferredSize: [600, 500], alignChildren: ["left","fill"]}');

    myDialog.subTabs = myDialog.main.add ('listbox', undefined, ['Everything Everywhere All At Page Ratio', 'Gutenbergify', 'I Kissed A Square And I Liked It']);
    myDialog.tabGroup = myDialog.main.add ('group {alignment: ["fill","fill"], orientation: "stack"}');

    myDialog.tabs = [];

    //1 - Everything Everything Everywhere All At Page Ratio
    myDialog.tabs[0]= myDialog.tabGroup.add('group');
    myDialog.tabs[0].add('statictext{text: "Everything Everywhere All At Page Ratio"}')
    myDialog.tabs[0].add('panel');

        // Full - Empty Area Ratio
        var everythingEverywhereAllAtPageRatioMarginRatioGroup = myDialog.tabs[0].add('group');
        everythingEverywhereAllAtPageRatioMarginRatioGroup.orientation = 'row';
            everythingEverywhereAllAtPageRatioMarginRatioGroup.add('statictext{text: "Full - Empty Area Ratio:"}');
            var myMarginRatioField = everythingEverywhereAllAtPageRatioMarginRatioGroup.add('edittext', undefined, marginRatio.toFixed(2), {multiline: false, wantReturn: false});
            myMarginRatioField.characters = 4;
            myMarginRatioField.enabled = false;
                var myMarginRatioCheckbox = everythingEverywhereAllAtPageRatioMarginRatioGroup.add('checkbox', undefined, 'set a custom value');
                myMarginRatioCheckbox.onClick = function() {
                    myMarginRatioField.enabled = myMarginRatioCheckbox.value;
                };
        // Columns number
        var everythingEverywhereAllAtPageRatioColumnsGroup = myDialog.tabs[0].add('group');
        everythingEverywhereAllAtPageRatioColumnsGroup.orientation = 'row';
            everythingEverywhereAllAtPageRatioColumnsGroup.add('statictext{text: "Number of columns:"}');
            var myColumnsNumberField = everythingEverywhereAllAtPageRatioColumnsGroup.add('edittext', undefined, '1');
            myColumnsNumberField.characters = 4;



    for (var i = 0; i < myDialog.tabs.length; i++) {
        myDialog.tabs[i].orientation = 'column';
        myDialog.tabs[i].alignChildren = 'fill';
        myDialog.tabs[i].alignment = ['fill','fill'];
        myDialog.tabs[i].visible = false;
    }

    myDialog.subTabs.onChange = showTab;
    function showTab () {
        if ( myDialog.subTabs.selection !== null) {
            for (var i = myDialog.tabs.length - 1; i >= 0; i--) {
                myDialog.tabs[i].visible = false;
            }
            myDialog.tabs[myDialog.subTabs.selection.index].visible = true;
        }
    }





    
    
        var okButton = myDialog.add ('button', undefined, "oooook");
        okButton.onClick = function(){
            var myMarginRatio = parseFloat(myMarginRatioField.text);
            var myColumnsNumber = parseFloat(myColumnsNumberField.text);

            everythingEverywhereAllAtPageRatio(myMarginRatio, myColumnsNumber);
        }
    myDialog.show();
}




function everythingEverywhereAllAtPageRatio(marginRatio, columns) {
    var marginWidth = pageWidth * marginRatio;
    
    marginTop = marginHeight / 2;
    marginBottom = marginHeight / 2;
    marginLeft = marginWidth / 2;
    marginRight = marginWidth / 2;
    
    var columnsWidth = (pageWidth - marginWidth) / columns;
    var marginHeight = pageHeight * marginRatio;
    var rowsHeight = (columnsWidth * (pageHeight - marginHeight)) / (pageWidth - marginWidth);

    var gutterWidth = (columnsWidth * marginRatio) / 2;
    var gutterHeight = (rowsHeight * marginRatio) / 2;

    for (var i = marginLeft + columnsWidth; i < pageWidth - marginRight - 1; i += columnsWidth) {
        with (master_spread_left) {
            guides.add(undefined, { orientation: HorizontalOrVertical.vertical, location: (i - gutterWidth / 2) });
            guides.add(undefined, { orientation: HorizontalOrVertical.vertical, location: (i + gutterWidth / 2) });
        }
        with (master_spread_right) {
            guides.add(undefined, { orientation: HorizontalOrVertical.vertical, location: (pageWidth + i - gutterWidth / 2) });
            guides.add(undefined, { orientation: HorizontalOrVertical.vertical, location: (pageWidth + i + gutterWidth / 2) });
        }
    }
    for (var j = marginTop + rowsHeight; j < pageHeight - marginBottom - 1; j += rowsHeight) {
        with (master_spread_left) {
            guides.add(undefined, { orientation: HorizontalOrVertical.horizontal, location: (j - gutterHeight / 2) });
            guides.add(undefined, { orientation: HorizontalOrVertical.horizontal, location: (j + gutterHeight / 2) });
        }
        with (master_spread_right) {
            guides.add(undefined, { orientation: HorizontalOrVertical.horizontal, location: (j - gutterHeight / 2) });
            guides.add(undefined, { orientation: HorizontalOrVertical.horizontal, location: (j + gutterHeight / 2) });
        }
    }





    master_spread_left.marginPreferences.properties = {
        right: marginRight,
        top: marginTop,
        left: marginLeft,
        bottom: marginBottom,
    };
    master_spread_right.marginPreferences.properties = master_spread_left.marginPreferences.properties;

    doc.pages.item(0).appliedMaster = doc.masterSpreads.item(0);
}

While trying to debug, I noticed that if I insert inside okButton.onClick = function(){ } an alert(), it is correctly displayed, but if instead I insert the function everythingEverywhereAllAtPageRatio(), nothing happens. I also tried manually specifying the parameters of everythingEverywhereAllAtPageRatio() (without calling them from the editboxes in the interface) and the problem still occurs.


I thank in advance anyone who can help me out.

TOPICS
Experiment , How to , Scripting

Views

197

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Guide , May 13, 2024 May 13, 2024

That's the nature of a dialog.

Store the values from your dialog and act on them when the dialog is closed with the "ok" button.

Ignore the values if it is closed with "cancel".

 

If you want immediate action, use a modeless dialog by replacing the "dialog" in your initialization string with "palette".

 

Votes

Translate

Translate
Guide ,
May 13, 2024 May 13, 2024

Copy link to clipboard

Copied

That's the nature of a dialog.

Store the values from your dialog and act on them when the dialog is closed with the "ok" button.

Ignore the values if it is closed with "cancel".

 

If you want immediate action, use a modeless dialog by replacing the "dialog" in your initialization string with "palette".

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guide ,
May 13, 2024 May 13, 2024

Copy link to clipboard

Copied

In the case of your dialog the action should take place when myDialog.show() returns.

https://extendscript.docsforadobe.dev/user-interface-tools/window-object.html#show

You can set the result of show() with close()

https://extendscript.docsforadobe.dev/user-interface-tools/window-object.html#close

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 14, 2024 May 14, 2024

Copy link to clipboard

Copied

LATEST

Thank you so much,

I am pretty new to SciptUI and I didn’t know about modeless dialogs.

However I did a quick test with a very simple function and a single button and it seems to work !!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines