keathley · August 29, 2015 14:25
diff --git a/gistfile1.js b/gistfile1.js
 <!DOCTYPE html>
 <html>
 <head>
  <title>Turnt</title>
  <link href="index.css" rel="stylesheet" type="text/css"/>
  <link href="http://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet" type="text/css">
  <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
  <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
 </head>
 <body>
  <section id="input">
    <div class="content">
      <header>
        <h1>Room</h1>
        <h2>Turn it up or down?</h2>
      </header>
      <div class="arrow-container">
        <svg id="up-arrow" width="160" height="100" viewBox="0 0 160 100">
          <polygon points="0,100 160,100 80,0"/>
        </svg>
        <div id="room-opinion">
          0
        </div>
        <svg id="down-arrow" width="160" height="100" viewBox="0 0 160 100">
          <polygon points="0,0 160,0 80,100"/>
        </svg>
      </div>
    </div>
  </section>
  <section id="graph">
  </section>
  <footer>
    <small>
      Room is an app for hyperlocal upvoting blah blah blah. Fork us on
      <a href="https://github.com/jake-sl/room" target="_blank">Github</a>.
    </small>
  </footer>
 </body>
 <script>
 $(function() {

  var time = jQuery.parseJSON(
    jQuery.ajax({
      url: "http://currentmillis.com/api/millis-since-unix-epoch.php",
      async: false,
      dataType: 'json'
    }).responseText
  );

  setInterval(function() { time += 200 }, 200);

  var myDataRef = new Firebase('https://goodenoughroom.firebaseio.com/')
    , _votes    = []

  Array.observe( _votes, update )

  myDataRef
    .orderByChild('time')
    .startAt(time-180000)
    .on('child_added', addNewData)

  document.getElementById('up-arrow').onclick = function() {
    myDataRef.push({ 'vote': 1, 'time': time});
  };

  document.getElementById('down-arrow').onclick = function() {
    myDataRef.push({ 'vote': 0, 'time': time});
  };

  function addNewData(snapshot)  {
    var voteJSON = snapshot.val()
      , voteScore = parseInt(voteJSON.vote, 10)

    _votes.push( voteScore )
  }

  function update() {
    var avg      = average( _votes )
      , weighted = weight( avg )

    updateView( weighted )
  }

  function average(votes) {
    var total = votes.reduce( function(a, b) { return a + b } )
      , avg = total / votes.length

    return avg
  }

  function weight(avg) {
    return (avg * 100)|0
  }

  function updateView(avg) {
    $('#room-opinion').html( avg )
  }
 })
 </script>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Turnt</title>
	<link href="index.css" rel="stylesheet" type="text/css"/>
	<link href="http://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet" type="text/css">
	<script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
	<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
	</head>
	<body>
	<section id="input">
	<div class="content">
	<header>
	<h1>Room</h1>
	<h2>Turn it up or down?</h2>
	</header>
	<div class="arrow-container">
	<svg id="up-arrow" width="160" height="100" viewBox="0 0 160 100">
	<polygon points="0,100 160,100 80,0"/>
	</svg>
	<div id="room-opinion">
	0
	</div>
	<svg id="down-arrow" width="160" height="100" viewBox="0 0 160 100">
	<polygon points="0,0 160,0 80,100"/>
	</svg>
	</div>
	</div>
	</section>
	<section id="graph">
	</section>
	<footer>
	<small>
	Room is an app for hyperlocal upvoting blah blah blah. Fork us on
	<a href="https://github.com/jake-sl/room" target="_blank">Github</a>.
	</small>
	</footer>
	</body>
	<script>
	$(function() {

	var time = jQuery.parseJSON(
	jQuery.ajax({
	url: "http://currentmillis.com/api/millis-since-unix-epoch.php",
	async: false,
	dataType: 'json'
	}).responseText
	);

	setInterval(function() { time += 200 }, 200);

	var myDataRef = new Firebase('https://goodenoughroom.firebaseio.com/')
	, _votes = []

	Array.observe( _votes, update )

	myDataRef
	.orderByChild('time')
	.startAt(time-180000)
	.on('child_added', addNewData)

	document.getElementById('up-arrow').onclick = function() {
	myDataRef.push({ 'vote': 1, 'time': time});
	};

	document.getElementById('down-arrow').onclick = function() {
	myDataRef.push({ 'vote': 0, 'time': time});
	};

	function addNewData(snapshot) {
	var voteJSON = snapshot.val()
	, voteScore = parseInt(voteJSON.vote, 10)

	_votes.push( voteScore )
	}

	function update() {
	var avg = average( _votes )
	, weighted = weight( avg )

	updateView( weighted )
	}

	function average(votes) {
	var total = votes.reduce( function(a, b) { return a + b } )
	, avg = total / votes.length

	return avg
	}

	function weight(avg) {
	return (avg * 100)\|0
	}

	function updateView(avg) {
	$('#room-opinion').html( avg )
	}
	})
	</script>
	</html>