<?php session_start() ?>

<!DOCTYPE html>

<!--[if IE 8]>			<html class="ie ie8"> <![endif]-->

<!--[if IE 9]>			<html class="ie ie9"> <![endif]-->

<!--[if gt IE 9]><!-->	<html><!--<![endif]-->



<!-- Specific Page Data -->



<!-- End of Data -->



<?php include('hhead.html'); ?>

  

  

  

  <?php

    function do_alert($msg) 

    {

        echo '<script type="text/javascript">alert("' . $msg . '") 

           parent.location="portal.html";



</script>';

       

    }

?>

<?php

$tyr=$_SESSION['num'];



//make the database connection

include('config.php');

$sql = "select * from access where userid = '$tyr' ";

 $data = mysqli_query($conn,$sql);



$rows = mysqli_num_rows($data);



if($rows <= 0){

   do_alert("user does not exist contact system admin");

}

else{



while($row= mysqli_fetch_array($data))

{



$serial=  $row['name'];

 $input= $row['userid'];

$class=  $row['class'];

 $arm= $row['arm'];

 $email= $row['date'];

$clay="$class$arm";

$dfrd="subjects";

$sdc="$clay$dfrd";

$_SESSION['name']=$serial;



$_SESSION['num']=$input;

$_SESSION['clay']=$clay;

$_SESSION['email']=$email;

$_SESSION['sdz']=$sdc;



}



}

$sql = "select subjects,class,type

 from `subjects` where staffid='$tyr' ";

 $data = mysqli_query($conn,$sql);







$rows4 = mysqli_num_rows($data);



$lcclass=strtolower($clay);

$_SESSION['lclay']=$lcclass;



$sql = "select * from `beva1` where password='$lcclass' ";

 $data = mysqli_query($conn,$sql);







$rows44 = mysqli_num_rows($data);



// Above will output ---- > testValue 



?>



  

  

  

  

  

  

  

  

  

  

  

  

  

  

<div class="content">

  <div class="container">

   <?php include('nav.html'); ?>  

    <!-- Middle Content Start -->

    

	

	

	

	

	

	

    <div class="vd_content-wrapper">

      <div class="vd_container">

        <div class="vd_content clearfix">

          <div class="vd_head-section clearfix">

            <div class="vd_panel-header">

              <ul class="breadcrumb">

                <li><a href="index.html">Home</a> </li>

                <li class="active">My Subjects</li>

              </ul>

              <div class="vd_panel-menu hidden-sm hidden-xs" data-intro="<strong>Expand Control</strong><br/>To expand content page horizontally, vertically, or Both. If you just need one button just simply remove the other button code." data-step=5  data-position="left">

    <div data-action="remove-navbar" data-original-title="Remove Navigation Bar Toggle" data-toggle="tooltip" data-placement="bottom" class="remove-navbar-button menu"> <i class="fa fa-arrows-h"></i> </div>

      <div data-action="remove-header" data-original-title="Remove Top Menu Toggle" data-toggle="tooltip" data-placement="bottom" class="remove-header-button menu"> <i class="fa fa-arrows-v"></i> </div>

      <div data-action="fullscreen" data-original-title="Remove Navigation Bar and Top Menu Toggle" data-toggle="tooltip" data-placement="bottom" class="fullscreen-button menu"> <i class="glyphicon glyphicon-fullscreen"></i> </div>

      

</div>

 

            </div>

          </div>

          <!-- vd_head-section -->

          

         

          <!-- vd_title-section -->

          

          <div class="vd_content-section clearfix">

            

            

              <!-- .col-md-4 --> 

            </div>

			

			<div class="row" id="form-basic">

              <div class="col-md-12">

                <div class="panel widget">

                  <div class="panel-heading vd_bg-grey">

                    <h3 class="panel-title"> <span class="menu-icon"> <i class="fa fa-bar-chart-o"></i> </span> Form Basic </h3>

                  </div>

                  <div class="panel-body">

                    <form class="form-horizontal"  action="csubjectss.php" method="POST" role="form">

                      <div class="form-group">

                        <label class="col-sm-4 control-label">Enter Subjects</label>

                        <div class="col-sm-7 controls">

                          <input type="text" placeholder="Enter Subjects in Caps" name="subjects">

                    </div>

                      </div>

                     

                      

                      <div class="form-group">

                        <label class="col-sm-4 control-label">Class</label>

                        <div class="col-sm-7 controls">

                        

						  

						  <?php

$sql = "select name from clas ";

 $query = mysqli_query($conn,$sql);

echo '<select name="class">'; // Open your drop down box



// Loop through the query results, outputing the options one by one

while ($row = mysqli_fetch_array($query)) {

   echo '<option value="'.$row['name'].'">'.$row['name'].'</option>';

}



echo '</select>';// 



?>

                        </div>

                      </div>

					  

					     <div class="form-group">

                        <label class="col-sm-4 control-label">Arm</label>

                        <div class="col-sm-7 controls">

                          						  <?php

$sql = "select type from clas ";

 $query = mysqli_query($conn,$sql);

