<?php include("includes/head.php");?>
<style>
.circle-tile {
	margin-bottom: 15px;
	text-align: center;
}
.circle-tile-heading {
	border: 3px solid rgba(255, 255, 255, 0.3);
	border-radius: 100%;
	color: #FFFFFF;
	height: 80px;
	margin: 0 auto -40px;
	position: relative;
	transition: all 0.3s ease-in-out 0s;
	width: 110px;
	text-align:center;
}
.circle-tile-heading .fa {
	line-height: 80px;
}
.circle-tile-content {
	padding-top: 50px;
}
.circle-tile-number {
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	padding: 5px 0 15px;
}
.circle-tile-description {
	text-transform: uppercase;
}
.circle-tile-footer {
	background-color: rgba(0, 0, 0, 0.1);
	color: rgba(255, 255, 255, 0.5);
	display: block;
	padding: 5px;
	transition: all 0.3s ease-in-out 0s;
}
.circle-tile-footer:hover {
	background-color: rgba(0, 0, 0, 0.2);
	color: rgba(255, 255, 255, 0.5);
	text-decoration: none;
}
.circle-tile-heading.dark-blue:hover {
	background-color: #2E4154;
}
.circle-tile-heading.green:hover {
	background-color: #138F77;
}
.circle-tile-heading.orange:hover {
	background-color: #DA8C10;
}
.circle-tile-heading.blue:hover {
	background-color: #2473A6;
}
.circle-tile-heading.red:hover {
	background-color: #CF4435;
}
.circle-tile-heading.purple:hover {
	background-color: #7F3D9B;
}
.tile-img {
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.9);
}
.dark-blue {
	background-color: #34495E;
}
.green {
	background-color: #16A085;
}
.blue {
	background-color: #2980B9;
}
.orange {
	background-color: #F39C12;
}
.red {
	background-color: #E74C3C;
}
.purple {
	background-color: #8E44AD;
}
.dark-gray {
	background-color: #7F8C8D;
}
.gray {
	background-color: #95A5A6;
}
.light-gray {
	background-color: #BDC3C7;
}
.yellow {
	background-color: #F1C40F;
}
.text-dark-blue {
	color: #34495E;
}
.text-green {
	color: #16A085;
}
.text-blue {
	color: #2980B9;
}
.text-orange {
	color: #F39C12;
}
.text-red {
	color: #E74C3C;
}
.text-purple {
	color: #8E44AD;
}
.text-faded {
	color: rgba(255, 255, 255, 0.7);
}
</style>

<?php 
  //--------------- Users Info ----------------							  								  
  $selQry_users = "SELECT * FROM ".TBL_USERS." WHERE group_id !='1' ORDER BY first_name";
  $usersInfo =  $con->getMultiRow($selQry_users, __FILE__,__LINE__);
  $totUsersListings = count($usersInfo);
  //--------------- Departments Info ----------
  $selQry_depts = "SELECT * FROM ".TBL_DEPARTMENTS." ORDER BY name";
  $deptsInfo =  $con->getMultiRow($selQry_depts, __FILE__,__LINE__);
  $totDeptsListings = count($deptsInfo);
  //--------------- Files Info ----------------
  $selQry_files = "SELECT * FROM ".TBL_FILES." ORDER BY name";
  $filesInfo =  $con->getMultiRow($selQry_files, __FILE__,__LINE__);
  $totFilesListings = count($filesInfo);
  //--------------- Stakeholders Info ---------
  $selQry_sh = "SELECT * FROM ".TBL_STAKEHOLDERS." ORDER BY name";
  $shInfo =  $con->getMultiRow($selQry_sh, __FILE__,__LINE__);
  $totSHListings = count($shInfo);
  //-------------------------------------------
?>

<body>
<!--[if lt IE 8]>
        <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
<!-- Header top area start-->
<?php include("includes/header.php");?>
<!-- Header top area end-->
<!-- Menu area start-->
<?php include("includes/navigation.php");?>
<!-- Menu area end-->
<!-- Data table area Start-->
<div class="admin-dashone-data-table-area mg-b-40" style="min-height:500px;">
  <div class="container">
   
    <div class="row" style="margin-top:10px;">
      <div class="col-lg-12">
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="width:106% !important;">
            <div class="tab-content view-mail-ov-mg-t-30">
              <div class="tab-pane fade in zoomInDown shadow-reset active">
                <div class="sparkline8-list shadow-reset">
                  <div class="sparkline8-hd">
                    <div class="main-sparkline8-hd">
                      <h1>Activity</h1>
                      <div class="sparkline8-outline-icon"></div>
                    </div>
                  </div>
                  <div class="sparkline8-graph">
                    <div class="container bootstrap snippet">
                      <div class="row">
                        <div class="col-lg-2 col-sm-4" style="width:22% !important;">
                          <div class="circle-tile "> <a href="configurations.php">
                            <div class="circle-tile-heading green"> <span class="fa-stack"> <span class="fa fa-stack-1x" style="width:45px;">Step-1</span> </span> </div>
                            </a>
                            <div class="circle-tile-content green"> <a href="configurations.php">
                              <div class="circle-tile-description text-faded"> <strong>Configurations/ Setup</strong></div>
                              <div class="circle-tile-number text-faded "></div>
                              <div class="text-faded">
                                <!--<ul>
 									<li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>                                 
                                  </ul>-->
                                Manage groups, users, departments and files.<br><br><br><br>
                              </div>
                              </a> <a class="circle-tile-footer openPopup" data-title="Configurations Help" data-target="sh-setup-help.php" title="Configurations Help" href="#!" style="margin-top:5px;" >Help<i class="fa fa-chevron-circle-right"></i></a> </div>
                          </div>
                        </div>
                        <div class="col-lg-1 col-sm-4" style="width:4% !important; margin-top:136px;"><img src="img/forward.png"></div>
                        <div class="col-lg-2 col-sm-4" style="width:22% !important;">
                          <div class="circle-tile "> 
                            <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0)){?>
                            <a href="sh-identifying.php">
                            <?php }else{?>
                            <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                            <?php }?>
                            
                            <div class="circle-tile-heading dark-blue"> <span class="fa-stack"> <span class="fa fa-stack-1x" style="width:45px;">Step-2</span> </span> </div>
                            </a>
                            <div class="circle-tile-content dark-blue"> 
                            <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0) ){?>
                            <a href="sh-identifying.php">
                            <?php }else{?>
                            <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                            <?php }?>
                            
                              <div class="circle-tile-description text-faded"> <strong>Stakeholders Identifying</strong></div>
                              <div class="circle-tile-number text-faded "></div>
                              <div class="text-faded">
                                <!--<ul>
 									<li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>                                 
                                  </ul>-->
                                Listing relevant groups, organizations, and people<br>
                                <br>
                                <br>
                              </div>
                              </a> <a class="circle-tile-footer openPopup" data-title="Stakeholders Identifying Help" data-target="sh-identifying-help.php" title="Stakeholders Identifying Help" href="#!" style="margin-top:5px;" >Help<i class="fa fa-chevron-circle-right"></i></a> </div>
                          </div>
                        </div>
                        <div class="col-lg-1 col-sm-4" style="width:4% !important; margin-top:136px;"><img src="img/forward.png"></div>
                        <div class="col-lg-2 col-sm-4" style="width:22% !important;">
                          <div class="circle-tile "> 
                            <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0) ){?>
                            <a href="sh-analyzing.php">
                            <?php }else{?>
                            <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                            <?php }?>
                            
                            <div class="circle-tile-heading red"> <span class="fa-stack"> <span class="fa fa-stack-1x" style="width:45px;">Step-3</span> </span> </div>
                            </a>
                            <div class="circle-tile-content red"> 
                              
                            <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0) ){?>
                            <a href="sh-analyzing.php">
                            <?php }else{?>
                            <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                            <?php }?>
                              
                              <div class="circle-tile-description text-faded"> <strong>Stakeholders Analyzing</strong> </div>
                              <div class="circle-tile-number text-faded "></div>
                              <div class="text-faded">
                                <!--<ul>
 									<li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>
                                </ul>-->
                                Understanding stakeholder perspectives and interests<br><br><br><br>
                              </div>
                              </a> <a class="circle-tile-footer openPopup" data-title="Stakeholders Analyzing Help" data-target="sh-analyzing-help.php" title="Stakeholders Analyzing Help" href="#!" style="margin-top:5px;">Help<i class="fa fa-chevron-circle-right"></i></a> </div>
                          </div>
                        </div>
                        <div class="col-lg-1 col-sm-4" style="width:4% !important; margin-top:136px;"><img src="img/forward.png"></div>
                        <div class="col-lg-2 col-sm-4" style="width:22% !important;">
                          <div class="circle-tile "> 
                          
                            <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0) ){?>
                            <a href="sh-ranking.php">
                            <?php }else{?>
                            <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                            <?php }?>
                            
                            <div class="circle-tile-heading purple"> <span class="fa-stack"> <span class="fa fa-stack-1x" style="width:45px;">Step-4</span> </span> </div>
                            </a>
                            <div class="circle-tile-content purple"> 
                              
                                <?php if( ($totUsersListings>0) && ($totDeptsListings>0) && ($totFilesListings>0) ){?>
                                <a href="sh-ranking.php">
                                <?php }else{?>
                                <a class="openPopup" data-title="Process Notification" data-target="sh-authorize.php" title="Process Notification" href="#!">
                                <?php }?>
                              
                              <div class="circle-tile-description text-faded"> <strong>Stakeholders Ranking</strong> </div>
                              <div class="circle-tile-number text-faded "></div>
                              <div class="text-faded">
                                <!--<ul>
 									<li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>
                                    <li>Lorem ipsum dolor sit amet.</li>                                 
                                  </ul>-->
                                Visualizing relationships to objectives and other stakeholders<br>
                                <br>
                                <br>
                              </div>
                              </a> <a class="circle-tile-footer openPopup" data-title="Stakeholders Ranking Help" data-target="sh-ranking-help.php" title="Stakeholders Ranking Help" href="#!" style="margin-top:5px;">Help<i class="fa fa-chevron-circle-right"></i></a> </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row" style="margin-top:10px;">
      <div class="col-lg-12">
        <div class="row">
          <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="width:106% !important;">
            <div class="tab-content view-mail-ov-mg-t-30">
              <div class="tab-pane fade in zoomInDown shadow-reset active">
                <div class="sparkline8-list shadow-reset">
                  <div class="sparkline8-hd">
                    <div class="main-sparkline8-hd">
                      <h1>Overview</h1>
                      <div class="sparkline8-outline-icon"></div>
                    </div>
                  </div>
                  <div class="sparkline8-graph">
                    <div class="container bootstrap snippet">
                      <div class="row">
                        <div class="author-progress-pro-area mg-t-30 mg-b-40">
                          <div class="container-fluid">
                            <div class="row">
                              <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <div class="single-skill shadow-reset">
                                  <div class="row">
                                    <div class="col-lg-12">
                                      <div align="center"><a href="sh-map.php">Stakeholders Map</a></div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                              <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <div class="single-skill widget-ov-mg-t-30 shadow-reset">
                                  <div class="row">
                                    <div class="col-lg-12">
                                      <div align="center"><a href="sh-prioritizing.php" title="Ranking stakeholder relevance and identifying issues">Stakeholders Prioritizing</a></div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                              <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <div class="single-skill widget-ov-mg-t-30 widget-ov-mg-t-n-30 shadow-reset">
                                  <div class="row">
                                    <div class="col-lg-12">
                                      <div align="center"><a href="sh-overview.php" title="Ranking stakeholder relevance and identifying issues">Stakeholders</a></div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                            <!--<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                <div class="single-skill widget-ov-mg-t-30 widget-ov-mg-t-n-30 shadow-reset">                                  
                                </div>
                              </div>-->
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    
  </div>
