Modal

The Modal class is not a ZUI component though it is part of of the user interface. Modal messages overlay all of the user interface and block any usage of the user interface until the requested user input is provided. There are no instances of the Modal class, only static methods.

Static Methods

• alert(message:string) – this will cover the user interface, present message to the user and will await the user pressing OK before releasing the user interface.
• confirm(message:string, answer:(yes:boolean)=>void) – this will post message for user confirmation. If the user presses Yes then the answer function is called with a true value. If the user presses No, the function is called with false.
• show(display:ZUI,actions: { [text:string]:()=>void } – this is the most flexible method. Instead of a string message any ZUI component can be passes as display. The actions parameter contains a table of functions indexed by a piece of message text. Each of the text items are displayed as a button and when one is selected, the corresponding function is called.

Examples

Modal.alert("Oh No!");

Model.confirm("Do you want to save the file?",
     (yes:boolean)=>{
          if (yes)
               save the file
          else
               throw away the data
      });

Model.show(
      new DivUI([
          new TextUI("Error"),
          new TextUI(()=>{ return the message; })
      ]),
      { "Sing":()=>{ play a song },
        "Dance":()=> { play a dance video }
      });

Styling

• Modal – styling for the whole modal block
• Modal-content – styling for the message content
• Modal-btn – styling for the action buttons