echo '<select name="arm">'; // Open your drop down box



// Loop through the query results, outputing the options one by one

while ($row = mysqli_fetch_array($query)) {

   echo '<option value="'.$row['type'].'">'.$row['type'].'</option>';

}



echo '</select>';// 



?>

                        </div>

                      </div>

                    

                      <div class="form-group form-actions">

                        <div class="col-sm-4"> </div>

                        <div class="col-sm-8">

                          <button class="btn vd_btn vd_bg-green vd_white" type="submit"><i class="icon-ok"></i> Save</button>

                     

                        </div>

                      </div>

                    </form>

                  </div>

                </div>

                <!-- Panel Widget --> 

              </div>

              <!-- col-md-12 --> 

            </div>

            <div class="row">

			<div class="col-md-12">

                <div class="panel widget">

                  <div class="panel-body-list  table-responsive">

                    <table class="table no-head-border table-striped">

                      <thead class="vd_bg-blue vd_white">

                        <tr>

                          <th><i class="fa fa-search append-icon"></i>Subjects</th>

                          <th style="width:20px">Class</th>

                          <th style="width:140px">Arm</th>

                        </tr>

                      </thead>

                      <tbody>

                         <?php







//make the database connection

include('config.php');

 $sql = "select subjects,class,type

 from `subjects` where staffid='$tyr' ";

 $data = mysqli_query($conn,$sql);







$rows4 = mysqli_num_rows($data);







  



print "<center>";





    

    

      

print "<table id=datatable class='table table-striped'>";



print "<thead >\n";

				print "<tr>\n";



print "

	

		<th width=200><B>SUBJECTS</B>

 </th>

				<th width=50><div ><B>CLASS</B>

 </div></th>

		



				<th width=50><div ><B>ARM</B>

 </div></th>

		<th width=50><div ><B>Update</B>

 </div></th>

			



		





\n";			

				

					

				print "</tr>\n";

			print "</thead>\n";

			print "<tbody >\n";

//get field names





//get row data as an associative array

while ($row = mysqli_fetch_assoc($data)){

print "<tr>\n";

//look at each field

foreach ($row as $col=>$val){

print " <td>$val</td>\n";

} // end foreach

print "</tr>\n\n";

}// end while

print "</table>\n";



print "</center>\n";

















?>



  </br> 

 <tr><td></br><u>TOTAL SUBJECTS REGISTERED:</u></td><td ></br><b><?php echo $rows4; ?></b>

<td>



<TD></tr>>Ketchup Bottle</td>

                          <td class="text-center">3</td>

                          <td class="text-center">12</td>

                        </tr>

                      </tbody>

                    </table>

                  </div>

                </div>

                <div class="panel widget">

                  <div class="panel-body-list  table-responsive">

                    

                  </div>

                </div>

              </div>

              <!-- col-md-6 --> 

            

              <!-- col-md-6 -->

              

            </div>

            <!-- .row --> 

          </div>

          <!-- .vd_content-section --> 

          

        </div>

        <!-- .vd_content --> 

      </div>



























</div>

















<?php include('footer.php'); ?>

