Permalink
Browse files

final application working standalone

  • Loading branch information...
pgte committed Dec 4, 2009
1 parent f74fb80 commit c99c498655fe05ca61b3ac3bf984f9fba1583fd2
@@ -0,0 +1,42 @@
+$(document).ready(function() {
+ $('#show_message').click(function() { $('#message').slideDown(); });
+ $('#hide_message').click(function() { $('#message').slideUp(); });
+
+ // Canvas paint
+
+ canvas = document.getElementById('painthere');
+ canvas_ctx = canvas.getContext('2d');
+ canvas_ctx.fillStyle = 'black';
+ canvas_ctx.beginPath();
+
+ var x;
+ var y;
+
+ canvas.onmousedown = function(e) {
+ x = e.clientX;
+ y = e.clientY;
+ canvas_ctx.moveTo(x, y);
+ }
+
+ canvas.onmouseup = function(e) {
+ x = null;
+ y = null;
+ }
+
+ canvas.onmousemove = function(e) {
+ if (x == null || y == null) {
+ return;
+ }
+ x = e.clientX;
+ y = e.clientY;
+ x += -canvas.offsetLeft + document.body.scrollLeft
+ + document.documentElement.scrollLeft;
+ y += -canvas.offsetTop + document.body.scrollTop
+ + document.documentElement.scrollTop;
+ canvas_ctx.lineTo(x, y);
+ canvas_ctx.stroke();
+ canvas_ctx.moveTo(x, y);
+ }
+
+
+});

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
@@ -0,0 +1,11 @@
+#message {
+ padding: 1em;
+ background-color: grey;
+ border: 1px solid black;
+}
+canvas#painthere {
+ width: 300px;
+ height: 300px;
+ padding: 0;
+ border: 1px solid black;
+}
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Cyclops Demo Final</title>
+ <meta name="description" content="" />
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8">
+ <link rel="stylesheet" href="../assets/stylesheets/master.css" type="text/css" media="screen" charset="utf-8">
+ <link rel="stylesheet" href="../assets/stylesheets/jquery.jgrowl.css" type="text/css" media="screen" charset="utf-8">
+</head>
+<body>
+ <h1>Cyclops Demo</h1>
+ <h2>Message:</h2>
+ <div id="message" style="display:none"><h3>Hello World!</h3></div>
+ <button id="show_message">Show message</button>
+ <button id="hide_message">Hide message</button>
+ <h2>Paint here:</h2>
+ <canvas width="300" height="300" id="painthere"></canvas>
+ <footer>
+ </footer>
+ <img src="../assets/images/cursor.png" id="mouse" style="position:absolute" />
+ <script src="../assets/javascripts/jquery.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/final.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/json2.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/pubsub.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/event.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/cymain.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/cynotify.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/jquery.hotkeys.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../assets/javascripts/jquery.jgrowl.js" type="text/javascript" charset="utf-8"></script>
+
+</body>
+</html>
@@ -0,0 +1,77 @@
+<html>
+<style>
+#board {
+ width: 100%;
+ height: 100px;
+ background-color: green;
+}
+#board:hover {
+ background-color: yellow;
+}
+</style>
+<body>
+ <div id="board" style="" onmouseover="console.info();"></div>
+ <h1>Cyclops Playbacker</h1>
+ <h2>Enter events:</h2>
+ <form action="/activity?id=__ID__" method="POST">
+ <p>
+ <label for="events">Events JSON:</label><br />
+ <textarea id="events" name="events"></textarea>
+ </p>
+ <p>
+ <input type="submit" name="process" id="process" value="Trigger"/>
+ </p>
+ </form>
+ <script src="../assets/javascripts/jquery.js" type="text/javascript" charset="utf-8" ></script>
+ <script src="../assets/javascripts/json2.js" type="text/javascript" charset="utf-8" ></script>
+ <script type="text/javascript">
+ $(document).ready(function() {
+ $('#board').mouseover(function(ev) {
+ console.info("clientX:"+ev.clientX);
+ console.info("clientY:"+ev.clientY);
+ });
+ $('form').submit(function() {
+ var jsonLines = $('#events').val();
+ var jsonLineArray = jsonLines.split("\r|\n|\r\n");
+ var jqDoc = $(document);
+ for(lineNumber in jsonLineArray) {
+ line = jsonLineArray[lineNumber];
+ console.info('parsing '+ line);
+ try {
+ var event_object = JSON.parse(line);
+ console.info('Object = '+event_object);
+ //jqDoc.trigger(event_object.type, event_object.data);
+ //console.info("X:"+event_object.data.x);
+ //console.info("Y:"+event_object.data.y);
+
+ var event = document.createEvent("MouseEvents");
+ event.initMouseEvent(
+ event_object.type,
+ true,
+ true,
+ window,
+ 0,
+ 0,
+ 0,
+ 0,
+ 0,
+ false,
+ false,
+ false,
+ false,
+ 0,
+ null
+ );
+ canceled = !document.elementFromPoint(event_object.data.x, event_object.data.y).dispatchEvent(event);
+ if(canceled)
+ console.error('event canceled');
+ } catch(e) {
+ console.error(e);
+ }
+ }
+ return false;
+ });
+ });
+ </script>
+ </body>
+</html>
View
@@ -1,6 +1,6 @@
<html>
<head>
- <script src="../../assets/javascripts/jquery-1.3.2.min.js" type="text/javascript" ></script>
+ <script src="../../assets/javascripts/jquery.js" type="text/javascript" ></script>
</head>
<body>
<h1>Cyclops Publisher</h1>
@@ -1,6 +1,6 @@
<html>
<head>
- <script src="../../assets/javascripts/jquery-1.3.2.min.js" type="text/javascript" ></script>
+ <script src="../../assets/javascripts/jquery.js" type="text/javascript" ></script>
</head>
<body>
<h1>Cyclops Subscriber</h1>

0 comments on commit c99c498

Please sign in to comment.