pamelafox/phonegap.html

## phonegap.html
<!doctype html>
<html>
 <head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <base target="_blank">
  <title>eatdifferent</title>
  <script>
  var ED = ED || {};
  ED.VERSION = '36'
  ED.timing = (function() {
    var timingOn  = true;
    var timingDiv = null;

    var timedEvents = [];
    function timeEvent(name, showEvents) {
      if (!timingOn) return;
      timedEvents.push({'name': name || 'unnamed', time: Date.now()});
      console.log('Adding timed event: ' + name);

      if (timedEvents.length == 1) {
        window.addEventListener('load', function() {
          timingDiv = document.getElementById('mobile-timing');
          timingDiv.style.display = 'block';
          var eventsButton = document.getElementById('mobile-timer-events-button');
          eventsButton.style.display = 'inline';
          eventsButton.onclick = function() {
            showTimedEvents();
          };
        });
      }
    }

    function showTimedEvents() {
      if (!timingOn) return;
      var timeText = '';
      var timeHtml = '<table>';
      var totalDiff = 0;
      for (var i = 0; i < timedEvents.length; i++) {
        var timedEvent = timedEvents[i];
        timeText += timedEvent.name + ': ' + timedEvent.time;
        var diff = '';
        if (i > 0) {
          diff = (timedEvent.time - timedEvents[i-1].time);
          timeText += ' (' + diff + 'ms elapsed)';
          totalDiff += diff;
        }
        timeHtml += '<tr><td>' + timedEvent.name + '<td>' + diff;
        timeText += '\n';
      }
      timeHtml += '</table><br>Total diff:' + totalDiff;

      if (timingDiv) {
        document.getElementById('mobile-timer-events').innerHTML = timeHtml;
      }
      console.log(timeText);
    }


    var timerIncrement = 100;
    var totalTime = 0;
    var timerInterval;
    function incrementTime() {
      totalTime += timerIncrement;
      if (timingDiv) {
        document.getElementById('mobile-timer-text').innerHTML = (totalTime/1000);
      }
    }

    function startTimer() {
      if (!timingOn) return;
      timerInterval = window.setInterval(incrementTime, timerIncrement);
      window.addEventListener('load', function() {
        timingDiv = document.getElementById('mobile-timing');
        timingDiv.style.display = 'block';

        var timerButton = document.getElementById('mobile-timer-stop');
        timerButton.style.display = 'inline';
        timerButton.removeAttribute('disabled');
        timerButton.onclick = function() {
          timeEvent('Stop button clicked');
          window.clearInterval(timerInterval)
        };
      });
    }


    return {
      startTimer: startTimer,
      timeEvent: timeEvent,
      showTimedEvents: showTimedEvents
    }
  })();
  </script>
  <script>

  document.addEventListener("DOMContentLoaded", function() {
    ED.timing.timeEvent('After DOMContentLoaded');
  });
  </script>
   </head>
 <body>

   <!-- DEBUG -->
  <div id="mobile-timing" style="display:none">
    <button id="mobile-timer-stop" class="btn btn-large error" disabled style="display:none">STOP</button>
    <span id="mobile-timer-text" style="font-size: 24px; font-weight: bold;"></span>

    <button id="mobile-timer-events-button" class="btn btn-large">SHOW EVENTS</button>
    <div id="mobile-timer-events"></div>
  </div>
  <!-- /DEBUG -->

<script src="js/libs/phonegap-1.2.0.js"></script>
<script>
  ED.timing.timeEvent('Before localStorage test');
  // 65
  // Without: DOMContentLoaded->deviceready: 195
  // With: DOMContentLoaded->deviceready: 138
  var tests = {};
  tests['localstorage'] = function() {
    var mod = '{test: "totallyatestkey"}';
    try {
        localStorage.removeItem(mod);
        localStorage.setItem(mod, JSON.stringify(mod));
        localStorage.removeItem(mod);
        return true;
    } catch(e) {
        return false;
    }
  };
  var supported = tests['localstorage']();
  ED.timing.timeEvent('After localStorage Test ' + supported);

document.addEventListener('deviceready', function() {
  ED.timing.timeEvent('After deviceready event');
}, false);
</script>