<!-- Footer END -->

  <div class="vd_chat-menu hidden-xs">

      <div class="vd_mega-menu-wrapper">

          <div class="vd_mega-menu">

             <ul class="mega-ul">

    <li class="one-icon mega-li mgl-10"> 

      <a class="mega-link vd_bg-green" href="javascript:void(0);"  data-action="click-trigger">

            <span class="mega-icon">

                <i class="fa fa-cloud"></i>

            </span>

            <span class="badge vd_bg-red">

                10

            </span>

      </a>

      <div class="vd_mega-menu-content width-xs-3 width-sm-5 width-md-6  center-xs-6 open-top" data-action="click-target">

        <div class="child-menu">  

           <div class="title"> 

           	   Server Status

               <div class="vd_panel-menu">

                     <span data-original-title="Find Server" data-toggle="tooltip" data-placement="bottom" class="menu">

                        <i class="fa fa-search"></i>

                    </span>                 

                     <span data-original-title="Message Setting" data-toggle="tooltip" data-placement="bottom" class="menu">

                        <i class="fa fa-cog"></i>

                    </span>                                                                              

                </div>

           </div>                 

		   <div class="content-grid column-md-3 column-sm-2 column-xs-1 height-xs-auto height-sm-4">	

           <div data-rel="scroll">

               <ul class="list-wrapper">

                    <li><a>

           		            <div class="menu-icon">

                				<i class="fa fa-cloud"></i>

           				    </div>

                            <div class="menu-text"> Venmond.com

                            	<div class="menu-info">

                                    <span class="menu-date vd_bg-green badge">Online</span>

                                    <div class="menu-status  text-left">

                                    	<span class="text">Disk Usage</span>

                                        <span class="value pull-right vd_black">4.35/140 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:15%" class="progress-bar progress-bar-info"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                     

                                    <div class="menu-status  text-left">

                                    	<span class="text">BW Usage</span>

                                        <span class="value pull-right vd_black">1600/2500 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                                                                                               

                                    <span class="menu-action">

                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-refresh"></i>

                                        </span> 

                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-stop"></i>

                                        </span>

                                    </span>                                

                            	</div>

                            </div> 

                    </a></li>

                    <li> <a>

           		            <div class="menu-icon">

                				<i class="fa fa-cloud"></i>

           				    </div>

                            <div class="menu-text"> Venmond.com

                            	<div class="menu-info">

                                    <span class="menu-date vd_bg-grey badge">Offline</span>

                                    <div class="menu-status  text-left">

                                    	<span class="text">Disk Usage</span>

                                        <span class="value pull-right vd_black">4.35/140 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:15%" class="progress-bar progress-bar-info"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                     

                                    <div class="menu-status  text-left">

                                    	<span class="text">BW Usage</span>

                                        <span class="value pull-right vd_black">1600/2500 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                                                                                               

                                    <span class="menu-action">

                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-refresh"></i>

                                        </span> 

                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-stop"></i>

                                        </span>

                                    </span>                                

                            	</div>

                            </div> 

                    </a></li>

                    <li> <a>

           		            <div class="menu-icon">

                				<i class="fa fa-cloud"></i>

           				    </div>

                            <div class="menu-text"> Venmond.com

                            	<div class="menu-info">

                                    <span class="menu-date vd_bg-grey badge">Offline</span>

                                    <div class="menu-status  text-left">

                                    	<span class="text">Disk Usage</span>

                                        <span class="value pull-right vd_black">4.35/140 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:15%" class="progress-bar progress-bar-info"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                     

                                    <div class="menu-status  text-left">

                                    	<span class="text">BW Usage</span>



                                        <span class="value pull-right vd_black">1600/2500 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                                                                                               

                                    <span class="menu-action">

                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-refresh"></i>

                                        </span> 

                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-stop"></i>

                                        </span>

                                    </span>                                

                            	</div>

                            </div> 

                    </a></li>

                    <li><a> 

           		            <div class="menu-icon">

                				<i class="fa fa-cloud"></i>

           				    </div>

                            <div class="menu-text"> Venmond.com

                            	<div class="menu-info">

                                    <span class="menu-date vd_bg-grey badge">Offline</span>

                                    <div class="menu-status  text-left">

                                    	<span class="text">Disk Usage</span>

                                        <span class="value pull-right vd_black">4.35/140 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:15%" class="progress-bar progress-bar-info"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                     

                                    <div class="menu-status  text-left">

                                    	<span class="text">BW Usage</span>

                                        <span class="value pull-right vd_black">1600/2500 GB</span>

                                    </div>

                                    <div class="menu-info">

                                        <div class="progress">

                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 

                                            </div>

                                        </div>                                                   

                                    </div>                                                                                                               

                                    <span class="menu-action">

                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-refresh"></i>

                                        </span> 

                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-stop"></i>

                                        </span>

                                    </span>                                

                            	</div>

                            </div> 

                    </a></li>                                                                                                                         

                    

               </ul>

               </div> <!-- data-rel="scroll" -->

               <div class="closing text-center" style="">

               		<a href="#">See All Requests <i class="fa fa-angle-double-right"></i></a>

               </div>                                                                       

           </div>                              

        </div> <!-- child-menu -->                      

      </div>   <!-- vd_mega-menu-content --> 

    </li>

    <li class="one-big-icon mega-li mgl-10"> 

        <a class="mega-link" href="javascript:void(0);"   data-action="click-trigger">

            <span class="mega-icon">

                <i class="fa fa-tasks"></i>

            </span>

            <span class="badge vd_bg-red">

                8

            </span>

        </a>

      <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-4 center-xs-4 open-top" data-action="click-target">

        <div class="child-menu">  

           <div class="title"> 

           	   You have 8 pending tasks

               <div class="vd_panel-menu">

                     <span data-original-title="Task Setting" data-toggle="tooltip" data-placement="bottom" class="menu">

                        <i class="fa fa-cog"></i>

                    </span>                                                                              

                </div>

           </div>                 

		   <div class="content-list content-image">	

           <div data-rel="scroll">

               <ul class="list-wrapper pd-lr-10">

                    <li> <a href="#"> 

                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 

                            <div class="menu-text"> Electricity Problem

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:85%" class="progress-bar progress-bar-info"> 

                                        	85%

                                        </div>

                                    </div>                                                                                                    

                            	</div>

                            </div> 

                    </a> </li>

                    <li> <a href="#"> 

                    		<div class="menu-icon vd_yellow"><i class="fa fa-code"></i></div>  

                            <div class="menu-text">  Finish coding jquery plugin

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 

                                        	20%

                                        </div>

                                    </div>                                                                                                    

                            	</div>                           

                            </div> 

                    </a> </li>    

                    <li> <a> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 

                            <div class="menu-text"> Client: Zoe Project

                            	<div class="menu-info">

                                    <span class="menu-date">Make a call</span>                                                                         

                                    <span class="menu-action">

                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-phone"></i>

                                        </span>                                                                            

                                    </span>                                

                            	</div>                                                     

                            </div> 

                    </a> </li>                                     

                    <li> <a href="#"> 

                    		<div class="menu-icon"><i class=" fa fa-magic"></i></div>  

                            <div class="menu-text">  Final error check on new templates

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:95%" class="progress-bar progress-bar-success"> 

                                        	95%

                                        </div>

                                    </div>                                                                                                    

                            	</div>                           

                            </div> 

                    </a> </li> 

                    <li> <a href="#"> 

                    		<div class="menu-icon vd_green"><i class=" fa fa-camera"></i></div>  

                            <div class="menu-text">  Update product image

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:50%" class="progress-bar progress-bar-warning"> 

                                        	50%

                                        </div>

                                    </div>                                                                                                    

                            	</div>                           

                            </div> 

                    </a> </li>

                    <li> <a href="#"> 

                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 

                            <div class="menu-text"> Electricity Problem

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:85%" class="progress-bar progress-bar-info"> 

                                        	85%

                                        </div>

                                    </div>                                                                                                    

                            	</div>

                            </div> 

                    </a> </li>

                    <li> <a href="#"> 

                    		<div class="menu-icon vd_yellow"><i class=" fa fa-code"></i></div>  

                            <div class="menu-text">  Finish coding jquery plugin

                            	<div class="menu-info">

                                    <div class="progress progress-sm">

                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 

                                        	20%

                                        </div>

                                    </div>                                                                                                    

                            	</div>                           

                            </div> 

                    </a> </li>    

                    <li> <a> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 

                            <div class="menu-text"> Client: Zoe Project

                            	<div class="menu-info">

                                    <span class="menu-date">Make a call</span>                                                                         

                                    <span class="menu-action">

                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">

                                            <i class="fa fa-phone"></i>

                                        </span>                                                                            

                                    </span>                                

                            	</div>                                                     

                            </div> 

                    </a> </li>                                     

                                                                                                                       

                    

               </ul>

               </div>

               <div class="closing text-center" style="">

               		<a href="#">See All Tasks <i class="fa fa-angle-double-right"></i></a>

               </div>                                                                       

           </div>                              

        </div> <!-- child-menu -->                      

      </div>   <!-- vd_mega-menu-content --> 

    </li>  

    <li class="one-big-icon mega-li mgl-10"> 

      <a href="index.html" class="mega-link" data-action="click-trigger">

    	<span class="mega-icon"><img alt="example image" src="img/avatar/avatar.jpg"></span> 

		<span class="badge vd_bg-red">10</span>        

      </a>

      <div class="vd_mega-menu-content  open-top width-xs-4 width-md-5 width-lg-4 center-xs-4" data-action="click-target">

        <div class="child-menu">  

           <div class="title"> 

           	   Jessyline <i>(online)</i>

               <div class="vd_panel-menu">

                     <div  data-rel="tooltip"  data-original-title="Make a Call" class="menu entypo-icon smaller-font">

                        <i class="icon-phone"></i>

                    </div>               

                     <div  data-rel="tooltip"  data-original-title="Video Call" class="menu">

                        <i class="fa fa-video-camera"></i>

                    </div>               

                     <div  data-rel="tooltip"  data-original-title="Message Setting" class="menu smaller-font entypo-icon">

                        <i class="icon-cog"></i>

                    </div>   

                     <div data-rel="tooltip"  data-original-title="Close" class="menu entypo-icon">

                        <i class="icon-cross"></i>

                    </div>                                                                                                 

                </div>

           </div>                 

		   <div class="content-list content-image content-menu">

           	<div data-rel="scroll">	

               <ul class="list-wrapper pd-lr-10">

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text"> Do you play or follow any sports?

                            	<div class="menu-info">

                                    <span class="menu-date">12 Minutes Ago </span>                                                                                                        

                            	</div>

                            </div> 

                    </a> </li>

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  

                            <div class="menu-text">  Good job mate !

                            	<div class="menu-info">

                                    <span class="menu-date">1 Hour 20 Minutes Ago </span>                                                                         

                              

                            	</div>                            

                            </div> 

                    </a> </li>    

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text">  Just calm down babe, everything will work out.

                            	<div class="menu-info">

                                    <span class="menu-date">12 Days Ago</span>                                                                         

                               

                            	</div>                                                     

                            </div> 

                    </a> </li>                                     

                    <li  class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Euuh so gross....

                            	<div class="menu-info">

                                    <span class="menu-date">19 Days Ago</span>                                                                         

                               

                            	</div>                                                        

                            </div> 

                    </a> </li> 

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div>  

                            <div class="menu-text">  That's the way.. I like it :D

                            	<div class="menu-info">

                                    <span class="menu-date">20 Days Ago</span>                                                                         

                               

                            	</div>                                                          

                            </div> 

                    </a> </li>

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Oooh don't be shy ;P

                            	<div class="menu-info">

                                    <span class="menu-date">21 Days Ago</span>                                                                                                       

                            	</div>                             

                            </div> 

                    </a> </li>                                     

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text">  Hello, please call my number..

                            	<div class="menu-info">

                                    <span class="menu-date">24 Days Ago</span>                                                                         

                               

                            	</div>                              

                            </div> 

                    </a> </li> 

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Don't go anywhere, i will be coming soon

                            	<div class="menu-info">

                                    <span class="menu-date">1 Month 2 days Ago</span>                                                                                                      

                            	</div>                              

                            </div> 

                    </a> </li>                                                                                          

                    

               </ul>

               </div>

               <div class="closing chat-area">

               	   <div class="chat-box">

                   	<input type="text" placeholder="chat here.." />

                   </div>

                   <div class="vd_panel-menu">

                         <div  data-rel="tooltip"  data-original-title="Insert Picture" class="menu">

                            <i class="icon-camera"></i>

                        </div>               

                         <div  data-rel="tooltip"  data-original-title="Emoticons" class="menu">

                            <i class="fa fa-smile-o"></i>

                        </div>                                                                                  

                    </div>

               </div>                                                                       

           </div>                              

        </div> <!-- child-menu -->                      

      </div>   <!-- vd_mega-menu-content --> 

    </li>  

    <li class="one-big-icon mega-li mgl-10"> 

      <a href="index.html" class="mega-link" data-action="click-trigger">

    	<span class="mega-icon"><img alt="example image" src="img/avatar/avatar-10.jpg"></span> 

		<span class="badge vd_bg-red">3</span>        

      </a>

      <div class="vd_mega-menu-content  open-top width-xs-4 width-md-5 width-lg-4 center-xs-4" data-action="click-target">

        <div class="child-menu">  

           <div class="title"> 

           	   Jessyline <i>(online)</i>

               <div class="vd_panel-menu">

                     <div  data-rel="tooltip"  data-original-title="Make a Call" class="menu entypo-icon smaller-font">

                        <i class="icon-phone"></i>

                    </div>               

                     <div  data-rel="tooltip"  data-original-title="Video Call" class="menu">

                        <i class="fa fa-video-camera"></i>

                    </div>               

                     <div  data-rel="tooltip"  data-original-title="Message Setting" class="menu smaller-font entypo-icon">

                        <i class="icon-cog"></i>

                    </div>   

                     <div data-rel="tooltip"  data-original-title="Close" class="menu entypo-icon">

                        <i class="icon-cross"></i>

                    </div>                                                                                                 

                </div>

           </div>                 

		   <div class="content-list content-image content-menu">	

           <div   data-rel="scroll">

               <ul class="list-wrapper pd-lr-10" >

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text"> Do you play or follow any sports?

                            	<div class="menu-info">

                                    <span class="menu-date">12 Minutes Ago </span>                                                                                                        

                            	</div>

                            </div> 

                    </a> </li>

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  

                            <div class="menu-text">  Good job mate !

                            	<div class="menu-info">

                                    <span class="menu-date">1 Hour 20 Minutes Ago </span>                                                                         

                              

                            	</div>                            

                            </div> 

                    </a> </li>    

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text">  Just calm down babe, everything will work out.

                            	<div class="menu-info">

                                    <span class="menu-date">12 Days Ago</span>                                                                         

                               

                            	</div>                                                     

                            </div> 

                    </a> </li>                                     

                    <li  class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Euuh so gross....

                            	<div class="menu-info">

                                    <span class="menu-date">19 Days Ago</span>                                                                         

                               

                            	</div>                                                        

                            </div> 

                    </a> </li> 

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div>  

                            <div class="menu-text">  That's the way.. I like it :D

                            	<div class="menu-info">

                                    <span class="menu-date">20 Days Ago</span>                                                                         

                               

                            	</div>                                                          

                            </div> 

                    </a> </li>

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Oooh don't be shy ;P

                            	<div class="menu-info">

                                    <span class="menu-date">21 Days Ago</span>                                                                                                       

                            	</div>                             

                            </div> 

                    </a> </li>                                     

                    <li> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 

                            <div class="menu-text">  Hello, please call my number..

                            	<div class="menu-info">

                                    <span class="menu-date">24 Days Ago</span>                                                                         

                               

                            	</div>                              

                            </div> 

                    </a> </li> 

                    <li class="align-right"> <a href="#"> 

                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 

                            <div class="menu-text">  Don't go anywhere, i will be coming soon

                            	<div class="menu-info">

                                    <span class="menu-date">1 Month 2 days Ago</span>                                                                                                      

                            	</div>                              

                            </div> 

                    </a> </li>                                                                                          

                    

               </ul>

               </div>

               <div class="closing chat-area">

               	   <div class="chat-box">

                   	<input type="text" placeholder="chat here.." />

                   </div>

                   <div class="vd_panel-menu">

                         <div  data-rel="tooltip"  data-original-title="Insert Picture" class="menu">

                            <i class="icon-camera"></i>

                        </div>               

                         <div  data-rel="tooltip"  data-original-title="Emoticons" class="menu">

                            <i class="fa fa-smile-o"></i>

                        </div>                                                                                  

                    </div>

               </div>                                                                       

           </div>                              

        </div> <!-- child-menu -->                      

      </div>   <!-- vd_mega-menu-content -->         

    </li>  

     

    <li class="profile mega-li pdlr-15 bordered"> 

        <a class="mega-link" href="#"  data-action="click-trigger"> 

            <span class="menu-name">

                <i class="fa fa-comments append-icon"></i> Chat

            </span>

        </a> 

      <div class="vd_mega-menu-content  width-xs-3  center-xs-3 open-top" data-action="click-target">

        <div class="child-menu"> 

        	<div class="content-list  content-image">

            <div data-rel="scroll">

                <ul class="list-wrapper pd-lr-10">

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar.jpg" alt="example image"></div> 

                                <div class="menu-text">Jessylin

	                                <div class="menu-info">

                                    	<span class="menu-date">Administrator </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li>

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-2.jpg" alt="example image"></div> 

                                <div class="menu-text">Rodney Mc.Cardo

	                                <div class="menu-info">

                                    	<span class="menu-date">Designer </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 

                        </a>

                    </li>

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-3.jpg" alt="example image"></div> 

                                <div class="menu-text">Theresia Minoque

	                                <div class="menu-info">

                                    	<span class="menu-date">Engineering </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li>

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-4.jpg" alt="example image"></div> 

                                <div class="menu-text">Greg Grog

	                                <div class="menu-info">

                                    	<span class="menu-date">Developer </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 

                        </a>

                    </li> 

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-5.jpg" alt="example image"></div> 

                                <div class="menu-text">Stefanie Imburgh

	                                <div class="menu-info">

                                    	<span class="menu-date">Dancer</span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li> 

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-6.jpg" alt="example image"></div> 

                                <div class="menu-text">Matt Demon

	                                <div class="menu-info">

                                    	<span class="menu-date">Musician </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li>

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-7.jpg" alt="example image"></div> 

                                <div class="menu-text">Jeniffer Anastasia

	                                <div class="menu-info">

                                    	<span class="menu-date">Senior Developer </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li>                    

                    <li>  

                        <a href="#"> 

                                <div class="menu-icon"><img src="img/avatar/avatar-8.jpg" alt="example image"></div> 

                                <div class="menu-text">Daniel Dreamon

	                                <div class="menu-info">

                                    	<span class="menu-date">Sales Executive </span>                                                         

                            		</div>

                                </div>

                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 

                        </a>

                    </li>                                                                                                                  

                </ul>

                </div>

            </div> 

        </div> 

      </div>     

  

    </li>  

    <li class="profile border-left mega-li"> 

        <a class="mega-link pd-10" href="javascript:void(0);" data-action="chat-close"> 

            <span class="mega-icon">

                <i class="fa fa-sign-out"></i>

            </span>

        </a> 

    </li>                      

