Mercurial > maze-src

<!DOCTYPE html>
<html>
<head>
<link rel="image_src" href="/img/dung.png"/>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<meta name="google-site-verification" content="gvy0h6qHfZoCWcfyIilhOm_Kifle93a-bt_xk7zXJp0" />
<meta name="msvalidate.01" content="2211C2467FF4056C4317EC99FD76DCD7" />
<meta name="description" content="Dungeons of Perish: a tiny online maze game for those who love labyrinths">
<meta property="og:image" content="/img/dung.png" />
<meta property="og:url" content="http://dungeons.sh" />
<meta property="og:type" content="game" />
<meta property="og:title" content="Dungeons of Perish" />
<meta charset="UTF-8">
<style>
    .newgametable td { background-color:black; cursor: pointer;  }
    .newgametable td:hover { background-color: lightslategray;  };

    /* unvisited link */
    a:link {
    color: white;
    }

    /* visited link */
    a:visited {
    color: white;
    }

    /* mouse over link */
    a:hover {
    color: blue;
    }

    /* selected link */
    a:active {
    color: blue;
    }
</style>
    <script type="text/javascript" src="/js/requester.js"></script>
    <!-- <script type="text/javascript" src="progress.js"></script> -->
    <script type="application/javascript">

        function get_browser() {
            var ua=navigator.userAgent,tem,M=ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
            if(/trident/i.test(M[1]))
            {
                tem=/\brv[ :]+(\d+)/g.exec(ua) || [];
                return {name:'IE',version:(tem[1]||'')};
            }
            if(M[1] === 'Chrome')
            {
                tem = ua.match(/\bOPR|Edge\/(\d+)/);
                if(tem!==null)
                {
                    if(tem[1] !== undefined)
                    {
                        return {name:'Opera', version:tem[1]};
                    }
                    else
                    {
                        if(tem[0] === 'OPR')
                        {
                            var ver = tem.input[tem.index + 3 + 1]; // skip OPR and /
                            ver += tem.input[tem.index + 3 + 1 + 1]; // till Opera reaches 100 this should work ok.
                            return {name:'Opera', varsion:ver};
                        }
                    }

                }
            }
            M=M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
            if((tem=ua.match(/version\/(\d+)/i))!==null) {M.splice(1,1,tem[1]);}
            return {
                name: M[0],
                version: M[1]
            };
        }

        var browser=get_browser();
        if(browser.name !== "Firefox" && browser.name !== "Chrome" && browser.name !== "Opera" ||
            (browser.name === 'Opera' && browser.version < 45
                || browser.name === "Chrome" && browser.version < 56
                || browser.name === "Firefox" && browser.version < 52) )
        {
            var message = browser.name + " version " + browser.version +" is not really supported.\n\nWe recommend using one of the following browsers:\n\n \u2022 Firefox > 53 \n \u2022 Chrome > 56 \n \u2022 Opera > 45\n\notherwise you might encounter performance issues.";
            window.alert(message);
        }

        function on_new_game(e, loc)
        {
            window.location.href = loc;
        }
        function new_story_game(e)
        {
            // Yup, next release will contain a story too :)
            on_new_game(e, '${story_game_loc}')
        }
        function new_adventure_game(e)
        {
            on_new_game(e, '${adv_game_loc}')
        }
        function new_timechaser_game(e)
        {
            on_new_game(e, '${timer_game_loc}')
        }
        function page_loader(e)
        {}
        function upon_page_load()
        {
            requestjss("/js/graphics.js");
        }
    </script>
</head>
<body style="margin: 0; height: 100%; overflow: hidden; " bgcolor="black" onload="${page_loader}">
<div id="fb-root"></div>
<script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.10";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div id="menu" style="
    background-color: black;
    width: 100%;
    min-height: 31px;
    max-height: 31px;
    position: absolute;
    border-color: black;
    top: 0;
    left: 0;
    margin: 0 auto;
    visibility: ${menu_line_visible};