</body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<base target="_blank">
	<title>eatdifferent</title>
	<script>
	var ED = ED \|\| {};
	ED.VERSION = '36'
	ED.timing = (function() {
	var timingOn = true;
	var timingDiv = null;

	var timedEvents = [];
	function timeEvent(name, showEvents) {
	if (!timingOn) return;
	timedEvents.push({'name': name \|\| 'unnamed', time: Date.now()});
	console.log('Adding timed event: ' + name);

	if (timedEvents.length == 1) {
	window.addEventListener('load', function() {
	timingDiv = document.getElementById('mobile-timing');
	timingDiv.style.display = 'block';
	var eventsButton = document.getElementById('mobile-timer-events-button');
	eventsButton.style.display = 'inline';
	eventsButton.onclick = function() {
	showTimedEvents();
	};
	});
	}
	}

	function showTimedEvents() {
	if (!timingOn) return;
	var timeText = '';
	var timeHtml = '<table>';
	var totalDiff = 0;
	for (var i = 0; i < timedEvents.length; i++) {
	var timedEvent = timedEvents[i];
	timeText += timedEvent.name + ': ' + timedEvent.time;
	var diff = '';
	if (i > 0) {
	diff = (timedEvent.time - timedEvents[i-1].time);
	timeText += ' (' + diff + 'ms elapsed)';
	totalDiff += diff;
	}
	timeHtml += '<tr><td>' + timedEvent.name + '<td>' + diff;
	timeText += '\n';
	}
	timeHtml += '</table><br>Total diff:' + totalDiff;

	if (timingDiv) {
	document.getElementById('mobile-timer-events').innerHTML = timeHtml;
	}
	console.log(timeText);
	}


	var timerIncrement = 100;
	var totalTime = 0;
	var timerInterval;
	function incrementTime() {
	totalTime += timerIncrement;
	if (timingDiv) {
	document.getElementById('mobile-timer-text').innerHTML = (totalTime/1000);
	}
	}

	function startTimer() {
	if (!timingOn) return;
	timerInterval = window.setInterval(incrementTime, timerIncrement);
	window.addEventListener('load', function() {
	timingDiv = document.getElementById('mobile-timing');
	timingDiv.style.display = 'block';

	var timerButton = document.getElementById('mobile-timer-stop');
	timerButton.style.display = 'inline';
	timerButton.removeAttribute('disabled');
	timerButton.onclick = function() {
	timeEvent('Stop button clicked');
	window.clearInterval(timerInterval)
	};
	});
	}


	return {
	startTimer: startTimer,
	timeEvent: timeEvent,
	showTimedEvents: showTimedEvents
	}
	})();
	</script>
	<script>

	document.addEventListener("DOMContentLoaded", function() {
	ED.timing.timeEvent('After DOMContentLoaded');
	});
	</script>
	</head>
	<body>

	<!-- DEBUG -->
	<div id="mobile-timing" style="display:none">
	<button id="mobile-timer-stop" class="btn btn-large error" disabled style="display:none">STOP</button>
	<span id="mobile-timer-text" style="font-size: 24px; font-weight: bold;"></span>

	<button id="mobile-timer-events-button" class="btn btn-large">SHOW EVENTS</button>
	<div id="mobile-timer-events"></div>
	</div>
	<!-- /DEBUG -->

	<script src="js/libs/phonegap-1.2.0.js"></script>
	<script>
	ED.timing.timeEvent('Before localStorage test');
	// 65
	// Without: DOMContentLoaded->deviceready: 195
	// With: DOMContentLoaded->deviceready: 138
	var tests = {};
	tests['localstorage'] = function() {
	var mod = '{test: "totallyatestkey"}';
	try {
	localStorage.removeItem(mod);
	localStorage.setItem(mod, JSON.stringify(mod));
	localStorage.removeItem(mod);
	return true;
	} catch(e) {
	return false;
	}
	};
	var supported = tests['localstorage']();
	ED.timing.timeEvent('After localStorage Test ' + supported);

	document.addEventListener('deviceready', function() {
	ED.timing.timeEvent('After deviceready event');
	}, false);
	</script>

	</body>
	</html>