</ul>

<!-- Head menu search form ends -->  

          </div>   

      </div>      

  </div>



</div>



<!-- .vd_body END  -->

<a id="back-top" href="#" data-action="backtop" class="vd_back-top visible"> <i class="fa  fa-angle-up"> </i> </a>



<!--

<a class="back-top" href="#" id="back-top"> <i class="icon-chevron-up icon-white"> </i> </a> -->



<!-- Javascript =============================================== --> 

<!-- Placed at the end of the document so the pages load faster --> 

<script type="text/javascript" src="js/jquery.js"></script> 

<!--[if lt IE 9]>

  <script type="text/javascript" src="js/excanvas.js"></script>      

<![endif]-->

<script type="text/javascript" src="js/bootstrap.min.js"></script> 

<script type="text/javascript" src='plugins/jquery-ui/jquery-ui.custom.min.js'></script>

<script type="text/javascript" src="plugins/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js"></script>



<script type="text/javascript" src="js/caroufredsel.js"></script> 

<script type="text/javascript" src="js/plugins.js"></script>



<script type="text/javascript" src="plugins/breakpoints/breakpoints.js"></script>

<script type="text/javascript" src="plugins/dataTables/jquery.dataTables.min.js"></script>

<script type="text/javascript" src="plugins/prettyPhoto-plugin/js/jquery.prettyPhoto.js"></script> 