">
    <font color="white" face="Arial">

    <table style="border: 0;table-layout: fixed; max-height: 24px; height: 24px;" cellspacing="0" cellpadding="0">
    <tr>

        <!-- Game ID -->
        <td style="border: 0; background-color: rgb(136,139,40); visibility: ${gameid_visible};">
            <div style="width: ${gameid_size}; visibility: ${gameid_visible};">
                GameID:
            </div>
        </td>
        <td style="border: 0; background-color: rgb(136,139,40); width: ${gameid_size}; visibility: ${gameid_visible};" align="right">
            <div style="width: ${gameid_size}; visibility: ${gameid_visible};">
                <span style="margin: 0;padding: 0; visibility: ${gameid_visible}" id="gameid" title="${level_statistics}"></span>
            </div>
        </td>

        <!-- Day/Level counter -->
        <td style="border: 0; background-color: rgb(22,127,169); visibility: ${levelctr_visible};">
            <div style="width: 55px; visibility: ${levelctr_visible};">
                ${day_or_level}:
            </div>
        </td>
        <td style="border: 0; background-color: rgb(22,127,169); visibility: ${levelctr_visible};" align="right">
            <div style="width: 125px; visibility: ${levelctr_visible};">
                <span style="margin: 0;padding: 0; visibility: ${levelctr_visible};" id="levelctr"> </span>
            </div>
        </td>
        <td style="border: 0; background-color: rgb(22,127,169); visibility: ${levelctr_visible};">
            <div style="width: 30px;">
                &nbsp;
            </div>
        </td>

        <!-- Health -->
        <td style="border: 0; background-color: green; visibility: ${health_visible};">
            <div style="width: 30px; visibility: ${health_visible};">
                <img src="/img/player/heart.png" width="24px" height="24px" title="How much health you have left">
            </div>
        </td>
        <td style="border: 0 solid black; background-color: green; visibility: ${health_visible};">
            <div style="width: 102px; visibility: ${health_visible};">
                <progress id="lifeprg" value="100" max="100" style="
                border-radius: 1px;
                height: 23px;
                width: 100px;
                padding: 0;
                background-color: black;
                color: green;
                -webkit-appearance: none;
            ">
                </progress>
            </div>
        </td>
        <td style="border: 0; background-color: green; visibility: ${health_visible};">
            <div style="width: 30px; visibility: ${health_visible};">
                <span style="margin: 0;padding: 0;" id="energy">100</span>
            </div>
        </td>

        <!-- Skeleton -->
        <td style="border: 0; background-color: rgb(122,27,69); visibility: ${skeletons_visible}; ">
            <div style="width: 30px;">
                &nbsp;
            </div>
        </td>
        <td style="border: 0; background-color: rgb(122,27,69); visibility: ${skeletons_visible}; ">
            <div style="width: 24px; visibility: ${skeletons_visible};">
                <img src="/img/skel/wl/d_wl_1.png" width="24px" height="24px" title="How many skeletons have you killed">
            </div>
        </td>
        <td style="border: 0; background-color: rgb(122,27,69); visibility: ${skeletons_visible}; ">
            <div style="width: 20px;  visibility: ${skeletons_visible};">
                <p style="margin: 0;padding: 0;" id="skels_killed">0</p>
            </div>
        </td>

        <!-- Gold -->
        <td style="border: 0; background-color: rgb(39,71,122); visibility: ${gold_visible};">
            <div style="width: 3px; visibility: ${gold_visible};">
                &nbsp;
            </div>
        </td>
        <td style="border: 0; background-color: rgb(39,71,122); visibility: ${gold_visible};">
            <div style="width: 24px; visibility: ${gold_visible};">
                <img src="/img/gold.png" width="20px" height="20px" alt="Gold" title="Your accumulated gold">
            </div>
        </td>
        <td style="border: 0; background-color: rgb(39,71,122); visibility: ${gold_visible};">
            <div style="width: 20px; visibility: ${gold_visible};">
                <p style="margin: 0;padding: 0;" id="gold">0</p>
            </div>
        </td>


        <!-- Ring Indicator -->
        <td style="border: 0; background-color: black; ">
            <div style="width: 24px; visibility:${equipment_visible};" id = "ring_of_health_div">
                <img src="/img/weapons/ring.png" width="24px" height="24px" title="The Ring of Health is yours">
            </div>
        </td>

        <!-- Shoes indicator -->
        <td style="border: 0; background-color: black;">
            <div style="width: 24px; visibility:${equipment_visible};" id="boots_of_light_div">
                <img src="/img/weapons/shoe.png" width="24px" height="24px" title="The Boots of Lightness are yours">
            </div>
        </td>

        <!-- Loading indicator -->
        <td style="border: 0; background-color: black;" valign="center">
            <div style="width: 100%; visibility:"visible";" id="loader_div">
                <img src="/img/loader.gif" width="128x" height="15px" title="Loading">
            </div>
        </td>


        <!-- Maze statistics counter -->
        <td style="height:24px; border: 0; background-color: rgb(0,0,0); text-align:right; visibility: ${statis_visible};">
            <div style="margin: 0;padding: 0; width: 100px; visibility: ${statis_visible};" id="steps_passed">0</div>
        </td>
        <!-- Time counter -->
        <td style="height:24px; border: 0; width: 100%; background-color: rgb(0,0,0); text-align:right; visibility: ${timer_visible};">
            <span style="margin: 0;padding: 0; visibility: ${timer_visible};" id="time_passed">0:0:0</span>
        </td>

        <!-- Menu -->
        <td style="cursor: pointer; height:24px; border: 0; width: 100%; background-color: rgb(0,0,0); text-align:right; ">
            <img src="/img/menu.png" height="24px" width="24px" onclick="show_menu();" title="Play a new game">
        </td>
        <!-- Help -->
        <td style="cursor: pointer; height:24px; border: 0; width: 100%; background-color: rgb(0,0,0); text-align:right; ">
            <script type="text/javascript">
                document.write("<a href=\"mail" + "to:" + new Array("dungeons.sh","gmail.com").join("@") + "\">" + "<img src=\"/img/question.png\" height=\"24px\" width=\"24px\" title=\"Send a raven\">" + "</" + "a>");
            </script>
        </td>
        <!-- FB -->
        <td>
            <div class="fb-like" data-href="http://dungeons.sh" data-width="24" data-layout="button" data-action="like" data-size="small" data-show-faces="false" data-share="true">
            </div>
        </td>
        </tr>
    </table>
    </font>
