ImageGrid/ui/gallery.html

<!--
-->

<link rel="stylesheet" href="gallery.css">
<script src="jquery.js"></script>

<script src="jquery.touchSwipe.js"></script>
<!-- script src="jquery.wipetouch.js"></script-->
<!-- XXX this does not work on android... --> 
<!-- script src="jquery.gestures.js"></script-->
<!-- XXX need to figure out how to disable all the bling -->
<!-- script src="jquery.mobile.js"></script-->

<!-- XXX STUB -->
<script src="images.js"></script>
<script src="gallery-prototype.js"></script>

<!--script src="gallery.js"></script-->

<script>
</script>

<style>
</style>

<div class="viewer">
	<div class="controller">
		<div class="demote">^</div>
		<div class="prev-image">&lt;</div>
		<div class="promote">v</div>
		<div class="toggle-single">[ ]</div>
	</div>
	<div class="container">
		<div class="field">
			<div class="ribbon">
				<!--div class="image mock-image"></div>
				<div class="image mock-image"></div>
				<div class="image mock-image"></div-->
			</div>
		</div>
	</div>
	<div class="controller">
		<div class="demote">^</div>
		<div class="next-image">&gt;</div>
		<div class="promote">v</div>
		<div class="toggle-wide">+/-</div>
	</div>
</div>

<div class="demo-buttons">

	<button onclick="firstImage()">first (home)</button>
	<button onclick="prevImage()">prev (left)</button>
	<button onclick="nextImage()">next (right)</button>
	<button onclick="lastImage()">last (end)</button>

	<br><br>

	<button onclick="showSingle()">single</button>
	<button onclick="showRibbon()">ribbon</button>
	<button onclick="toggleRibbonView()">toggle ribbon view (f)</button>

	<br><br>

	<button onclick="toggleWideView()">toggle wide view</button>

	<br><br>

	<button onclick="createRibbonAbove()" disabled>create ribbon above (helper)</button><br>
	<button onclick="createRibbonBelow()" disabled>create ribbon below (helper)</button>

	<br><br>

	<button onclick="mergeRibbonsUp()">merge ribbons up</button><br>
	<button onclick="mergeRibbonsDown()">merge ribbons down</button>

	<br><br>

	<button onclick="demoteImage()">demote image (shift-up)</button><br>
	<button onclick="promoteImage()">promote image (shift-down)</button><br>
	NOTE: ctrl-shift-up / ctrl-shift-down will demote / promote an image to a new empty ribbon (the default if no ribbon exists)

	<br><br>

	<button onclick="focusAboveRibbon()">focus above ribbon (up)</button><br>
	<button onclick="focusBelowRibbon()">focus below ribbon (down)</button>

</div>

<!-- vim:set ts=4 sw=4 nowrap : -->