Instead of using individual events, we can use a complete Javascript code file.

We will assume that you are fluent in basic JavaScript and focus only on the IntraWeb parts. We will not be going in depth into the JavaScript code itself. For our Guess application to function we need to add some logic. We will add very basic logic, and in the next sections we will pretty up our application with JQueryUI, Bootstrap, Templates, and finally show how to run our application inside a WordPress site.

We need to add a few properties to hold state:

var Guess;
(function (Guess) {
    class Index extends IntraWeb.Code {

        constructor() {
            super(...arguments);
            this.TryCount = 0;

            this.Count = 0;
            this.MagicNo = Math.floor((Math.random() * 100) + 1);
        }
       
        WhenGuessButtonClicked(aSender, e) {
            window.alert('Hey there!');
        }
    }
    Guess.Index = Index;
})(Guess || (Guess = {}));

Now let’s change our GuessButton Click event:

WhenGuessButtonClicked(aSender, e) {
    let xGuess = Number(this.Guess.Text.Value);
    if (isNaN(xGuess)) {
        window.alert('Not a valid number.');
    } else if (xGuess < 1 || xGuess > 100) {
        window.alert('Not in the range of 1 to 100.');
    } else {
        this.Count++;
        this.TryCount.Text.Value = 'Guess #' + this.Count;

        if (xGuess < this.MagicNo) {
            window.alert('Too low.');
        } else if (xGuess > this.MagicNo) {
            window.alert('Too high.');
        } else if (xGuess === this.MagicNo) {
            window.alert('Congratulations! You guessed the magic number.');
            this.GuessButton.Enabled.Value = false;
        }
    }
}

One special thing to note – IWML controls have a custom property system and any property that is exposed into IWML must be used with .Value. So this means:

this.TryCount.Text = 'Guess #' + this.Count;

This will execute but it will not work. This is because JavaScript effectively has no strong typing at all. To access the values of properties you must use this form for both reading and writing:

this.TryCount.Text.Value = 'Guess #' + this.Count;

The application is now functional, although still not very pretty.