</div>

<div id="canvasdiv" style="width: calc(100% - 2px);
    height: calc(100% - 34px); overflow: hidden;
    position: absolute;
    top: 32px;
    left: 0;
    border-color: black;
    margin: 0 auto;">
    <canvas id="canvas" width="10px" height="10px"></canvas>
</div>
<script type="application/javascript">
    //var bar = new ProgressBar.Line('#canvasdiv', {easing: 'easeInOut'});
</script>
<div id="messages" style="
            position:fixed;
            top:60px;
            left:calc(50% - 320px);
            width:640px;
            height: 480px;
            z-index: 55;
            background-color: black;
            border:1px solid black;
            border-radius: 25px;
            visibility: ${messages_visible};
">
    <img id="goimg" src="/img/dungeonslogo.png">
    <center>
    <font face="Arial" color="white"><strong>
        <div id="sysmenu" style="visibility: ${sysmenu_visible}; height:100%; display:${sysmenu_display};">
            <center>
            You are ...
            </center>
            <p>
            <table class="newgametable" style="width:400px; height:100%; border: 1px solid white ">
                <tr>
                    <!--
                        <td onclick="new_story_game(event);">
                            <center>
                            <img src="/img/tavern.png" width="48px" height="48px">
                            <p>
                            ... having a drink at the tavern while a funny fellow stares at you
                            </center>
                        </td>
                    -->
                        <td onclick="new_adventure_game(event);">
                            <center>
                            <img src="/img/business.png" width="48px" height="48px">
                            <p>
                            ... a fearless adventurer in search for fame and fortune
                            </center>
                        </td>
                        <td onclick="new_timechaser_game(event);">
                            <center>
                            <img src="/img/clock.png" width="48px" height="48px">
                            <p>
                            ... determined to get out from here as fast as possible
                            </center>
                        </td>
                    </tr>
                </table>
		(PS: You will need a decent browser for this to work)
                </p>
                <!--
                <table  style="width:100%; height:100%; border: 1px solid black ">
                    <tr>
                        <td>
                            ...the owner of a GameID:
                        </td>
                        <td>
                            <input type="text">
                        </td>
                        <td>
                            <button type="button">Continue</button>
                        </td>
                    </tr>
                </table>
                -->
            </div>
            <div id="badbrowser" style="visibility: ${badbrowser_visible}; height:100%; display:${badbrowser_display};">
                Seems your browser is not in the list of supported browsers...
                We recommend using one of the following browsers:<p>
                <ul>
                    <li>Firefox &gt; 53</li>
                    <li>Chrome &gt; 56</li>
                    <li>Opera &gt; 44</li>
                </ul>
                otherwise you might encounter performance issues... or simply, the game will not work.<p>
            </div>
            <span id="gotext1" style="visibility: hidden;">
                ${gotext1}
                <p id="gotext2" style="visibility: hidden;">
                ${gotext2}
                </p>
                <p id="gotext3" style="visibility: hidden;">
                ${gotext3}
                </p>
                <p id="gotext4" style="visibility: hidden;">
                ${gotext4}
                </p>
                <p id="gotext5" style="visibility: hidden;">
                ${gotext5}
                </p>
            </span>
        </strong></font>
            <center>
            <p>&nbsp;<p align="center">
                <span id="gospan">
                    <button id="gobutton" onclick="setup_labyrinth();" style="visibility: hidden;">
                        Let's get out
                    </button>
                </span>
                <p>
                <span id="goexploremore" style="visibility: hidden;">
                    <button id="gonextlevel" onclick="${new_game_type}(window.event);">
                        New game
                    </button>
                </span>
            </center>
        </center>

    </div>
    <form name="n">
    <input type=hidden id="gid" name="gid" value="${gid}"/>
    <input type=hidden id="lid" name="lid" value="${lid}"/>
    </form>
author	ferencd
date	Sun, 15 Sep 2019 11:46:47 +0200
parents
children