<!doctype html>

<html>
<head>
    <meta charset="utf-8">
    <script src="./ext.js"></script>
    <script src="./lib/CSInterface-5.0.0.js"></script>
    <script src="./lib/jquery-1.9.1.min.js"></script>

    <link id="ppstyle" rel="stylesheet" type="text/css" href="./style.css">
    <link id="theme" rel="stylesheet" type="text/css" href="./lightTheme.css">
    <title></title>
</head>

<body onLoad="onLoaded();onResize()" oncontextmenu="return false;" ondragstart="return false;" onkeydown="onKeyDown(event)" onresize="onResize()">

    <div id="previewFrameContainer">
        <iframe id="previewFrame" src="" scrolling="no"></iframe>
    </div>

    <div class="bottomStrip" id="buttonDiv">
        <button class="buttonLeft unselectedButton ctooltip" id="previewButton" onClick="onClickPreviewButton(event)">
            <div class="previewImage imageProperties"></div>
            <div id="previewButtonctooltip" class="ctooltip-data"></div>
        </button>
        <button class="buttonLeft unselectedButton ctooltip" id="stopButton" onClick="onClickStopButton()">
            <div class="stopImage imageProperties"></div>
            <div id="stopButtonctooltip" class="ctooltip-data"></div>
        </button>

        <!-- spacer -->
        <div class="buttonLeft" id="emptyDiv"></div>

        <!-- page/spread nav -->
        <button class="buttonLeft unselectedButton ctooltip" id="previousButton" onClick="onClickPreviousButton()">
            <div class="previousImage imageProperties"></div>
            <div id="previousButtonctooltip" class="ctooltip-data"></div>
        </button>
                
        <div class="ctooltip" id="pageNumberWrapper">
            <input class="textBox inactiveTextBox" id="pageNumber" type="text" size=8 maxlength="50" readonly/>
            <div id="editBoxTooltip" class="ctooltip-data"></div>
        </div>
        
        <button class="buttonLeft unselectedButton ctooltip" id="nextButton" onClick="onClickNextButton()">
            <div class="nextImage imageProperties"></div>
            <div id="nextButtonctooltip" class="ctooltip-data"></div>
        </button>

        <button class="buttonRight unselectedButton ctooltip" id="documentButton" onClick="onClickDocumentButton()">
            <div class="documentImage imageProperties"></div>
            <div id="documentButtonctooltip" class="ctooltip-data"></div>
        </button>
        <button class="buttonRight unselectedButton ctooltip" id="spreadButton" onClick="onClickSpreadButton()">
            <div class="spreadImage imageProperties"></div>
            <div id="spreadButtonctooltip" class="ctooltip-data"></div>
        </button>
    </div>

</body>
</html>
