Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add custom label for buttons #14

Closed
paologf opened this issue Jul 2, 2018 · 4 comments
Closed

Add custom label for buttons #14

paologf opened this issue Jul 2, 2018 · 4 comments

Comments

@paologf
Copy link

paologf commented Jul 2, 2018

Hello,

is it possible add into the options parameter of confirm function a dictionary with a custom label for each button?
Maybe something like {"cancel":"Cancel Button Label","close":"Cancel Button Label","ok":"Ok Button Label"} , pass into the getTemplate function this labels dictionary and use call labels[name] || name.

   function getTemplate(title, msg, value, buttons, labels) {
    const encodedMsg = msg.replace(/\n/g, '<br>');
    
    return `<div class="page">
        <div data-name="js-close" class="close-button"></div>
        <header>${ title }</header>
        <div class="content-area">${ encodedMsg }${ value }</div>
        <div class="action-area">
            <div class="button-strip"> ${
                buttons.map((name, i) =>
                    `<button tabindex=${ i } data-name="js-${ name.toLowerCase() }">${ labels[name] || name }</button>`
                ).join('')
            }
            </div>
        </div>
    </div>`; 
}

Thanks

Paolo

@coderaiser
Copy link
Owner

Hi, it is an interesting idea :), we can add buttons property to options to every public method (alert, confirm and prompt) it can look like this for prompt:

exports.prompt = (title, msg, value = '', options) => {
    const type = getType(options);
    
    const val = String(value)
        .replace(/"/g, '&quot;');
    
    const valueStr = `<input type="${ type }" value="${ val }" data-name="js-input">`;
    const buttons = options.buttons || BUTTON_OK_CANCEL;
    return showDialog(title, msg, valueStr, buttons, options);
};

I think we should also add function getButtons similar to getType so we can use:

const buttons = getButtons(options) || BUTTON_OK_CANCEL;
return showDialog(title, msg, valueStr, buttons, options);

Also tests should be added.

And ofcourse all this stuf would not work work smalltalk.native.

It is a great idea for a pull request :)

@paologf
Copy link
Author

paologf commented Jul 5, 2018

Hi @coderaiser I just modified the code, but I don't understand how to run test. Could you please explain me?

@coderaiser
Copy link
Owner

@paologf, you can run npm test for this purpose.

@coderaiser
Copy link
Owner

Added in #15.
Landed in v3.1.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants