<?php include("includes/head.php");?>
<?php 
$sh_id = isset($_GET['shid'])?$_GET['shid']:'';
if(!empty($sh_id))
{	
	$selQuery_map_det = "SELECT * FROM ".TBL_MAPPINGS_DETAILS." WHERE `sh_id`='".$sh_id."'";
	$mapdetInfo = $con->getSingleRow($selQuery_map_det);	
}
?>
<!--<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">-->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->

<link rel="stylesheet" type="text/css" href="scripts/raphael/css/styles.css">
<!--<link rel="stylesheet" href="scripts/raphael/css/screen.css">
<link rel="stylesheet" href="scripts/raphael/css/screen_assets.css">-->

<script type="text/javascript" src="scripts/raphael/js/main.js"></script>
<script type="text/javascript" src="scripts/raphael/js/raphael-min.js"></script>
<script type="text/javascript" src="scripts/raphael/js/raphael.js"></script>
<script type="text/javascript" src="scripts/raphael/js/helpers_svg_paths.js"></script>
<script type="text/javascript" src="scripts/raphael/js/javascript-ajax.js"></script>
<script>

var mapsData = {name: '<?php echo isset($mapdetInfo['sh_name'])?$mapdetInfo['sh_name']:'';?>', SHid: <?php echo isset($mapdetInfo['sh_id'])?$mapdetInfo['sh_id']:'';?>,Orientation: '<?php echo isset($mapdetInfo['node_color'])?$mapdetInfo['node_color']:'';?>',Size: <?php echo isset($mapdetInfo['node_size'])?$mapdetInfo['node_size']:'';?>,id: <?php echo isset($mapdetInfo['id'])?$mapdetInfo['id']:'';?>,positionX: <?php echo isset($mapdetInfo['node_positionX'])?$mapdetInfo['node_positionX']:'';?>,positionY: <?php echo isset($mapdetInfo['node_positionY'])?$mapdetInfo['node_positionY']:'';?>,positionX2: <?php echo isset($mapdetInfo['node_positionX2'])?$mapdetInfo['node_positionX2']:'';?>,positionY2: <?php echo isset($mapdetInfo['node_positionY2'])?$mapdetInfo['node_positionY2']:'';?>,width: <?php echo isset($mapdetInfo['node_width'])?$mapdetInfo['node_width']:'';?>,height: <?php echo isset($mapdetInfo['node_height'])?$mapdetInfo['node_height']:'';?>, positionCX: <?php echo isset($mapdetInfo['node_positionCX'])?$mapdetInfo['node_positionCX']:'';?>, positionCY: <?php echo isset($mapdetInfo['node_positionCY'])?$mapdetInfo['node_positionCY']:'';?> };

if(window.jQuery) {
    //$( document ).ready(onJSReady(mapsData));
	
	$( document ).ready(function() {
    	//console.log( "ready!" );
		onJSReady(mapsData);
		//setInterval(generateSVG('<?php echo isset($mapdetInfo['sh_id'])?$mapdetInfo['sh_id']:'';?>'),60000);
		//setTimeout ( generateSVG('<?php echo isset($mapdetInfo['sh_id'])?$mapdetInfo['sh_id']:'';?>'), 60000 );
		
		//generateSVG('<?php echo isset($mapdetInfo['sh_id'])?$mapdetInfo['sh_id']:'';?>');
		
		//$("#generateSVG").trigger('click');
	});
}

/*window.setInterval(function () {
       var date = new Date();
       alert(date.getMinutes());
       if ((date.getMinutes() % 5) == 0) {
	   		
			//generateSVG('<?php //echo isset($mapdetInfo['sh_id'])?$mapdetInfo['sh_id']:'';?>');
			$("#generateSVG").trigger('click');			
       }
   }, 20000);//60000*/

</script>
<style>
.table th {
	background-color:#e7e6e6;
}
</style>
<body>

<div class="admin-dashone-data-table-area mg-b-40" style="min-height:700px;">
  <div class="container">
    <div class="row">
      <div class="col-lg-12">
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">          
          <div class="row">
          
          <div id="canvas"></div>
          
          <input for="clear" id="clear" name="clear" title="Erase all names from the grid" type="button" value="Clear" style="display:none;">
          <input type="hidden" id="shid" value="<?php echo $sh_id;?>">
          <input for="generate" id="generateSVG" name="generateSVG" title="" type="button" value="Generate SVG" onClick="generateSVG('<?php echo $sh_id;?>')">
          	
          </div>            
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Data table area End-->

<script type="text/javascript" src="scripts/raphael/js/jquery_002.js"></script>
<script type="text/javascript" src="scripts/raphael/js/lozad.js"></script>
<script type="text/javascript" src="scripts/raphael/js/modernizr.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicPromoRoundel.js"></script>
<script type="text/javascript" src="scripts/raphael/js/CrossBrowserLoader.js"></script>
<script type="text/javascript" src="scripts/raphael/js/Resizer.js"></script>
<script type="text/javascript" src="scripts/raphael/js/LazyLoader.js"></script>
<script type="text/javascript" src="scripts/raphael/js/GlobalNav.js"></script>
<script type="text/javascript" src="scripts/raphael/js/GlobalSearch.js"></script>
<script type="text/javascript" src="scripts/raphael/js/ComponentAccordion.js"></script>
<script type="text/javascript" src="scripts/raphael/js/ComponentAuthorship.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicPlpMainpageCookieHandler.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicMediaQueryNewsletterPanel.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicCarousel.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicPrint.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicLogoSwitch.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicMediaQueries.js"></script>
<script type="text/javascript" src="scripts/raphael/js/PublicMain.js"></script>
                            
<!-- jquery
		============================================ -->
<script src="js/vendor/jquery-1.11.3.min.js"></script>
<!-- bootstrap JS
		============================================ -->
<script src="js/bootstrap.min.js"></script>

<!-- notification JS
		============================================ -->
<script src="js/Lobibox.js"></script>
<script src="js/notification-active.js"></script>

</body>
<!-- Tree Viewer JS
		============================================ -->
<script src="js/tree-line/jstree.min.js"></script>
<script src="js/tree-line/jstree.active.js"></script>
</html>
