Select Git revision
ImageWindow.html 6.41 KiB
<!--
Copyright 2015 Andrew Cohen
This file is part of CloneView - the tool for displaying stem cell lineaging in a webpage.
CloneView is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
CloneView is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with CloneView in file "gnu gpl v3.txt". If not, see
<http://www.gnu.org/licenses/>.
-->
<!DOCTYPE html>
<html>
<link rel="shortcut icon" href="./srcImages/favicon.ico" type="image/x-icon" />
<head>
</head>
<title>dLEVER Image Window</title>
<body>
<link rel="stylesheet" type="text/css" href="image.css">
<body style="background-color:gray;">
<div id="toolbar" type="toolbarButton" style="z-index:2;">
<button id="hoverControls" type="buttonTB"> </button>
<button id="hoverInfo" type="buttonTB"> </button>
<button id="zoomIn" type="buttonTB" onclick="zoomIn(1.4);" TITLE="Zooms in Image"> </button>
<button id="zoomOut" type="buttonTB" onclick="zoomOut(1.4);" TITLE="Zooms out Image"> </button>
<button id="X" type="buttonTB" onclick="hitX();" TITLE="Toggles the sidebar"> </button>
<button id="L" type="buttonTB" onclick="markers();" TITLE="Cycles through the labels on each node"> </button>
<button id="C" type="buttonTB" onclick="ResetCurrentClone(-1);" TITLE="Centers the view on the current clone"> </button>
<button id="IDs" type="buttonTB" onclick="rightArrow();" TITLE="Switches between local and global cell IDs"> </button>
<button id="previousMitosis" type="buttonTB" onclick="previousMitosis();" TITLE="Revert back to the previous mitosis event"> </button>
<button id="nextMitosis" type="buttonTB" onclick="nextMitosis();" TITLE="Progress to the next mitosis event"> </button>
<button id="playPause" type="button" onclick="ToggleAnimation();" TITLE="Plays/Pauses the movie"> </button>
</div>
<div id="controlsToolTip" style="z-index:3;">
<p id="sbUsageToolTip"> 'X' - Toggles sidebar<br><br> 'Ctrl' + '+/-' - Zooms image <br><br> 'L' - Cycles through labels <br><br> 'C' - Shows the current clone <br><br> 'T' - Switches between frames and minutes <br><br> 'Spacebar' - Plays/Pauses movie
<br><br> Up/Down arrows - Next/Previous frame <br><br> 'Home'/'End' - Beginning or end of movie <br><br> 'Pg Up'/'Pg Dwn' - Cycle through mitosis events <br><br> Right Arrow - Switch between local and global IDs <br><br> Click + Drag - Pans image <br><br> Ctrl + clicking inside a cell will highlight it on the tree </p>
</div>
<div id="infoToolTip" style="z-index:3;">
<p id="sbPostOrAnt"></p>
<p id="sbStartTimeTool"></p>
<p id="sbEndTimeTool"></p>
<p id="sbNumOfTracksTool"></p>
<p id="sbNumOfSegTool"></p>
<p id="sbMissingSegTool"></p>
<p id="sbNumOfTrackEditsTool"></p>
<p id="sbNumOfSegEditsTool"></p>
<p id="sbErrorRateTool"></p>
<p id="sbCorrectedByTool"></p>
</div>
<div id="sidebar" style='-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;'>
<img id="CloneViewImg" src="srcImages/CloneView-logo-alt1.jpg" width="200" height="78.5" onclick="openCloneView();">
<button id="sbDataset" type="button" onclick="location.reload();"></button>
<div id="progressButtons">
<button id="previousClone" type="button" TITLE="View previous clone" onclick="loadClone(false);"> </button>
<button id="nextClone" type="button" TITLE="View next clone" onclick="loadClone(true);"> </button>
</div>
<p>
<div id="channelButtons" style="display:none;" >
<a id="phase" href="javascript:;" onclick="ShowChannel(1);">Phase</a> <a id="channel2" href="javascript:;" onclick="ShowChannel(2);">GFP</a>
<a id="channel3" href="javascript:;" onclick="ShowChannel(3);">Tex Red</a>
</div>
</p>
<canvas id="miniMap" class="canvas" width="300" height="300" style="z-index:3;"></canvas>
<div id="clones">
<p id="sbClones"></p>
</div>
<div class="container" id="combinedMinis">
<canvas id="miniLineage" class="canvas" width="250" height="300" style="z-index:1;"></canvas>
<canvas id="miniTimeLine" class="canvas" width="250" height="300" style="z-index:2;"></canvas>
</div>
<button id="openLineage" type="button" onclick="openLineage();" TITLE="Opens a separate window with the lineage tree"> Open Full Lineage Tree </button>
<select id="miniCloneView" onchange="location = this.options[this.selectedIndex].value;"></select>
</div>
<div>
<canvas id="imageCanvas" class="canvas" width="0" height="0" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
<canvas id="uiCanvas" width="300" height="300" style="position: fixed; left: 0; top: 0; z-index: 1;"></canvas>
<script src="KeyHandler.js"></script>
<script src="MouseHandler.js"></script>
<script type="application/javascript" src="ImageWindowBuilder.js?201034"></script>
<script type="text/javascript" src="NodePlacement.js?201036"></script>
<script type="text/javascript" src="ReadCloneFiles.js"></script>
<script type="text/javascript" src="CloneViewFunctions.js"></script>
<script type="text/javascript" src="PointInPolygon.js"></script>
<script type="text/javascript" src="LoadTempHulls.js"></script>
<script type="text/javascript" src="sidebar.js"></script>
<script type="text/javascript" src="miniLineage.js"></script>
<script type="text/javascript" src="Channels.js"></script>
<script type="text/javascript" src="json_sans_eval.js"></script>
</div>
</body>
</html>