<script type="text/javascript" src="plugins/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>

<script type="text/javascript" src="plugins/tagsInput/jquery.tagsinput.min.js"></script>

<script type="text/javascript" src="plugins/bootstrap-switch/bootstrap-switch.min.js"></script>

<script type="text/javascript" src="plugins/blockUI/jquery.blockUI.js"></script>

<script type="text/javascript" src="plugins/pnotify/js/jquery.pnotify.min.js"></script>



<script type="text/javascript" src="js/theme.js"></script>

<script type="text/javascript" src="custom/custom.js"></script>

 

<!-- Specific Page Scripts Put Here -->

<!-- Flot Chart  -->

<script type="text/javascript" src="plugins/flot/jquery.flot.min.js"></script>

<script type="text/javascript" src="plugins/flot/jquery.flot.resize.js"></script>

<script type="text/javascript" src="plugins/flot/jquery.flot.pie.min.js"></script>

<script type="text/javascript" src="plugins/flot/jquery.flot.categories.min.js"></script>

<script type="text/javascript" src="plugins/flot/jquery.flot.animator.min.js"></script>



<!-- Vector Map -->

<script type="text/javascript" src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>

<script type="text/javascript" src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>





<!-- Intro JS (Tour) -->

<script type="text/javascript" src='plugins/introjs/js/intro.min.js'></script>









<script type="text/javascript">

$(window).load(function() 

	{

	

		"use strict";

	

		$(window).on("resize", function(){

			plot.resize();

			plot.setupGrid();

			plot.draw();

		});

				



		$.fn.UseTooltip = function () {

			var previousPoint = null;

			 

			$(this).bind("plothover", function (event, pos, item) {        

					if (item) {

						if (previousPoint != item.dataIndex) {

		

							previousPoint = item.dataIndex;

		

							$("#tooltip").remove();

							var x = item.datapoint[0].toFixed(2),

							y = item.datapoint[1].toFixed(2);

		

							showTooltip(item.pageX, item.pageY,

								"<p class='vd_bg-green'><strong class='mgr-10 mgl-10'>" + Math.round(x)  + " NOV 2013 </strong></p>" +

								"<div style='padding: 0 10px 10px;'>" +

								"<div>" + item.series.label +": <strong>"+ Math.round(y)  +"</strong></div>" +

								"<div> Profit: <strong>$"+ Math.round(y)*7  +"</strong></div>" +

								"</div>"

							);

						}

					} else {

						$("#tooltip").remove();

						previousPoint = null;            

					}

			});

		};

		 

		function showTooltip(x, y, contents) {

			$('<div id="tooltip">' + contents + '</div>').css({

				position: 'absolute',

				display: 'none',

				top: y + 5,

				left: x + 20,    

				size: '10',  

//				'border-top' : '3px solid #1FAE66',

				'background-color': '#111111',

				color: "#FFFFFF",

				opacity: 0.85

			}).appendTo("body").fadeIn(200);

		}





/* REVENUE LINE CHART */



	var d2 = [ [1, 250],

            [2, 150],

            [3, 50],

            [4, 200],

            [5,50],

            [6, 150],

            [7, 150],

            [8, 200],

            [9, 100],

            [10, 250],

            [11,250],

            [12, 200],

            [13, 300]			



];

	var d1 = [

			[1, 650],

            [2, 550],

            [3, 450],

            [4, 550],

            [5, 350],

            [6, 500],

            [7, 600],

            [8, 450],

            [9, 300],

            [10, 600],

            [11, 400],

            [12, 500],

            [13, 700]					

			

];

	var plot = $.plotAnimator($("#revenue-line-chart"), [

			{  	label: "Revenue",

				data: d2, 	

				lines: {				

					fill: 0.4,

					lineWidth: 0,				

				},

				color:['#f2be3e']

			},{ 

				data: d1, 

				animator: {steps: 60, duration: 1000, start:0}, 		

				lines: {lineWidth:2},	

				shadowSize:0,

				color: '#F85D2C'

			},{

				label: "Revenue",

				data: d1, 

				points: { show: true, fill: true, radius:6,fillColor:"#F85D2C",lineWidth:3 },	

				color: '#fff',				

				shadowSize:0

			},

			{	label: "Cost",

				data: d2, 

				points: { show: true, fill: true, radius:6,fillColor:"#f2be3e",lineWidth:3 },	

				color: '#fff',				

				shadowSize:0

			}

		],{	xaxis: {

		tickLength: 0,

		tickDecimals: 0,

		min:2,



				font :{

					lineHeight: 13,

					style: "normal",

					weight: "bold",

					family: "sans-serif",

					variant: "small-caps",

					color: "#6F7B8A"

				}

			},

			yaxis: {

				ticks: 3,

                tickDecimals: 0,

				tickColor: "#f0f0f0",

				font :{

					lineHeight: 13,

					style: "normal",

					weight: "bold",

					family: "sans-serif",

					variant: "small-caps",

					color: "#6F7B8A"

				}

			},

			grid: {

				backgroundColor: { colors: [ "#fff", "#fff" ] },

				borderWidth:1,borderColor:"#f0f0f0",

				margin:0,

				minBorderMargin:0,							

				labelMargin:20,

				hoverable: true,

				clickable: true,

				mouseActiveRadius:6

			},

			legend: { show: false}

		});



 		$("#revenue-line-chart").UseTooltip();		







/* REVENUE DONUT CHART */

	

		var data2 = [],

			series = 3;

		var data2 = [

			{ label: "Men",  data: 35},

			{ label: "Women",  data: 65}

		];

		var revenue_donut_chart = $("#revenue-donut-chart");

		

		$("#revenue-donut-chart").bind("plotclick", function (event, pos, item) {

			if (item) {

				$("#clickdata").text(" - click point " + item.dataIndex + " in " + item.series.label);

				plot.highlight(item.series, item.datapoint);

			}

		});

		$.plot(revenue_donut_chart, data2, {

			series: {

				pie: { 

					innerRadius: 0.4,

					show: true

				}

			},

			grid: {

				hoverable: true,

				clickable: true,

			},

			colors: ["#1FAE66", "#F85D2C "]				

		});

		

		

/* REVENUE BAR CHART */	

	

		var bar_chart_data = [ ["Jan", 10], ["Feb", 8], ["Mar", 4], ["Apr", 13], ["May", 17], ["Jun", 9], ["Jul", 10], ["Aug", 8], ["Sep", 4], ["Oct", 13], ["Nov", 17], ["Dec", 9] ];

		

        var bar_chart = $.plot(

        $("#revenue-bar-chart"), [{

            data: bar_chart_data,

 //           color: "rgba(31,174,102, 0.8)",

 			color: "#F85D2C" ,

            shadowSize: 0,

            bars: {

                show: true,

                lineWidth: 0,

                fill: true,

                fillColor: {

                    colors: [{

                        opacity: 1

                    }, {

                        opacity: 1

                    }]

                }

            }

        }], {

            series: {

                bars: {

                    show: true,

                    barWidth: 0.9,

					align: "center"

                }

            },

            grid: {

                show: true,

                hoverable: true,

                borderWidth: 0

            },

            yaxis: {

                min: 0,

                max: 20,

				show: false

            },

			xaxis: {

				mode: "categories",

				tickLength: 0,

				color: "#FFFFFF",				

			}			

        });

		

	   var previousPoint2 = null;

       $("#revenue-bar-chart").bind("plothover", function (event, pos, item) {

            $("#x").text(pos.x.toFixed(2));

            $("#y").text(pos.y.toFixed(2));

            if (item) {

                if (previousPoint2 != item.dataIndex) {

                    previousPoint2 = item.dataIndex;

                    $("#tooltip").remove();

                    var x = item.datapoint[0] + 1,

                        y = item.datapoint[1].toFixed(2);

                    showTooltip(item.pageX, item.pageY, 

								"<p class='vd_bg-green'><strong class='mgr-10 mgl-10'>" + x + " - 2013 </strong></p>" +

								"<div style='padding: 0 10px 10px;'>" +

								"<div> Sales: <strong>"+ Math.round(y)*17  +"</strong></div>" +

								"<div> Profit: <strong>$"+ Math.round(y)*280  +"</strong></div>" +

								"</div>"										

					);

                }

            }

        });



        $('#revenue-bar-chart').bind("mouseleave", function () {

            $("#tooltip").remove();

        });







/* PIE CHART */



		var pie_placeholder = $("#pie-chart");



		var pie_data = [];

		

		pie_data[0] = {

			label: "IE",

			data: 10

		}

		pie_data[1] = {

			label: "Safari",

			data: 8

		}	

		pie_data[2] = {

			label: "Opera",

			data: 8

		}				

		pie_data[3] = {

			label: "Chrome",

			data: 13

		}	

		pie_data[4] = {

			label: "Firefox",

			data: 17

		}	

		pie_data[5] = {

			label: "Other",

			data: 3

		}					

		$.plot(pie_placeholder, pie_data, {

			series: {

				pie: { 

					show: true,

					label:{

						show: true,

						radius: .5,

						formatter: labelFormatter,

						background: {

							opacity: 0

						}

					},



				}

			},

			grid: {

				hoverable: true,

				clickable: true

			},

			colors: ["#FCB660", "#ce91db", "#56A2CF", "#52D793", "#FC8660", "#CCCCCC"]

		});



		pie_placeholder.bind("plothover", function(event, pos, obj) {

			if (!obj) {

				return;

			}

			var percent = parseFloat(obj.series.percent).toFixed(2);

			$("#hover").html("<span style='font-weight:bold; color:" + obj.series.color + "'>" + obj.series.label + " (" + percent + "%)</span>");

		});



		pie_placeholder.bind("plotclick", function(event, pos, obj) {

			if (!obj) {

				return;

			}

			percent = parseFloat(obj.series.percent).toFixed(2);

			alert(""  + obj.series.label + ": " + percent + "%");

		});



	function labelFormatter(label, series) {

		return "<div style='font-size:8pt; text-align:center; padding:2px; color:white;'>" + label + "<br/>" + Math.round(series.percent) + "%</div>";

	}

		







		

// Notification

	  setTimeout(function() { notification("topright","notify","fa fa-exclamation-triangle vd_yellow","Welcome to Vendroid","Click on <i class='fa fa-question-circle vd_red'></i> Question Mark beside filter to take a view layout tour guide"); },1500)	 ; 

	  



});

</script>

<!-- Specific Page Scripts END -->









<!-- Google Analytics: Change UA-XXXXX-X to be your site's ID. Go to http://www.google.com/analytics/ for more information. -->



<script>

    var _gaq = _gaq || [];

    _gaq.push(['_setAccount', 'UA-XXXXX-X']);

    _gaq.push(['_trackPageview']);



    (function() {

        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;

        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

    })();

</script> 



</body>

</html>