</div>
</div>
<!-- Data table area End-->
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
  <div class="modal-dialog modal-lg">
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="myModalLabel"></h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
      <div class="modal-body"> </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<!-- Footer Start-->
<?php include("includes/footer.php");?>
<!-- Footer End-->
<!-- jquery
		============================================ -->
<script src="js/vendor/jquery-1.11.3.min.js"></script>
<!-- bootstrap JS
		============================================ -->
<script src="js/bootstrap.min.js"></script>
<!-- meanmenu JS
		============================================ -->
<script src="js/jquery.meanmenu.js"></script>
<!-- mCustomScrollbar JS
		============================================ -->
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
<!-- sticky JS
		============================================ -->
<script src="js/jquery.sticky.js"></script>
<!-- scrollUp JS
		============================================ -->
<script src="js/jquery.scrollUp.min.js"></script>
<!-- counterup JS
		============================================ -->
<script src="js/counterup/jquery.counterup.min.js"></script>
<script src="js/counterup/waypoints.min.js"></script>
<script src="js/counterup/counterup-active.js"></script>
<!-- peity JS
		============================================ -->
<script src="js/peity/jquery.peity.min.js"></script>
<script src="js/peity/peity-active.js"></script>
<!-- sparkline JS
		============================================ -->
<script src="js/sparkline/jquery.sparkline.min.js"></script>
<script src="js/sparkline/sparkline-active.js"></script>
<!-- colorpicker JS
		============================================ -->
