Shadow Meets Zifmia

Posted: January 5, 2011 in Uncategorized

Over the holidays I got back to working on Zifmia and made significant progress. The backend is functional, although there are peripheral tasks to implement, such as security.

The service is working perfectly and I’ve begun implementing Shadow in the Cathedral with Zifmia as its own stand-alone website.

A snapshot of the current site is shown here. There are many features to add via CSS, but the basic work is complete. The game is loaded each turn on the server where state is also saved. Currently, the game is loading a single instance, but the method for having multiple instances is there and work will begin on that shortly. For each registered user, one or more sessions can be created. The user will be able to save/restore a session or continue the session from its latest point. I’ll be adding tabs for the introduction, hints, and other things. The current session will automatically load and I’m going to implement paging capabilities to see previous turn text. I should be able to hook in keyboard shortcuts to do some of the work too.

You can play with the current page by starting out with a “look” and play from there.

Now, some of the guts.

One of the key files is the jQuery code to call the service.

function GetResponse(obj) {
    $("#error").text("Working...");

    $.ajax({
        type: "POST",
        url: serverURL,
        data: data,
        processData: true,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: handleOutput,
        error: function (xhr, textStatus, errorThrown) {
            $("#error").text("Error" + xhr.status + "...");
        }
    });
}

function setChannel(channelName, channelData, append) {
    if (append == true) {
        if (channelData) {
            filterText = Filter(channelData);
            $("#" + channelName).append(filterText);
        }
    } else {
        if (channelData) {
            filterText = Filter(channelData);
            $("#" + channelName).html(filterText);
        } else {
            $("#" + channelName).text("");
        }
    }
}

// The author can modify this file to adjust what happens to channel data on return from the server.
function handleOutput(zifmiaData) {
    $("#error").text("Succeeded.");
    if (zifmiaData.Prologue) {
        setChannel("mainChannel", zifmiaData.Prologue, false);
        setChannel("mainChannel", "<br/><br/>", true);
        setChannel("mainChannel", zifmiaData.Main, true);
    } else {
        setChannel("mainChannel", zifmiaData.Main, false);
    }
    setChannel("chapterChannel", zifmiaData.Chapter, false);
    var cmd = document.getElementById("command");
    cmd.focus();
}

function KeyDownHandler(buttonId) {
    var btn = document.getElementById(buttonId);
    if (event.keyCode == 13) {
        event.returnValue = false;
        event.cancel = true;
        btn.click();
    }
}

There are still more channels to implement, but the idea is straight-forward. Once the service returns the channel data, it’s written, Ajax-style, to the proper html element. I have a filtering mechanism, but currently it’s only changing newlines to <br/>’s. I will probably be adding more markup and therefore, more filtering.

This is just a sampling of the work surrounding Zifmia. There is much more work to do before it’s ready for primetime. And when I do get to a completed state, it might be fun to have a sort of IF Zen Garden, to see what sort of layouts people can make through CSS.

About these ads

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s