JQueryUI

Let’s add some JQueryUI into our application to make it look a little nicer. Modify Index.iwml:

ACORN 1.0 IWML 1.0
Guess.Index[]
  SimpleStack[]
    JQUI.AccordionGroup[]
      JQUI.Accordion[] Play
        SimpleStack[]
          Edit:Guess;
          Text:TryCount Guess #
          Gap;
          BS.Button:GuessButton
            Text: Guess
            Face: Info
            ButtonSize: Large
          ]
        ]
      ]
      JQUI.Accordion[] Instructions
        Text Enter a number and click Guess.
      ]
      JQUI.Accordion[] About
        Text Where would we be without the Guess demo?
      ]
    ]
  ]
]

When we run it, it now looks like this:

Now we will upgrade our dialogs to replace the minimal window.alert() that we used before. Proceed to next topic, SweetAlert.