Permalink
Browse files

Added basic face highlighting in HTML view

  • Loading branch information...
1 parent 798c503 commit f97c40d6b3c69f43eb1f0ce02037bdacd2291323 @nikhilm committed Dec 6, 2010
Showing with 46 additions and 0 deletions.
  1. +11 −0 view.css
  2. +22 −0 view.html
  3. +13 −0 view.js
View
11 view.css
@@ -0,0 +1,11 @@
+div.face {
+ position: absolute;
+ border: solid 2px white;
+}
+
+div.face:hover {
+ border: solid 2px red;
+}
+
+div.tooltip {
+}
View
22 view.html
@@ -0,0 +1,22 @@
+<html>
+<head>
+
+ <title>MugShot</title>
+
+<link rel="stylesheet" href="/view.css" />
+</head>
+<body>
+
+ <img src="<%= image_url %>" id="the-image" />
+
+<script language="javascript" src="/deps/jquery-1.4.2.js" > </script>
+<script language="javascript" src="/view.js" > </script>
+<script language="javascript">
+$(function() {
+ var faces = <%= faces %>;
+ mark(faces);
+})
+</script>
+
+</body>
+</html>
View
13 view.js
@@ -0,0 +1,13 @@
+function mark(faces) {
+ for( var i = 0; i < faces.length; i++ ) {
+ var face = faces[i];
+ var div = $('<div class="face">');
+ $('body').append(div);
+ $(div).css({
+ left: face.x,
+ top: face.y,
+ width: face.width,
+ height: face.height
+ });
+ }
+}

0 comments on commit f97c40d

Please sign in to comment.