<script src="js/colorpicker/jquery.spectrum.min.js"></script>
<script src="js/colorpicker/color-picker-active.js"></script>
<!-- flot JS
		============================================ -->
<script src="js/flot/jquery.flot.js"></script>
<script src="js/flot/jquery.flot.tooltip.min.js"></script>
<script src="js/flot/jquery.flot.spline.js"></script>
<script src="js/flot/jquery.flot.resize.js"></script>
<script src="js/flot/jquery.flot.pie.js"></script>
<script src="js/flot/Chart.min.js"></script>
<script src="js/flot/flot-active.js"></script>
<!-- map JS
		============================================ -->
<script src="js/map/raphael.min.js"></script>
<script src="js/map/jquery.mapael.js"></script>
<script src="js/map/france_departments.js"></script>
<script src="js/map/world_countries.js"></script>
<script src="js/map/usa_states.js"></script>
<script src="js/map/map-active.js"></script>
<!-- data table JS
		============================================ -->
<script src="js/data-table/bootstrap-table.js"></script>
<script src="js/data-table/tableExport.js"></script>
<script src="js/data-table/data-table-active.js"></script>
<script src="js/data-table/bootstrap-table-editable.js"></script>
<script src="js/data-table/bootstrap-editable.js"></script>
<script src="js/data-table/bootstrap-table-resizable.js"></script>
<script src="js/data-table/colResizable-1.5.source.js"></script>
<script src="js/data-table/bootstrap-table-export.js"></script>
<!-- switcher JS
		============================================ -->
<script src="js/switcher/styleswitch.js"></script>
<script src="js/switcher/switch-active.js"></script>
<!-- Tree Viewer JS
		============================================ -->
<script src="js/tree-line/jstree.min.js"></script>
<script src="js/tree-line/jstree.active.js"></script>
<!-- touchspin JS
		============================================ -->
<script src="js/touchspin/jquery.bootstrap-touchspin.min.js"></script>
<script src="js/touchspin/touchspin-active.js"></script>
<!-- icheck JS
		============================================ -->
<script src="js/icheck/icheck.min.js"></script>
<script src="js/icheck/icheck-active.js"></script>
<!-- summernote JS
		============================================ -->
<script src="js/summernote.min.js"></script>
<script src="js/summernote-active.js"></script>
<!-- rangle-slider JS
		============================================ -->
<script src="js/rangle-slider/jquery-ui-1.10.4.custom.min.js"></script>
<script src="js/rangle-slider/jquery-ui-touch-punch.min.js"></script>
<script src="js/rangle-slider/rangle-active.js"></script>
<!-- notification JS
		============================================ -->
<script src="js/Lobibox.js"></script>
<script src="js/notification-active.js"></script>
<!-- main JS
		============================================ -->
<script src="js/main.js"></script>
<script>

$( document ).ready(function() {
	
	$( ".openPopup" ).click(function() {
	  var dataURL = $(this).attr('data-target');
	  var Title = $(this).attr('data-title');
	  $("#myModal #myModalLabel").html(Title);
	  
      //$('#myModal').modal({show:true});  
		$('.modal-body').load(dataURL,function(){				
            $('#myModal').modal({
			show:true			
			});
        });
	});
	
});
</script>
</body>
</html>
