Mercurial > hg > nodescore
comparison www/p/plugin/speakernotes/notes.html @ 42:49c94f63b8b0
css for nexus 7 and associated files- archive m.a added - remove later
| author | tzara <rc-web@kiben.net> |
|---|---|
| date | Tue, 04 Sep 2012 07:25:49 +0000 |
| parents | |
| children |
comparison
equal
deleted
inserted
replaced
| 41:56767c69b7c4 | 42:49c94f63b8b0 |
|---|---|
| 1 <!doctype html> | |
| 2 <html lang="en"> | |
| 3 <head> | |
| 4 <meta charset="utf-8"> | |
| 5 | |
| 6 <title>reveal.js - Slide Notes</title> | |
| 7 | |
| 8 <style> | |
| 9 body { | |
| 10 font-family: Helvetica; | |
| 11 } | |
| 12 | |
| 13 #notes { | |
| 14 font-size: 24px; | |
| 15 width: 640px; | |
| 16 margin-top: 5px; | |
| 17 } | |
| 18 | |
| 19 #wrap-current-slide { | |
| 20 width: 640px; | |
| 21 height: 512px; | |
| 22 float: left; | |
| 23 overflow: hidden; | |
| 24 } | |
| 25 | |
| 26 #current-slide { | |
| 27 width: 1280px; | |
| 28 height: 1024px; | |
| 29 border: none; | |
| 30 -moz-transform: scale(0.5); | |
| 31 -moz-transform-origin: 0 0; | |
| 32 -o-transform: scale(0.5); | |
| 33 -o-transform-origin: 0 0; | |
| 34 -webkit-transform: scale(0.5); | |
| 35 -webkit-transform-origin: 0 0; | |
| 36 } | |
| 37 | |
| 38 #wrap-next-slide { | |
| 39 width: 320px; | |
| 40 height: 256px; | |
| 41 float: left; | |
| 42 margin: 0 0 0 10px; | |
| 43 overflow: hidden; | |
| 44 } | |
| 45 | |
| 46 #next-slide { | |
| 47 width: 1280px; | |
| 48 height: 1024px; | |
| 49 border: none; | |
| 50 -moz-transform: scale(0.25); | |
| 51 -moz-transform-origin: 0 0; | |
| 52 -o-transform: scale(0.25); | |
| 53 -o-transform-origin: 0 0; | |
| 54 -webkit-transform: scale(0.25); | |
| 55 -webkit-transform-origin: 0 0; | |
| 56 } | |
| 57 | |
| 58 .slides { | |
| 59 position: relative; | |
| 60 margin-bottom: 10px; | |
| 61 border: 1px solid black; | |
| 62 border-radius: 2px; | |
| 63 background: rgb(28, 30, 32); | |
| 64 } | |
| 65 | |
| 66 .slides span { | |
| 67 position: absolute; | |
| 68 top: 3px; | |
| 69 left: 3px; | |
| 70 font-weight: bold; | |
| 71 font-size: 14px; | |
| 72 color: rgba( 255, 255, 255, 0.9 ); | |
| 73 } | |
| 74 </style> | |
| 75 </head> | |
| 76 | |
| 77 <body> | |
| 78 | |
| 79 <div id="wrap-current-slide" class="slides"> | |
| 80 <iframe src="/?receiver" width="1280" height="1024" id="current-slide"></iframe> | |
| 81 </div> | |
| 82 | |
| 83 <div id="wrap-next-slide" class="slides"> | |
| 84 <iframe src="/?receiver" width="640" height="512" id="next-slide"></iframe> | |
| 85 <span>UPCOMING:</span> | |
| 86 </div> | |
| 87 <div id="notes"></div> | |
| 88 | |
| 89 <script src="/socket.io/socket.io.js"></script> | |
| 90 | |
| 91 <script> | |
| 92 var socketId = '{{socketId}}'; | |
| 93 var socket = io.connect(window.location.origin); | |
| 94 var notes = document.getElementById('notes'); | |
| 95 var currentSlide = document.getElementById('current-slide'); | |
| 96 var nextSlide = document.getElementById('next-slide'); | |
| 97 | |
| 98 socket.on('slidedata', function(data) { | |
| 99 // ignore data from sockets that aren't ours | |
| 100 if (data.socketId !== socketId) { return; } | |
| 101 | |
| 102 notes.innerHTML = data.notes; | |
| 103 currentSlide.contentWindow.Reveal.navigateTo(data.indexh, data.indexv); | |
| 104 nextSlide.contentWindow.Reveal.navigateTo(data.nextindexh, data.nextindexv); | |
| 105 }); | |
| 106 </script> | |
| 107 | |
| 108 </body> | |
| 109 </html> |