Skip to content

Instantly share code, notes, and snippets.

@andrewn
Created July 5, 2013 08:35
Show Gist options
  • Save andrewn/5932974 to your computer and use it in GitHub Desktop.
Save andrewn/5932974 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Remote</title>
<style type="text/css">
body {
font-family: sans-serif;
font-size: 4em;
}
#wrapper {
margin: ;
}
</style>
</head>
<body>
<div id="wrapper">
<h1>Press button...</h1>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
var mappings = {
'117' : 'UP',
'100' : 'DOWN',
'108' : 'LEFT',
'114' : 'RIGHT',
'111' : 'OK',
'98' : 'BACK',
'49' : 'RED',
'50' : 'GREEN',
'51' : 'YELLOW',
'52' : 'BLUE'
};
var initialMsg = $('h1').text(),
el = $('h1');
$(document).on('keypress', function (evt) {
var button = mappings[evt.which];
fadeTo(el, button);
});
function fadeTo(el, msg) {
el.fadeOut({
duration:200,
complete:function () {
el.text(msg);
el.fadeIn(200);
}
});
};
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment