view Applications/Samples/WebAssembly/RtViewer/index.html @ 1989:e8b9a2ba1df1

Added left/right rotation buttons
author Sebastien Jodogne <s.jodogne@gmail.com>
date Mon, 31 Oct 2022 20:59:59 +0100
parents d1806b4e4839
children
line wrap: on
line source

<!doctype html>
<html lang="en-us">
  <head>
    <title>Stone of Orthanc Single Frame Viewer </title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <link rel="icon" href="data:;base64,iVBORw0KGgo=">

    <!-- Disable pinch zoom on mobile devices -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="HandheldFriendly" content="true" />
    
    <style>
      html, body {
      width: 100%;
      height: 100%;
      margin: 0px;
      border: 0;
      overflow: hidden; /*  Disable scrollbars */
      display: block;  /* No floating content on sides */
      }

      #RtViewer_Axial {
        position: absolute;
        left: 0%;
        top: 0%;
        background-color: red;
        width: 50%;
        height: 100%;
      }

      #RtViewer_Coronal {
        position: absolute;
        left: 50%;
        top: 0%;
        background-color: green;
        width: 50%;
        height: 50%;
      }

      #RtViewer_Sagittal {
        position: absolute;
        left: 50%;
        top: 50%;
        background-color: blue;
        width: 50%;
        height: 50%;
      }
    </style>
  </head>
  <body>
    <canvas id="RtViewer_Axial" oncontextmenu="return false;"></canvas>
    <canvas id="RtViewer_Coronal" oncontextmenu="return false;"></canvas>
    <canvas id="RtViewer_Sagittal" oncontextmenu="return false;"></canvas>

    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.js"></script>

    <script src="RtViewerWasmApp.js"></script>
  </body>
</html>