Skip to content

Instantly share code, notes, and snippets.

@abernier

abernier/index.html

Created April 21, 2012 01:05
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save abernier/2433037 to your computer and use it in GitHub Desktop.
Save abernier/2433037 to your computer and use it in GitHub Desktop.
Download ZIP
momentum
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title></title>
<style>
html, body {height:100%;}
body {
background-color:#269;
background-image: -webkit-linear-gradient(white 2px, transparent 2px),
-webkit-linear-gradient(0, white 2px, transparent 2px),
-webkit-linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
-webkit-linear-gradient(0, rgba(255,255,255,.3) 1px, transparent 1px);
background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px
}
</style>
<script src="http://jashkenas.github.com/coffee-script/extras/coffee-script.js"></script>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<!--<script src="https://raw.github.com/jcoglan/sylvester/master/src/vector.js"></script>-->
</head>
<body>
<script src="mouse.coffee" type="text/coffeescript"></script>
</body>
</html>
Raw
mouse.coffee
class Loop
constructor: (@f = (->)) ->
start: (time = (new Date).getTime()) =>
@f [time]...
@id = requestAnimFrame(@start)
stop: =>
if @id?
cancelRequestAnimFrame(@id)
delete @['id']
mouseSpeed = undefined
$('body').mousedown((e) ->
M = _M = [e.pageX - @offsetLeft, e.pageY - @offsetTop]
t = _t = (new Date).getTime()
mouseSpeed = new Loop((time) ->
_t = t
t = time
console.log [(M[0] - _M[0]) / (t - _t), (M[1] - _M[1]) / (t - _t)]
_M = M
)
mouseSpeed.start()
$(@).on 'mousemove', (e) ->
M = [e.pageX - @offsetLeft, e.pageY - @offsetTop]
).mouseup(->
mouseSpeed.stop()
$(@).off 'mousemove'
)
window.requestAnimFrame = (->
#
# requestAnim shim layer by Paul Irish
#
# http://paulirish.com/2011/requestanimationframe-for-smart-animating/
#
window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
(callback, element) ->
window.setTimeout(callback, 1000 / 60)
)()
window.cancelRequestAnimFrame = (->
#
# cancelRequestAnim shim layer by Jerome Etienne
#
# http://notes.jetienne.com/2011/05/18/cancelRequestAnimFrame-for-paul-irish-requestAnimFrame.html
#
window.cancelAnimationFrame ||
window.webkitCancelRequestAnimationFrame ||
window.mozCancelRequestAnimationFrame ||
window.oCancelRequestAnimationFrame ||
window.msCancelRequestAnimationFrame ||
clearTimeout
)()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment