Ko/dialogs open() how to show title, text, and prompt?

I’m having difficulty figuring out how to use the open() method for displaying options to the user. In the example code below, I make three calls to that method, and expected the second and third to show the title, extra text, and a prompt in the dialog box. But the second and third dialogs look identical to the first (screenshot attached). Can anyone see what I’m doing wrong?

var d = require( "ko/dialogs" );
//  The message can be only one line. The newline becomes a space.
d.open( "message 1\nmessage 2" );

//  The title, text, and prompt are not displayed.
d.open( "message 1\nmessage 2", { title: "title", text: "text", prompt: "prompt" } );
d.open( "message 1\nmessage 2", { }, { title: "title", text: "text", prompt: "prompt" } );

Also, the documentation for this method seems vague. It mentions:

opts Object The options object. Attributes explained above.
opts object Optional object with options

It is not clear to me what exactly is referred to by the phrase “Attributes explained above”. Explained for what method? In fact, as you can see in the code above, I wasn’t even sure which of the two objects we are supposed to put the properties in, so I tried both.

@mjross if you look at the source code it looks like it only accept one object of options.
Looks like the documentation is wrong about the double options.

It looks like you are right: just one opts.

Have you ever been able to get the title, text, or prompt to display?

@mjross at my first try, my window looked the same as yours.
Only when I looked further in to the code, I noticed you should at least have to define one button.
On my second try the window looks like:

The sample code:

var desc = ' Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. ';

require("ko/dialogs").open('test description', {'title': 'test title', 'text': desc, 'buttons': ['Ok']});

@babobski Thank you for that. So the title, text, or prompt do not work if the default buttons are used. I’ll file a bug report.

The docs mention “the class attribute to be applied to the dialog icon.” Is that like a CSS class added to an HTML element? If not, what is meant by that? I can’t imagine how one could use a CSS class on a dialog, but perhaps that’s made possible by writing an add-on instead of a userscript.

For the buttons you need the following requirements:

if (typeof buttons == "undefined" || buttons == null) {
/// buttons has to be defined
} else if (buttons.length == 0 || buttons.length > 4) {
/// Button length has to be in the range of 1 - 4
} else if (buttons.length == 4 && buttons[3] != "Cancel") {
// if buttons length is 4 the last button needs to be the cancel button
}

Where it here goes wrong, is that if you don’t meet these requirements.
It log’s the error message and want to alert it, after that it would close the window.
Only it fails to open the alert ( you will have a error for it in you’re error log ), causing it to also fail to close the dialog.
How the dialog looks like in you’re screenshot should not be possible.

I think this might be a side effect of running this snippet from you’re toolbox.
But that is something the guys from komodo probably can answer for you.

I don’t know how long this function is present and how much it is used.
If you would inspect the window you will notice that it already has a default icon, only it missing it’s styling.

If you would ad the old styling back, it would look like:

The code controlling the icon class can be found here, I tried it out but it is not working for me.

Just a note on the side, if you want to do more with addons, you can also easily create you’re own custom windows (or dialogs). Mozilla has some fine documentation about that.

@babobski Thank you again!

if (typeof buttons == "undefined" || buttons == null) {
Where did you find this code? I don’t see it at KomodoEdit/src/chrome/komodo/content/sdk/dialogs.js at master · Komodo/KomodoEdit · GitHub.

if you want to do more with addons, you can also easily create you’re own custom windows (or dialogs). Mozilla has some fine documentation about that.

I appreciate the encouragement, but I’m not sure if I’ll ever reach that point since I’m guessing XUL is even more challenging and I’m already finding some of the userscript documentation quite frustrating. I wish it had more details, and sample code would be wonderful (like they do at php.net).

The require('ko/dialogs')open() function, opens a dialog.
The code can be found in the onload function of the script that’s in that dialog.

If you start with xul it’s pretty easy to learn.
But some of the documentation can also be a bit rough.
I think Komodo is currently making create step’s with the documentation and if we keep reporting the documentation issues, it only getting better.

The code can be found in the onload function of the script that’s in that dialog.

Okay. I was assuming all the code for it was at KomodoEdit/src/chrome/komodo/content/sdk/dialogs.js at master · Komodo/KomodoEdit · GitHub

I think Komodo is currently making create step’s with the documentation and if we keep reporting the documentation issues, it only getting better.

Sounds good. I’ll do whatever I can to help. Perhaps an advantage I have (the only one) is that I’m viewing the product and docs through the eyes of a newbie who is trying to learn it all from the docs and from asking questions.

1 Like

Sorry about the confusion, I’ll make sure the docs get updated.

Bob is totally right, please keep reporting these issues with the docs :slight_smile: It’s unfortunate there are some errors in them but as they are brand new it’s only a natural part of the process. I know, ideally it shouldn’t be, but ideals only get you so far.

Thanks to all of you, not only for your efforts to improve the code and documentation, but also your patience in answering my questions as I try to not only contribute to the project but also learn how to make the most of what is possible.

1 Like