$(document).on("pageinit", "#mainpage", function () {
    $(document).on("swipeleft swiperight", "#mainpage", function (e) {
        // We check if there is no open panel on the page because otherwise
        // a swipe to close the left panel would also open the right panel (and v.v.).
        // We do this by checking the data that the framework stores on the page element (panel: open).
        if ($.mobile.activePage.jqmData("panel") !== "open") {
            if (e.type === "swipeleft") {
                $("#searchpanel").panel("open");
            } else if (e.type === "swiperight") {
                $("#defaultpanel").panel("open");
            }
        }
    });
});

$(document).ready(function () {
    $("#searchvalue").keypress(function (event) {
        if (event.which === 13) {
            Search($("#searchvalue").val());
            return false;
        }
    });
    $("#searchbtn").click(function () {
        Search($("#searchvalue").val());
        return false;
    });
    $("#growfont").click(function () {
        Settings.IncreaseResultFontSize();
        return false;
    });
    $("#shrinkfont").click(function () {
        Settings.DecreaseResultFontSize();
        return false;
    });
    $("#break-on-verses").click(function () {
        Settings.Save();
        return false;
    });
    $("#showhelp").click(function () {
        $("#help").dialog({
            draggable: true,
            width: 700,
            height: 650,
            resizable: true
        });
    });
    $("#changefont").change(function () {
        Settings.ChangeResultFont($("#changefont").val());
        return false;
    });
    // load querystring
    var ref = decodeURIComponent(Util.GetUrlVars().r);
    if (ref !== "undefined") {
        // remember the settings, first, because if you have results, the load process would wipe out the passage you want to load.
        Settings.Load();
        // now load the passage from the querystring.
        Search(ref);
        $("#searchvalue").val(ref);
    } else {
        Settings.Load();
    }

    // you need to do this last, otherwise the settings load resets the window height.
    $(window).bind("resize", function () {
        $(".my-breakpoint.ui-grid-c .ui-block-a").css("width", 50);
        $(".my-breakpoint.ui-grid-c .ui-block-b").css("width", window.innerWidth - 190);
        $(".my-breakpoint.ui-grid-c .ui-block-c").css("width", 65);
        $(".my-breakpoint.ui-grid-c .ui-block-d").css("width", 55);
        $("#searchresults").css("height", window.innerHeight - 100);
        return false;
    });
    $(".my-breakpoint.ui-grid-c .ui-block-a").css("width", 50);
    $(".my-breakpoint.ui-grid-c .ui-block-b").css("width", window.innerWidth - 190);
    $(".my-breakpoint.ui-grid-c .ui-block-c").css("width", 65);
    $(".my-breakpoint.ui-grid-c .ui-block-d").css("width", 55);
    $("#searchresults").css("height", window.innerHeight - 100);

});