Permalink
Browse files

Face tracking optimization

  • Loading branch information...
1 parent 1d922ee commit d1ae7670e365eba433d8ec81dca46479b52e5080 @burkeholland committed Jun 14, 2012
@@ -5,8 +5,27 @@ define([
'libs/face/face'
], ($, kendo) ->
- face = {}
- buffer =[]
+ face = {
+
+ props:
+ glasses: new Image()
+ horns: new Image()
+ hipster: new Image()
+ sombraro: new Image()
+ backCanvas: {}
+ width: 200
+
+ backCanvas: document.createElement "canvas"
+
+ comp: []
+
+ lastCanvas: {}
+
+ backCtx: {}
+ }
+
+ timeStripsBuffer = []
+ ghostBuffer = []
draw = (canvas, element, effect) ->
texture = canvas.texture(element)
@@ -25,23 +44,24 @@ define([
face.ctx.drawImage(video, 0, 0, video.width, video.height)
face.backCtx.drawImage(video, 0, 0, face.backCanvas.width, face.backCanvas.height)
-
- comp = ccv.detect_objects {
- canvas: face.backCanvas,
- cascade: cascade,
- interval: 4,
- min_neighbors: 1
- }
+
+ if not pub.isPreview
+
+ comp = ccv.detect_objects {
+ canvas: face.backCanvas,
+ cascade: cascade,
+ interval: 4,
+ min_neighbors: 1
+ }
+
+ else [{ x: video.width * .375, y: video.height * .375, width: video.width / 4, height: video.height / 4 }]
trackFace = (video, canvas, prop, xoffset, yoffset, xscaler, yscaler) ->
aspectWidth = video.width / face.backCanvas.width
face.backCanvasheight = (video.height / video.width) * face.backCanvas.width
aspectHeight = video.height / face.backCanvas.height
- w = 4
- m = 4
-
comp = faceCore video, canvas, prop
if comp.length
@@ -50,10 +70,11 @@ define([
for i in face.comp
face.ctx.drawImage prop,
(i.x * aspectWidth) - (xoffset * aspectWidth),
- (i.y * aspectHeight) - (yoffset * aspectHeight)
+ (i.y * aspectHeight) - (yoffset * aspectHeight),
(i.width * aspectWidth) * xscaler,
(i.height * aspectWidth) * yscaler
+
trackHead = (video, canvas, prop, xOffset, yOffset, width, height) ->
aspectWidth = video.width / face.backCanvas.width
@@ -74,31 +95,21 @@ define([
pub =
+ isPreview: true
+
clearBuffer: ->
- buffer = []
+ timeStripsBuffer = []
+ ghostBuffer = []
init: ->
- face.backCanvas = document.createElement "canvas"
- face.backCanvas.width = 200
-
- face.comp = []
-
- face.lastCanvas = {}
-
face.backCtx = face.backCanvas.getContext "2d"
- face.props = {}
-
- face.props.glasses = new Image()
face.props.glasses.src = "images/glasses.png"
-
- face.props.horns = new Image()
face.props.horns.src = "images/horns.png"
-
- face.props.hipster = new Image()
face.props.hipster.src = "images/hipster.png"
+ face.props.sombraro.src = "images/sombraro.png"
data: [
@@ -308,12 +319,12 @@ define([
effect = ->
createBuffers = (length) ->
- while buffer.length < length
- buffer.push canvas.texture(element)
+ while timeStripsBuffer.length < length
+ timeStripsBuffer.push canvas.texture(element)
createBuffers(32)
- buffer[frame++ % buffer.length].loadContentsOf(element)
- canvas.timeStrips(buffer, frame)
+ timeStripsBuffer[frame++ % timeStripsBuffer.length].loadContentsOf(element)
+ canvas.timeStrips(timeStripsBuffer, frame)
canvas.matrixWarp([-1, 0, 0, 1], false, true)
draw(canvas, element, effect)
@@ -328,13 +339,13 @@ define([
effect = ->
createBuffers = (length) ->
- while buffer.length < length
- buffer.push canvas.texture(element)
+ while ghostBuffer.length < length
+ ghostBuffer.push canvas.texture(element)
createBuffers(32)
- buffer[frame++ % buffer.length].loadContentsOf(element)
+ ghostBuffer[frame++ % ghostBuffer.length].loadContentsOf(element)
canvas.matrixWarp([1, 0, 0, 1], false, true)
- canvas.blend buffer[frame % buffer.length], .5
+ canvas.blend ghostBuffer[frame % ghostBuffer.length], .5
canvas.matrixWarp([-1, 0, 0, 1], false, true)
draw(canvas, element, effect)
@@ -394,6 +405,14 @@ define([
trackFace video, canvas, face.props.hipster, 0, 0, 1, 2.2
}
+ # {
+ # name: "Sombraro"
+ # kind: "face"
+ # filter: (canvas, video) ->
+
+ # trackFace video, canvas, face.props.sombraro, 75, 25, 4, 2
+ # }
+
]
@@ -63,6 +63,8 @@ define([
$.subscribe("/preview/show", (e) ->
+ effects.isPreview = false
+
effects.clearBuffer()
$.extend(preview, e)
@@ -128,10 +130,7 @@ define([
$mask.fadeIn 50, ->
$mask.fadeOut 900, ->
- if trackingFace
- images.push canvas.toDataURL()
- else
- images.push webgl.toDataURL()
+ currentCanvas.toDataURL()
if photoNumber > 0
@@ -65,6 +65,7 @@ define([
$container.kendoStop(true).kendoAnimate({ effects: "zoomIn fadeIn", show: true, duration: 500, complete: ->
$("footer").kendoStop(true).kendoAnimate({ effects: "fadeIn", show: true, duration: 200 })
paused = false
+ effects.isPreview = true
})
)
View
BIN public/images/Sombraro.png 100755 → 100644
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

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

Oops, something went wrong.
@@ -45,6 +45,7 @@
$preview.append(canvas);
$preview.append(webgl);
$.subscribe("/preview/show", function(e) {
+ effects.isPreview = false;
effects.clearBuffer();
$.extend(preview, e);
if (preview.kind === "face") {
@@ -124,11 +125,7 @@
--photoNumber;
return $mask.fadeIn(50, function() {
return $mask.fadeOut(900, function() {
- if (trackingFace) {
- images.push(canvas.toDataURL());
- } else {
- images.push(webgl.toDataURL());
- }
+ currentCanvas.toDataURL();
if (photoNumber > 0) {
return $.publish("/camera/countdown", [3, callback]);
} else {

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

Oops, something went wrong.
@@ -39,7 +39,7 @@ body {
#sidebar {
height: 100%;
- position: absolute;
+ position: fixed;
z-index: 100;
top: 0;
left:auto;
@@ -268,6 +268,8 @@ footer img {
#camera .header {
display: none;
+ margin: 20px 0px 0px 20px;
+ text-align: left;
}
#camera .body {
@@ -379,4 +381,16 @@ box-shadow: 10px 10px 5px #888;
border: none;
resize: none;
margin-top: 10px;
+}
+
+.pager {
+ margin-top: 20px;
+}
+
+.pager h3 {
+ display: inline
+}
+
+.pager button {
+ margin-left: 20px;
}
Oops, something went wrong.

0 comments on commit d1ae767

Please sign in to comment.