timnovinger/file.html

## file.html
<!-- ============================================================== -->
<!-- = Code Snippets from Mobile Webkit Development Talk on 11/16 = -->
<!-- ============================================================== -->

<!-- =========================== -->
<!-- = Conditional Stylesheets = -->
<!-- =========================== -->

<link media="only screen and (max-device-width: 480px)" href="small-device.css" type= "text/css" rel="stylesheet">

<!-- ===================== -->
<!-- = User Agent String = -->
<!-- ===================== -->

Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_0 like Mac OS X; en-us) AppleWebKit/525.18.1 (KHTML, like Gecko)
Version/3.1.1 Mobile/XXXXX Safari/525.20

( Where XXXXX = build # )

<!-- ================ -->
<!-- = Set Viewport = -->
<!-- ================ -->

<meta name="viewport" content="width = device-width">

<!-- ============================ -->
<!-- = Turn off scaling ability = -->
<!-- ============================ -->

<meta name="viewport" content="user-scalable=no, width=device-width">

<!-- ======================= -->
<!-- = Set Home Page Icons = -->
<!-- ======================= -->

<link rel="apple-touch-icon" href="index.png">
<link rel="apple-touch-icon-precomposed" href="index.png">

<!-- ===================== -->
<!-- = Set Default Image = -->
<!-- ===================== -->

<link rel="apple-touch-startup-image" href="images/default.png">

<!-- =========================================== -->
<!-- = Remove Browser Chrome - e.g. Fullscreen = -->
<!-- =========================================== -->

<meta name="apple-mobile-web-app-capable" content="yes">

<!-- ============================== -->
<!-- = Change Status Bar to Black = -->
<!-- ============================== -->

<meta name="apple-mobile-web-app-status-bar-style" content="black">

<!-- =================================== -->
<!-- = Disable zoom and pinch gestures = -->
<!-- =================================== -->

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />

<!-- ======================== -->
<!-- = Disable copy & paste = -->
<!-- ======================== -->

<style type="text/css">
  * { -webkit-user-select: none; }
  .turn_on_copy_paste { -webkit-user-select: text; }
</style>

<!-- ========================= -->
<!-- = Disable callout sheet = -->
<!-- ========================= -->

<style type="text/css">
  * { -webkit-touch-callout: none; }
</style>

<!-- =============================== -->
<!-- = Remove link highlight color = -->
<!-- =============================== -->

<style type="text/css">
  * { -webkit-tap-highlight-color: rgba(0,0,0,0); }
</style>

<!-- ============================= -->
<!-- = Prevent default scrolling = -->
<!-- ============================= -->

<script type="text/javascript" charset="utf-8">
  document.body.addEventListener('touchmove', function(e) {
      e.preventDefault();
  });
</script>

<!-- ====================== -->
<!-- = Orientation Change = -->
<!-- ====================== -->

<body onorientationchange="updateOrientation();">

<!-- =============== -->
<!-- = Geolocation = -->
<!-- =============== -->

<script type="text/javascript" charset="utf-8">
  navigator.geolocation.getCurrentPosition(showMap);
  function showMap(position) {
    latitude = position.coords.latitude;
    longitude = position.coords.longitude;
  }
</script>

<!-- =========================================== -->
<!-- = Register for location changes over time = -->
<!-- =========================================== -->

<script type="text/javascript" charset="utf-8">
  // scrollMap() is called when location changes
  var watchId = navigator.geolocation.watchPosition(scrollMap);
  // unregister
  navigator.geolocation.clearWatch(watchId);
</script>
	<!-- ============================================================== -->
	<!-- = Code Snippets from Mobile Webkit Development Talk on 11/16 = -->
	<!-- ============================================================== -->

	<!-- =========================== -->
	<!-- = Conditional Stylesheets = -->
	<!-- =========================== -->

	<link media="only screen and (max-device-width: 480px)" href="small-device.css" type= "text/css" rel="stylesheet">

	<!-- ===================== -->
	<!-- = User Agent String = -->
	<!-- ===================== -->

	Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_0 like Mac OS X; en-us) AppleWebKit/525.18.1 (KHTML, like Gecko)
	Version/3.1.1 Mobile/XXXXX Safari/525.20

	( Where XXXXX = build # )

	<!-- ================ -->
	<!-- = Set Viewport = -->
	<!-- ================ -->

	<meta name="viewport" content="width = device-width">

	<!-- ============================ -->
	<!-- = Turn off scaling ability = -->
	<!-- ============================ -->

	<meta name="viewport" content="user-scalable=no, width=device-width">

	<!-- ======================= -->
	<!-- = Set Home Page Icons = -->
	<!-- ======================= -->

	<link rel="apple-touch-icon" href="index.png">
	<link rel="apple-touch-icon-precomposed" href="index.png">

	<!-- ===================== -->
	<!-- = Set Default Image = -->
	<!-- ===================== -->

	<link rel="apple-touch-startup-image" href="images/default.png">

	<!-- =========================================== -->
	<!-- = Remove Browser Chrome - e.g. Fullscreen = -->
	<!-- =========================================== -->

	<meta name="apple-mobile-web-app-capable" content="yes">

	<!-- ============================== -->
	<!-- = Change Status Bar to Black = -->
	<!-- ============================== -->

	<meta name="apple-mobile-web-app-status-bar-style" content="black">

	<!-- =================================== -->
	<!-- = Disable zoom and pinch gestures = -->
	<!-- =================================== -->

	<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />

	<!-- ======================== -->
	<!-- = Disable copy & paste = -->
	<!-- ======================== -->

	<style type="text/css">
	* { -webkit-user-select: none; }
	.turn_on_copy_paste { -webkit-user-select: text; }
	</style>

	<!-- ========================= -->
	<!-- = Disable callout sheet = -->
	<!-- ========================= -->

	<style type="text/css">
	* { -webkit-touch-callout: none; }
	</style>

	<!-- =============================== -->
	<!-- = Remove link highlight color = -->
	<!-- =============================== -->

	<style type="text/css">
	* { -webkit-tap-highlight-color: rgba(0,0,0,0); }
	</style>

	<!-- ============================= -->
	<!-- = Prevent default scrolling = -->
	<!-- ============================= -->

	<script type="text/javascript" charset="utf-8">
	document.body.addEventListener('touchmove', function(e) {
	e.preventDefault();
	});
	</script>

	<!-- ====================== -->
	<!-- = Orientation Change = -->
	<!-- ====================== -->

	<body onorientationchange="updateOrientation();">

	<!-- =============== -->
	<!-- = Geolocation = -->
	<!-- =============== -->

	<script type="text/javascript" charset="utf-8">
	navigator.geolocation.getCurrentPosition(showMap);
	function showMap(position) {
	latitude = position.coords.latitude;
	longitude = position.coords.longitude;
	}
	</script>

	<!-- =========================================== -->
	<!-- = Register for location changes over time = -->
	<!-- =========================================== -->

	<script type="text/javascript" charset="utf-8">
	// scrollMap() is called when location changes
	var watchId = navigator.geolocation.watchPosition(scrollMap);
	// unregister
	navigator.geolocation.clearWatch(watchId);
	</script>