zross/index.html

## index.html
<!DOCTYPE html>
<html>

<!-- A note: if you're not seeing the elements in the custom
  infowindow look at the cartodb dashboard and make sure they're
  turned on
-->

  <head>
    <title>HTML5</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=650, user-scalable=yes">


    <!--[if IE]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->


<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" />

<style>

  html, body {
        height: 100%;
        margin: 0;
      }

#map{

  height:100%;
}

</style>


   <script type="infowindow/html" id="systeminfo">
      <div class="cartodb-popup">
        <a href="#close" class="cartodb-popup-close-button close">x</a>

         <div class="cartodb-popup-content-wrapper">
           <div class="cartodb-popup-content">
             XXXX
             <!-- content.data contains the field info -->
             <h3>{{content.data.fips}}</h3>
             <h3>{{content.data.name}}</h3>
           </div>
         </div>
         <div class="cartodb-popup-tip-container"></div>
      </div>
    </script>


<script>

  var map;


  $(document).ready(function(){

     var mapOptions = {
        zoom: 6,
        center: new google.maps.LatLng(37.35, -120.015),
        mapTypeId: google.maps.MapTypeId.ROADMAP
        //mapTypeId: google.maps.MapTypeId.TERRAIN
    };

    map = new google.maps.Map($('#map')[0], mapOptions);


    // ----- Add the layer with the county information


    cartodb.createLayer(map, 'http://cehtp.cartodb.com/api/v2/viz/countyshp/viz.json', {
        query: 'SELECT * FROM {{table_name}}'// if you remove this the query applied in the editor will be used

    })
        .on('done', function(layer) {


            map.overlayMapTypes.setAt(0, layer);
            var sublayer = layer.getSubLayer(0);


             sublayer.infowindow.set('template', $('#systeminfo').html());


        });


  });//end document ready


</script>

  </head>
  <body>
    <div id="map">

    </div>
  </body>


</html>
	<!DOCTYPE html>
	<html>

	<!-- A note: if you're not seeing the elements in the custom
	infowindow look at the cartodb dashboard and make sure they're
	turned on
	-->

	<head>
	<title>HTML5</title>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=650, user-scalable=yes">


	<!--[if IE]>
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->


	<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false">
	</script>
	<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>
	<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" />

	<style>

	html, body {
	height: 100%;
	margin: 0;
	}

	#map{

	height:100%;
	}

	</style>


	<script type="infowindow/html" id="systeminfo">
	<div class="cartodb-popup">
	<a href="#close" class="cartodb-popup-close-button close">x</a>

	<div class="cartodb-popup-content-wrapper">
	<div class="cartodb-popup-content">
	XXXX
	<!-- content.data contains the field info -->
	<h3>{{content.data.fips}}</h3>
	<h3>{{content.data.name}}</h3>
	</div>
	</div>
	<div class="cartodb-popup-tip-container"></div>
	</div>
	</script>


	<script>

	var map;



	$(document).ready(function(){

	var mapOptions = {
	zoom: 6,
	center: new google.maps.LatLng(37.35, -120.015),
	mapTypeId: google.maps.MapTypeId.ROADMAP
	//mapTypeId: google.maps.MapTypeId.TERRAIN
	};

	map = new google.maps.Map($('#map')[0], mapOptions);


	// ----- Add the layer with the county information


	cartodb.createLayer(map, 'http://cehtp.cartodb.com/api/v2/viz/countyshp/viz.json', {
	query: 'SELECT * FROM {{table_name}}'// if you remove this the query applied in the editor will be used

	})
	.on('done', function(layer) {


	map.overlayMapTypes.setAt(0, layer);
	var sublayer = layer.getSubLayer(0);


	sublayer.infowindow.set('template', $('#systeminfo').html());


	});



	});//end document ready


	</script>

	</head>
	<body>
	<div id="map">

	</div>
	</body>


	</html>