<!DOCTYPE html>

<html>
<head>
    <title>Flow</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta charset="utf-8"> 
    <link rel="icon" type="image/gif/png" href="../images/icon.png">
    <!-- CSS -->
     <link href="bootstrap-3.3.2-dist/css/filter.svg" rel="stylesheet" />
     <!-- <link id="botthm" href="bootstrap-3.3.2-dist/css/bootstrap-theme.css" rel="stylesheet" />
    <link href="bootstrap-3.3.2-dist/css/bootstrap-theme.min.css" rel="stylesheet" />-->
   <!-- <link href="bootstrap-3.3.2-dist/css/bootstrap-flipped.css" rel="stylesheet" />
    <link href="bootstrap-3.3.2-dist/css/bootstrap-rtl.css" rel="stylesheet" />-->
    <link id="theme" href="bootstrap-3.3.2-dist/css/default.css" rel="stylesheet" />
    <link href="bootstrap-3.3.2-dist/css/buttons.dataTables.min.css" rel="stylesheet" />
    <link href="bootstrap-3.3.2-dist/css/dataTables.bootstrap.css" rel="stylesheet" />
    <link href="bootstrap-3.3.2-dist/css/jquery.dataTables.min.css" rel="stylesheet" />
     <!--<link href="bootstrap-3.3.2-dist/css/bootstrap-select.min.css" rel="stylesheet" />-->
	<link href="bootstrap-3.3.2-dist/css/jquery.orgchart.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    
     
  <link rel='stylesheet' href='bootstrap-3.3.2-dist/css/fullcalendar.css' />
  
    
   <!-- <link href="thems/dark.css" rel="stylesheet" />-->
    <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">

    <link href="bootstrap-3.3.2-dist/css/customes-bootstrap.css" rel="stylesheet" />
    
    <!-- JavaScript -->
    <script src="bootstrap-3.3.2-dist/js/jquery-1.12.4.min.js"></script>
        
    <!--<script src="bootstrap-3.3.2-dist/js/ColReorderWithResize.js"></script>-->
    <script src="bootstrap-3.3.2-dist/js/jquery.dataTables.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/dataTables.buttons.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/dataTables.bootstrap.js"></script>
    <script src="bootstrap-3.3.2-dist/js/buttons.print.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/bootstrap.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/buttons.colVis.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/jszip.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/pdfmake.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/buttons.html5.min.js"></script>
    <script src="bootstrap-3.3.2-dist/js/vfs_fonts.js"></script>
    <script src="bootstrap-3.3.2-dist/js/canvasjs.min.js"></script>
  
    <script src="bootstrap-3.3.2-dist/js/jspdf.min.js"></script>

     <script src="bootstrap-3.3.2-dist/js/Select.js"></script>
    
    <!--<script src="bootstrap-3.3.2-dist/js/chart.js"></script>-->
    <script src="bootstrap-3.3.2-dist/js/Chart.min.js"></script>
    <!--<script src="bootstrap-3.3.2-dist/js/Chart.bundle.js"></script>-->
    <script src="bootstrap-3.3.2-dist/js/Chart.bundle.min.js"></script>
   <!-- <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>-->
    <script src="js/jquery/jquery-ui.min.js"></script>
    <script src="src/Flow.js"></script>
    <script src="js/jquery.orgchart.js"></script>

    <script src='bootstrap-3.3.2-dist/js/moment.min.js'></script>
<script src='bootstrap-3.3.2-dist/js/fullcalendar.min.js'></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBFfCNqVs3IPI9VzL7l4E4AY6k8eXWxKlc"></script>
    
    <script src="js/xlsx.full.min.js"></script>

    
    <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
    <script src="https://unpkg.com/leaflet-routing-machine/dist/leaflet-routing-machine.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
    <link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine/dist/leaflet-routing-machine.css" />
    <script src="path/to/qrcode.min.js"></script>
        
     
    
    
    

    
</head>
   <!-- <body oncontextmenu="return false" onkeydown="return false;" onmousedown="return false;">
Your body content
</body>-->
<body >
    
 <div id="header"></div>
        
    <!-- Main -->
<div class="container-fluid" style="margin-top: 60px">
<div class="row">
    
	<div class="col-sm-2" id="LFT-MNU">
      <!-- Left column -->     
        <div class="panel-group" id="accordion">
            <div class="panel panel-default">
      <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse1">Masters</button>                
        </div>
            <div class="panel panel-default">
 <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#approval">Approvals</button>
        </div>
            <div class="panel panel-default">
       
 <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse2">Inventory</button>             
        </div>
            <div class="panel panel-default">          
<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse3">Sales</button>
          
        </div>
            <div class="panel panel-default">   
<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse4">Supply Chain</button>                 
        </div>
            <div class="panel panel-default">

<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#Production"> Production</button>
          
          
        </div>
            <div class="panel panel-default">

<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#PROACC"> Project Accounts</button>
          
          
        </div>
            <div class="panel panel-default">

<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#JOBORD"> Job Orders</button>
          
          
        </div>

            <div class="panel panel-default">

<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#EHRMNU"> Human Resources</button>
          
          
        </div>
            <div class="panel panel-default">

          
<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse5">General Ledger</button>
          
        </div>
            <div class="panel panel-default">
          
<button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse9">Safes & Banks</button>
          
        </div>
            <div class="panel panel-default">
          
                <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse6">Shipping</button>
          
        </div>
            <div class="panel panel-default">
                <button type="button" class="btn btn-info btn-block" data-toggle="collapse" data-parent="#accordion" data-target="#collapse7">Secuirty</button>
          
        </div>
      </div>
           
      
      
  	</div>
    
    <!-- /col-3 -->
    
    <div class="col-sm-10" id="FLW-COL" >
        <div class="container-fluid" id="FLOW">
            <div class="row">
                <div class="col-md-12">
                    
                   <marquee  behavior="scroll" direction="right" SCROLLDELAY=200 BGCOLOR=#ddd style="font-size:20px" id="NEWS"> يمكنك الآن اعداد الاخبار الخاصه بالمؤسسه  </marquee>
                </div>
            </div>
<!-------start Calendar--------->
      
<!-- -----start Calendar--------->
            <div class="row">          
        <div class="col-lg-12">
            <div class="panel panel-info">
               
             <div class="panel-body">
                             
                  <table id="DTLTMP"></table>
                 
                  <ul class="nav nav-defult nav-justified" id="">
                 <li class="active"><a data-toggle="tab" href="#home" class="btn btn-default btn-block"><i class="glyphicon glyphicon-calendar"></i> Calendar</a></li>
                 <li><a onclick="LDPAGE('GLDSH', $('#GLDSH'));" href="#GLDSH" data-toggle="tab" class="btn btn-default btn-block"><i class="glyphicon glyphicon-dashboard"></i> Dashboard</a></li>
                <li><a data-toggle="tab" href="#massages" class="btn btn-default btn-block"><i class="glyphicon glyphicon-envelope"></i> Messages (<b id="MC">0</b>)</a></li>
                       <li><a onclick="LDPAGE('HRREQ', $('#HRREQ'));" href="#HRREQ" data-toggle="tab" class="btn btn-default btn-block" id="SS"><i class="glyphicon glyphicon-user"></i> Self Services</a></li>
                </ul>
                <br />
                <div class="tab-content">
                  <div class="tab-pane active" id="home">
                    
                   <div class="row">
            <div class="col-md-12" id="cc">
                 <div class="panel panel-info">
                <div class="panel-heading">
<h4>Calendar</h4>
                </div>
             <div class="panel-body">
	            <div id="calendar"></div>
                 </div>

                 </div>
            </div>
         </div>
                  </div>
                  <div class="tab-pane" id="GLDSH">
                    <h4><i class="glyphicon glyphicon-wrench"></i></h4>
                    
	
                  </div>
                  <div class="tab-pane" id="massages">
                  <div class="row">
            
        <div class="col-lg-12">

              
 <div class="btn-group btn-group-justified">
   <a href="#" class="btn btn-info" onclick="LDMYSG();"><strong><i class="glyphicon glyphicon-envelope"></i> Message</strong></a> 
  <a href="#" class="btn btn-info" data-toggle="modal" data-target="#Creat"><i class=" glyphicon glyphicon-pencil"></i> Create Message</a>
 <!-- <a href="#" class="btn btn-info" data-toggle="modal" data-target="#MRPT"><i class=" glyphicon glyphicon-pencil"></i> MRPT</a>-->

</div>
             
        <!-- Modal -->
  <!--<div class="modal fade" id="DOCATH" role="dialog" >
    <div class="modal-dialog">
    
     
     
      
    </div>
  </div>-->
       
            <div class="modal fade" id="Creat" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><i class=" glyphicon glyphicon-pencil"></i> Create Message</h4>
        </div>
        <div class="modal-body">
          <form>
<div class="form-group">
    <label>To</label>
    <input type="text" class="form-control" id="USR"/>
    <label>Message</label>
    <textarea class="form-control" rows="5"id="TMSG"></textarea>
              
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal" onclick="send();">Send</button>
        </div>
      </div>
      
    </div> 
            </div>
<!--//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
            //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////-->
             <div class="modal fade" id="MRPT" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"> Save Report Details</h4>
        </div>
        <div class="modal-body">
          <form>
<div class="form-group">
    <label>To</label>
    <input type="text" class="form-control" id="Text1"/>
    <label>Message</label>
    <textarea class="form-control" rows="5"id="Textarea1"></textarea>
              
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal" onclick="send();">Send</button>
        </div>
      </div>
      
    </div> 
            </div>
            </div>
                </div>
       <div class="row">
                <div class="col-md-12">
            <div class="div-table-content">
             
      <table class="table table-bordered" id="USRMSG"></table>
                </div>
     
              	
              </div>
			</div>
                      
                          
                      
                  </div>
                  <div class="tab-pane" id="HRREQ">
                   
                   
                  </div>
                </div>
              	
              </div>
                    
				<div class="clearfix visible-lg"></div>
       
			</div>
		  </div>
        </div>
            <div class="row">
          <div class="col-lg-12">
      <div class="panel panel-info">
          <div class="panel-heading">
              <h4>Personal</h4>
          </div>
             <div class="panel-body">
                             
                    <ul class="nav nav-defult nav-justified" id="myTab">
                
                  <li class="active"><a href="#profile" data-toggle="tab"><i class="glyphicon glyphicon-user"></i> Personal Profile</a></li>
                  <li><a href="#Time" data-toggle="tab"> <i class="glyphicon glyphicon-time"></i> Time & Attendance Record</a></li>
               
                </ul>
                
                <div class="tab-content">
                    
                  <div class="tab-pane active" id="profile">
                    <h4><i class="glyphicon glyphicon-user"></i></h4>
                   <div class="row">
                        <div class="col-lg-9">
                           <div class="row">
                               <div class="col-lg-12">
                                   <div class="well well-sm">
                                       <div class="form-group form-inline">
                                           <label>User ID</label>
                                           <input type="text" class="form-control" name="ID"  id="UID"   readonly="text">
                                           <label>User Name</label>
                                           <input type="text" class="form-control" name="NAME"  id="UNAME"   readonly="text">
                                       </div>

                                   </div>
                               </div>
                           </div>
                           <div class="row">
                               <div class="col-lg-6">
                                   <div class="form-group">
                                       
                                       <label> Name</label>
                                       <input type="text" class="form-control" id="EMPNAM">
                                       <label>E-mail</label>
                                       <input type="text" class="form-control" id="EML"  data-toggle="tooltip"  title="name@domain name.com">
                                       <label>Address</label>
                                       <input type="text" class="form-control" id="ADD">
                                       <label>Tel.</label>
                                       <input type="text" class="form-control" id="TEL1" placeholder="Tel.(1)">
                                       <input type="text" class="form-control" id="TEL2" placeholder="Tel.(2)">
                                       
                                   </div>
                               </div>
                               <div class="col-lg-6">
                                   <div class="form-group">
                                       
                                       <label>Date Of Birth</label>
                                       <input type="text" class="form-control" id="BRDATE">
                                       <label>Gender</label>
                                       <select class="form-control" id="SEX">
                                         <option>..please select..</option>
                                         <option value="0">Male</option>
                                         <option value="1">Female</option>
                                        </select>
                                       <label>Status</label>
                                       <select class="form-control" id="MTRSTATUS">
                                         <option value="-1">..please select..</option>
                                         <option value="1">Single</option>
                                         <option value="2">Married</option>
                                           <option value="3">Widowed</option>
                                           <option value="4">Divorced</option>
                                        </select>
                                   </div>
                               </div>
                           </div>
                       </div>
                       <div class="col-lg-3">
                 <div class="btn-group">
                     <!--<button type="button" class="btn btn-info" id="IMPIMG"><span class="glyphicon glyphicon-file"></span> Select</button>
                      <button type="button" class="btn btn-info" id="IMGUPL" onclick="UploadPic();"><span class="glyphicon glyphicon-cloud-upload"></span> Upload</button>

                     <!-- <button type="button" class="btn btn-default" id="GETFIL"><span class="glyphicon glyphicon-cloud-download"></span> Download</button>-->
                        <!--  <input type='file' id="asd" accept="image/*" style="display: none;" />

                               <button class="btn btn-default"><span class="glyphicon glyphicon-camera"></span></button> 
                              <button class="btn btn-default" onclick="OPN();"><span class="glyphicon glyphicon-folder-open"></span></button>
                              <button class="btn btn-default"><span class="glyphicon glyphicon-cloud-upload"></span></button>  
                          </div>          -->
                      <button  class="btn btn-default" onclick="OPN();" data-toggle="tooltip"  title="Select File"><span class="glyphicon glyphicon-folder-open"></span></button>
							`<input type='file' id="asd" accept="image/*" style="display: none;" multiple />
                              <button class="btn btn-default" onclick="UPL();" data-toggle="tooltip"  title="Upload File"><span class="glyphicon glyphicon-cloud-upload"></span></button>  
      <img id="IMG" src="../IMAGES/noimage.jpg" alt="..." class="img-thumbnail" style="width:200px; height:250px;">
                          
    
                           
                       </div>
                   </div>
                  </div>
                  <!--<div class="tab-pane" id="messages">
                    <h4><i class="glyphicon glyphicon-time"></i></h4>
                      
                          <div class="col-lg-6">
                              <div class="form-group">
                                  <label>start date</label>
                        <div class="input-group">
                        <input type="date" class="form-control" id="Date1">
                         <span class="input-group-addon" id="Span2"><i class="glyphicon glyphicon-calendar"></i></span>
                            </div>
                        <label>End Date</label>
                        <div class="input-group">
                        <input type="date" class="form-control" id="Date2">
                            <span class="input-group-addon" id="Span3"><i class="glyphicon glyphicon-calendar"></i></span>
                            </div>
                                 
                              </div>
                          </div>
                      
                   
                          <div class="col-lg-6">
                              <h4>My Records <a href="#"> <span class="glyphicon glyphicon-refresh"></span> </a></h4>
                              <table class="table  table-hover">
    <thead>
        <tr  class="info">
            <th>Date</th>
            <th>Type</th>
            <th>Time</th>
            
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
           
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
         
        </tr>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
           
        </tr>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
          
        </tr>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
            
        </tr>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
           
        </tr>
        <tr>
            <td>Content 1</td>
            <td>Content 2</td>
            <td>Content 3</td>
           
        </tr>
    </tbody>
</table>
                          </div>
                      </div>-->
	
                  
                  
                        
                </div>
                    <div class="tab-pane" id="Time">
                    <div class="row">
                        <div class="col-md-4">
                            <label>From Date</label>
								<div class="input-group">
									<input type="date" class="form-control" id="FD" value="2026-05-01" />
									<span class="input-group-addon" id="Span5"><i class="glyphicon glyphicon-calendar"></i></span>
								</div>
					</div>
                        
                         
                        <div class="col-md-4">
                            <label>To Date</label>
								<div class="input-group">
									<input type="date" class="form-control" id="LD" value="2026-05-18" />
									<span class="input-group-addon" id="Span2"><i class="glyphicon glyphicon-calendar"></i></span>
								</div>
					</div>
                              
                        <div class="col-md-4">
                            <br />
                              <button type="button" class="btn" onclick="REF();">Refresh </button>

					</div>
                       
                        </div>
                        <div class="row">
                        	<table id="DTL" class="table table-striped table-bordered">
                                </table>
                        </div>
                  </div>
              	
              </div>
                    
         <div class="clearfix visible-lg"></div>
       
</div>
  
      	</div>
      	</div>
            
         
      
		
			
		<div class="row">
			<div class="col-lg-12"> 
				<div class="panel panel-info">
					<div class="panel-heading"><h4>Did you know</h4></div>
					<div class="panel-body">
						<div id="myCarousel" class="carousel slide" data-ride="carousel">

							<!-- Wrapper for slides -->
							<div class="carousel-inner">
								<div class="item active">
									<p style="text-align:center; font-size:larger">لتكبير الشاشة اضغط على علامة FloW اعلى اليسار</p>
								</div>
                                <div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل التعامل بالعملات علي الخزن والبنوك</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل إستيراد المستندات للمخازن والمبيعات والمشتريات</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل إستيراد الإيصالات للخزن والبنوك</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل إرفاق الصور لمستندات المخازن والمبيعات والمشتريات</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل إرفاق الصور لإيصالات الخزن والبنوك</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل إرسال التقرير بالبريد الإلكتروني</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تصحيح عناوين التقارير عند تصدير المستندات</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">يمكن وضح شاشة محددة للمستخدم بحيث تكون هي الصفحة الرئيسية له</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل خاصية الدخول الي الحساب مباشراً كالتالي <br />app.mcbs-global.com/?ACC=رقم الحساب</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">يمكن ربط المستخدم علي عميل معين لتسهيل إنشاء مستخدمين للعملاء</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">يمكن وضع البريد الإلكتروني الخاص بالمستخدم علي النظام بحيث يقوم بإرسال الرسائل من خلالة بدل من البريد الإلكتروني للنظام</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم إضافة معالجة الرصيد للخزن</p>
								</div>
								<div class="item">
									<p style="text-align:center; font-size:larger">تم تفعيل كشف حساب الجهات تفصيل، مختصر</p>
								</div>
							</div>
							
							<!-- Left and right controls -->
							<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
							  <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
							  <span class="sr-only">Previous</span>
							</a>
							<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
							  <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
							  <span class="sr-only">Next</span>
							</a>
							
						</div>
					</div>
				</div>
			</div>
		</div>
			
        
            
        
       
     
  
      
  	</div><!--/col-span-9-->
</div>
    <!--/col-span-9-->
        
</div>
    <p></p>
    <p></p>
</div>
<div id="footer">
    </div>
    <div id="IMPDTA">
<div id="IMPFIL" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-header">
         <button id="Button2" type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="H2"><span class="glyphicon glyphicon-picture"></span> Import Data File</h4>
      </div>
      <div class="modal-body">
          <form class="form col-md-12 center-block">
              <div class="form-group">
              <div id ="IMPFRM"></div>
            </div>
            <div class="form-group">
              
            </div>
            <div class="form-group">
              
            </div>
              <div class="form-group">
              
            </div>
            <div class="form-group">
                <label id="Label1">Select File To Upload</label>
                                <button class="btn btn-primary btn-block" onclick="GETTEMPLATE();" type="button">Download Template</button>
                <button class="btn btn-primary btn-block" onclick="$('#ImpFile').trigger('click');" type="button">Select File</button>
                <button class="btn btn-primary btn-block" onclick="IMPDTA();" type="button">UpLoad</button>
            </div>              
              <input type="hidden" id="IMPTXT" value="" />
              <input type="hidden" id="IMP_MASNA" value="" />
              <input type="hidden" id="IMP_FLD" value="" />
              <input type="hidden" id="IMP_SLKEY" value="" />
              </form>
          
      </div>
      <div class="modal-footer">
          	
      </div>
  </div>
  </div>
</div></div>
    <div id="login">
<div id="loginModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-header">
          <h2 class="text-center">Login</h2>
      </div>
      <div class="modal-body">
          <form class="form col-md-12 center-block">
              
            <div class="form-group">
              <input id="USRID" type="text" class="form-control" placeholder="User Name">
            </div>
            <div class="form-group">
              <input id="PASS" type="password" class="form-control" placeholder="Password">
            </div>
              <div class="form-group">
              <select class="form-control" id="LNG">
                  <option value ="ENG">English</option> 									
					<option value ="ARB">Arabic</option>
                                   
                </select>
            </div>
              <div class="form-group">
                  <input id="RMMBR" type="checkbox"> Remember Me
              </div>
            <div class="btn-group">
                <button type="button" class="btn default" id="default" onclick="CHGTHM('default');"></button>
			</div>
               <div class="btn-group">
                 <button type="button" class="btn green" id="green" onclick="CHGTHM('Green');"></button>
			</div>
               <div class="btn-group">
                <button type="button" class="btn red" id="red" onclick="CHGTHM('Red');"></button>
			</div>
               <div class="btn-group">
                <button type="button" class="btn orange" id="orange" onclick="CHGTHM('Orange');"></button>
			</div>
               <div class="btn-group">
               <button type="button" class="btn lightblue" id="lightblue" onclick="CHGTHM('Light');"></button>
			</div>
              <div class="btn-group">
                 <button type="button" class="btn darkblue" id="darkblue" onclick="CHGTHM('DarkBlue');"></button>
			</div>
            <div class="form-group">
                <label id="STS">Please Login</label>
              <button class="btn btn-primary btn-block" onclick="CMDCHK();" type="button">Sign In</button>
            </div>
          
          </form>
      </div>
      <div class="modal-footer">
          	
      </div>
  </div>
  </div>
</div></div>

    <div id="SYS" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" >
  <div class="modal-dialog">
  <div class="modal-content">      
      <div class="modal-body">
          <div class="row">
              <div class="col-lg-4"></div>
              <div class="col-lg-4"><img src="images/pleasewait.gif" /></div>
              <div class="col-lg-4"></div>
          </div>
          <div class="row">
              <div class="col-lg-4"></div>
              <div class="col-lg-4"><h4 id="MSG">Loading ... </h4></div>
              <div class="col-lg-4"></div>
          </div>
          
           
          
      </div>
  </div>
  </div>
</div>

    <div id="CHGPASS" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-header">
        <button id="CHGPASS_Close" type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"><span class="glyphicon glyphicon-picture"></span> Change Password</h4>
      </div>

      <div class="modal-body">
          <form class="form col-md-12 center-block">
              <div class="form-group">
              <input id='CPASS' type='password' class='form-control' placeholder='Current Password'>
            </div>
            <div class="form-group">
              <input id="NPASS" type="password" class="form-control" placeholder="New Password">
            </div>
            <div class="form-group">
              <input id="NPASS2" type="password" class="form-control" placeholder="ReEnter Password">
            </div>
            <div class="form-group">
                <label id="STSPAS">Fill The Passwords</label>
              <button class="btn btn-primary btn-block" onclick="CHGPSS();" type="button">Change Password</button>
            </div>
          </form>
      </div>
      <div class="modal-footer">
          	
      </div>
  </div>
  </div>
</div>

    <div id="MYMSG" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-header">
        <button id="Button1" type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="H1"><span class="glyphicon glyphicon-remove"></span> System Alert</h4>
      </div>

      <div class="modal-body">
          
            <div class="row">
              <div class="col-lg-1"></div>
              <div class="col-lg-10"><h4 id="MSGTXT">Loading ... </h4></div>
              <div class="col-lg-1"></div>
          </div>
              <button id="MSGOK" class="btn btn-primary btn-block" data-dismiss="modal" type="button" autofocus >OK</button>
            </div>          
      </div>
      <div class="modal-footer">
          	
      </div>
  </div>
  </div>

    <div class="modal fade" id="EVNINF" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><i class=" glyphicon glyphicon-pencil"></i> Details</h4>

        </div>
        <div class="modal-body">
           <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label>Privacy</label>
                    <select class="form-control" id="CLNTYP">
                        <option value="A">Public</option>
                        <option value="P">Personal</option>
                        <option value="G">Group</option>
                    </select>
                    <div id="GRP">
                        
                    <label>Group</label>
                                <select class="form-control" id="GRPNO">
									<option value="-1">--Please select--<option>
								</select>
                        </div>
                    <label> Description</label>
                    <textarea class="form-control" rows="4" id="CLNDES" ></textarea>
                    <div id="STATS">
                        <label>Status</label>
                        <select class="form-control" id="STATUS">
                            <option value="A">Not Started</option>
                            <option value="P">Pending</option>
                            <option value="F">Finished</option>
                        </select>
                    </div>
                    <input type="checkbox"  id="TSK" /> Task <br />
                    <div class="btn-group" id="savbtn">
                        <br /><button type="button" class="btn btn-info" id="Button5" onclick="SAVEVN()">Save</button>
					</div>
                    <div class="btn-group" id="Div1">
                        <br /><button type="button" class="btn btn-info" id="Button3" onclick="DELEVN()">Delete</button>
					</div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                  
                    <label>Date</label>
                    <input type="text" class="form-control"  id="CLNDT" readonly/>
                    <div id="STR">
                        <div class="form-group">
                    <label>Started Date</label>
                    <input type="text" class="form-control"  id="STRDT" readonly/ value="2026-05-18" />
                        </div>  
                        </div> 
                    <label>Start Time</label>
                    <div class="input-group">
                         <input type="time" class="form-control" id="STRTM"/><span class="input-group-addon" id="basic-addon1"><i class="glyphicon glyphicon-time"></i></span>
                    </div>
                    <label>End Time</label>
                    <div class="input-group">
                        <input type="time" class="form-control"  id="ENDTM" /><span class="input-group-addon" id="Span1"><i class="glyphicon glyphicon-time"></i></span>
                    </div>
                </div>
            </div>
            </div>
        </div>

        </div>
      </div>
      
    </div>

  
      
    </div>
     <form id="form2">
           <div class="modal fade" id="DOCATH"  role="dialog">
    <div class="modal-dialog modal-lg ">
    
      <!-- Modal content-->
     <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Upload/Download Files</h4>
        </div>
                            <div class="panel-body">                
                    <div class="row">
                        	<div class="col-md-6 border-right">
                                <label>Upload File</label>
                                <br />
        <div class="btn-group">
            <input type="file" class="form-control" id="files"  name="files[]" multiple />
                        <button type="button" class="btn btn-info" id="IMGUPL" onclick="UploadFiles();"><span class="glyphicon glyphicon-cloud-upload"></span>Upload</button>
					</div>
                               
					<div class="div-table-content">
                        <table class="table table-striped table-bordered" id="SLFIL">
                            <thead>
                                                <tr>
                                                    <th class="text-left">File Name</th>
							                        <th class="text-left">Size</th>
							                        <th class="text-left">Progress</th>
													<th class="text-left">Number</th>
                                                    <th class="text-left">Remove</th>
                                                </tr>
                                            </thead>
                             <tbody>                                             
                                            </tbody>
                        </table>

                       
                    </div>
			
                                </div>
                         <div class="col-md-6">
                              <label>Uploaded File</label>
           <div class="div-table-content">
                        <table class="table table-striped table-bordered" id="DTLFIL">
                            </table>

                        </div>
                     </div>
                        </div>
    </div>
          
         

        <div class="modal-footer">
         <!-- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
        </div>
      </div>

        </div>
      </div>
       
    </form>
    <form id="form1">
           <div class="modal fade" id="JOBORD"  role="dialog">
    <div class="modal-dialog modal-lg ">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><i class=" glyphicon glyphicon-pencil"></i> Event Details</h4>

        </div>
        <div class="modal-body">
           <div class="row">
            <div class="col-md-4">
                <div class="form-group">
                    <label>DOCNO</label>
                    <input type="text" class="form-control"  id="DOCNO" readonly/>

         <input type="hidden" id="SHPID" />
					</div>
                </div>
               <div class="col-md-4">
                <div class="form-group">
                    <label>Work Center</label>
                    <input type="text" class="form-control"  id="SHPNA" readonly/>
					</div>
                </div>
               <div class="col-md-4">
                <div class="form-group">
                    <label>Customer</label>
                    <input type="text" class="form-control"  id="CNAME" readonly/>
					</div>
                </div>
               </div>
           <div class="row">
            <div class="col-md-12">
                <div class="form-group">
                  <table id="DTL" class="table table-striped table-bordered" >
					</table>
                    
                </div>
                 </div>
            </div>

            </div>
        </div>

        </div>
      </div>
        <input type="hidden" id="SD" value="" />
         <input type="hidden" id="SRCOPC" value="" />                 
        <input type="hidden" id="EMPNM" value=""/>
        <input type="hidden" id="MTRSTS" value=""/>
        <input type="hidden" id="TEL" value=""/>
        <input type="hidden" id="EMPADD" value=""/>
        <input type="hidden" id="EMPSEX" value=""/>
        <input type="hidden" id="EMAIL" value=""/>
        <input type="hidden" id="BRDT" value=""/>
    </form>
        
	<input type="hidden" id="USRLOG" value="N" />
    <input type="hidden" id="ACC" value="118" />
    <input type="hidden" id="CPAGE" value="" />
    <input type="hidden" id="APISRV" value='https://api.mcbs-global.com' />
    <input type="hidden" id="LOGSRV" value='https://login.mcbs-global.com' />
    <input type="hidden" id="APIKEY" value="" />
	<input type="hidden" id="CUSER" value="" />
    <input type="hidden" id="MCHID" value="" />
    <input type="hidden" id="CLNG" value='ENG' />
    <input type="hidden" id="FILEID" />
    <input type="hidden" id="SECID" />
    <input type="hidden" id="DOCID1" />
    <input type="hidden" id="CLNID" />
      <input type="hidden" id="IMGID" />
      <input type="hidden" id="THM" />
    <input type="hidden" id="HRNO" value=""/>
    <input type="hidden" id="USRNA" value=""/>
    <input type='file' id="ImpFile" accept="text/plain" style="display: none;" />
    <div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>
    <svg id="l"></svg>
  <!--Dashboards-->
     <form id="FRMRPTGEN">
    <div class="modal fade" id="RPTGEN" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-lg">
    
     
       <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><i class=" glyphicon glyphicon-pencil"></i> Report Genrator</h4>
        </div>
        <div class="modal-body">
                <div class="row">
			<div class="col-md-6">
                            <div class="form-group">
                                <label>Dashbord ID</label>
                                 <select class="form-control" id="DSHID">
                                      
                               </select>
                                
                           
                                <label>Report Title</label>
                            <input type="text" class="form-control" id="RPTTIT"/>
                                  
                            </div>
                        </div>
                        <div class="col-md-6">
                            <label>Report Options</label>                            
                            <select class="form-control" id="TYP">
                                <option value="R">Report</option>      
                                <option value="C">Chart</option>      
                               </select>
                            <input type="hidden" id="OPT"/>
                                                                                  
                            <label>Show Col.</label>
                            <input type="text" class="form-control" id="SHWCOL"/>
                                 <input type="hidden" id="RPTNA" name="RPTNA"/>                                
                        </div>
                    </div>
                <fieldset class="scheduler-border">
                       <legend>Series </legend>
                      <div class="row" id="CLRS">
                             <div class="col-md-2">
                                   <label>S1</label>
                                 <input type="color" class="form-control" id="S1" value="#000040">
                                  
                                 </div>
                          <div class="col-md-2">
                               <label>S2</label>
                                  <input type="color" class="form-control" id="S2" value="#8a8aff">
                          </div>
                          <div class="col-md-2">
                                <label>S3</label>
                               <input type="color" class="form-control" id="S3" value="#0000a0">
                              
                                 </div>
                          <div class="col-md-2">
                                <label>S4</label>
                               <input type="color" class="form-control" id="S4" value="#5555ff">
                          </div>
                          <div class="col-md-2">
                                <label>S5</label>
                               <input type="color" class="form-control" id="S5" value="#0000ff">
                              
                                 </div>
                          <div class="col-md-2">
                                <label>S6</label>
                               <input type="color" class="form-control" id="S6" value="#000080">
                          </div>
                          </div>
                    </fieldset>
                      
        </div>
        <div class="modal-footer">
          <button type="button" id="SAVDSH" class="btn btn-default" data-dismiss="modal" onclick="SAVRPTGEN();">Save</button>
        </div>
      </div>
      
    </div> 
            </div>
       
       </form>
   
    <!--<div class="modal fade" id="" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
       <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><i class=" glyphicon glyphicon-pencil"></i> Report Genrator</h4>
        </div>
        <div class="modal-body">
                     <div class="row">
			<div class="col-md-6">
                            <div class="form-group">
                                <label>Dashbord ID</label>
                                 <select class="form-control" id="DSHID">
                                      
                               </select>
                                <input type="hidden" id="TYP" />
                           

                                <label>Report Title</label>
                            <input type="text" class="form-control" id="RPTTIT"/>
                                  
                            </div>
                        </div>
                        <div class="col-md-6">
                            <label>Report Options</label>                            
                            <textarea  class="form-control" id="OPT"/>                            
                          
                                                            <label>Show Col.</label>
                                 <textarea  class="form-control" id="SHWCOL"/>  
                              
                             <div class="checkbox">
                                    <label><input type="checkbox" id="CHRT" />Chart</label>
                                  
								</div>
                        </div>
                    </div>
                      
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal" onclick="SAVRPTGEN();">Save</button>
        </div>
      </div>
      
    </div> 
            </div>-->
    <!--Dashboards-->
</body>
</html>


<!-- Table Style -->

<!--<style>
       .tablescroll
{ font: 12px normal Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif; background-color:#fff; }

.tablescroll td, 
.tablescroll_wrapper,
.tablescroll_head,
.tablescroll_foot
{ border:1px solid #ccc; }

.tablescroll td
{ padding:3px 5px; }

.tablescroll_wrapper
{ border-left:0; }

.tablescroll_head
{ font-size:11px; font-weight:bold; background-color:#eee; border-left:0; border-top:0; margin-bottom:3px; }

.tablescroll thead td
{ border-right:0; border-bottom:0; }

.tablescroll tbody td
{ border-right:0; border-bottom:0; }

.tablescroll tbody tr.first td
{ border-top:0; }

.tablescroll_foot
{ font-weight:bold; background-color:#eee; border-left:0; border-top:0; margin-top:3px; }

.tablescroll tfoot td
{ border-right:0; border-bottom:0; }

.div-table-content {
  height:400px;
  overflow-y:auto;
 /*white-space: nowrap;*/
}
    </style>-->
<style>
    .border-right {
    border-right: 2px solid #ddd;
}

</style>

<!--<a href="#"  data-toggle="collapse" data-target="#MS" style="color:#000000">message message message message message message</a>
  <div id="MS" class="collapse">
   message message message message message message
      message message message message message message
      message message message message message message
  </div>-->
 
<script>
    var TXTM = [];
    function pc() {
        GETFILE($('#HIMG'), "FLOW", $('#CUSER').val(), "1", "1");
        $('#udes').text("Log out " + $('#USRNA').val());
    }    
    $(window).load(function () {
        $('#loginModal').modal('show');
        //LDMNU();
    });
    function DELMSG(r) {
        var t = confirm("Are you sure!!")
        if (!t) {
            return;
        }
        var SL = "MSGDEL" + "," + r;
        EXECMD($('#form1'), SL, LDMYSG);

    };
    $(document).ready(function () {
        $(document).bind("contextmenu", function (e) {
            e.preventDefault();

        });
        $(document).keydown(function (e) {
            if (e.which === 123 ) {

                return false;

            }
            if ((e.shiftKey && e.keyCode != '1'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '2'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '3'.charCodeAt(0))
               && (e.shiftKey && e.keyCode != '4'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '5'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '6'.charCodeAt(0))
                 && (e.shiftKey && e.keyCode != '7'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '8'.charCodeAt(0)) && (e.shiftKey && e.keyCode != '9'.charCodeAt(0))
                 && (e.shiftKey && e.keyCode != '0'.charCodeAt(0)))
            {
                return false;
            }
           
            //if (e.shiftKey && e.keyCode != '3'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '4'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '5'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '6'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '7'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '8'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '9'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode != '0'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode == ''.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode == '1'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.shiftKey && e.keyCode == '1'.charCodeAt(0)) {
            //    return false;
            //}

           

            if ((e.ctrlKey && e.keyCode != 'A'.charCodeAt(0)) && (e.ctrlKey && e.keyCode != 'V'.charCodeAt(0)) && (e.ctrlKey && e.keyCode != 'C'.charCodeAt(0)) && (e.ctrlKey && e.keyCode != 'F'.charCodeAt(0)) && (e.ctrlKey && e.keyCode != 'S'.charCodeAt(0))) {
              
                return false;
            }
            //if (e.ctrlKey && e.keyCode == 'A'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'S'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'H'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'A'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'E'.charCodeAt(0)) {
            //    return false;
            //}
            //if (e.ctrlKey && e.keyCode == 'C'.charCodeAt(0)) {
            //    return false;
            //}

        });
        function handleFileSelect(evt) {
            var files = evt.target.files; // FileList object
			$("#SLFIL > tbody").html("");
			var ID=1;
            // Loop through the FileList and render image files as thumbnails.
            for (var i = 0, f; f = files[i]; i++) {

                // Only process image files.
                //if (!f.type.match('image.*')) {
                //    continue;
                //}
                
                var reader = new FileReader();

                // Closure to capture the file information.
                reader.onload = (function (theFile) {
                    return function (e) {
                        // Render thumbnail.
                        var span = document.createElement('span');
                        var T = "<tr>";
                        T += "<input type='hidden' id='data' value='" + e.target.result + "' />";
                        T += "<td>" + theFile.name + "</td>";
                        T += "<td>" + theFile.size + "</td>";
                        T += "<td><div class='progress' id='PRG'><div id='bar' class='progress-bar progress-bar-info' role='progressbar'></div ><div class='percent'>0%</div ></div></td>";
						T += "<td>" + ID + "</td>";
                        T += "<td>" + "<button type='button' onclick='CDLT_Click(this);' class='btn btn-default' style='text-align:left;'><span class='glyphicon glyphicon-floppy-remove'></span></button>";
                        T += "</tr>";
                        $("#SLFIL > tbody").append(T);   
						ID++;
                    };
                })(f);

                // Read in the image file as a data URL.
                reader.readAsDataURL(f);
            }
        }
        document.getElementById('files').addEventListener('change', handleFileSelect, false);
        $("#DTLFIL").on("dblclick", "td", function (event) {

            $('#IMGID').val($(this).closest('tr').find('td:eq(0)').text());

            DownloadFile();
        });
      //  alert($('#HRNO').val());
        //    //    //GETREQ;        
        //
 	$("#footer").load("../src/COMMON/footer.html");
       
        if (typeof (Storage) !== "undefined") {
            if (localStorage.USRID) {
                $('#USRID').val(localStorage.USRID);
                $('#PASS').val(localStorage.PASS);
                //$('#ACC').val(localStorage.ACCNO);
                $('#LNG').val(localStorage.LANG);
                $('#RMMBR').prop('checked', true);
                CMDCHK();
            }

        }
        ;
        $('#STR').hide();
        $('#GRP').hide();
        $('#DTLTMP').hide();
        $('#DTLTMP').empty();
        var events = [];
        var i = 0;        
        //functuions to import
        $("#ImpFile").change(function () {
            readImpFile(this);

        });
       
        //$('#HRNO').change(function () {
        //    $('#EMPNO').val($('#HRNO').val());
            
        //    $('#EMPNO').trigger("change");
        //});
       
        //$("#SS").click(function () {
        //    setTimeout(function () {
        //        alert($('#EMPNO').val());
        //      //  $('#EMPNO').trigger("change");
        //    }, 1000);
        //   // $('#HRNO').trigger("change");

        //});
        if ($('#USRLOG').val() == "Y") {
            GETUSR();
            GETCAL();
            LDMYSG();
        }
        $('#CUSER').change(function () {
            if ($('#USRLOG').val() == "Y") {
                GETUSR();
            }
        });
        $('#CLNTYP').change(function () {

            if ($('#CLNTYP').val() == 'G') {
                $('#GRP').show();
            }
            else {
                $('#GRP').hide();
            }
        });
        $('[data-toggle="tooltip"]').tooltip({
            placement: 'top'
        });
        function readImpFile(input) {
            if (input.files[0].size > 1000000) {
                alert("File Is too Large");
                return;
            }
            if (input.files && input.files[0]) {
                var FR = new FileReader();
                FR.onload = function (e) {
                    $('#IMPTXT').val(e.target.result);
                };
                FR.readAsText(input.files[0]);
            }
        };
        $("#login").keydown(function (event) {
            if (event.keyCode == 13) {
                CMDCHK();
            }
        });
       

    });
   
    function send() {
        var SL;
        SL = "MSGSND,";
        SL += "USR=" + $('#USR').val() + String.fromCharCode(11);
        SL += "MSG=" + $('#TMSG').val() + String.fromCharCode(11);
        SL += String.fromCharCode(15);
        EXECMD($('#form1'), SL);
        $("#USR").val("");
        $("#TMSG").val("");
        return;
    }
    function LDMYSG() {
        var SL = "RPTNA=MYMSG" + String.fromCharCode(11)
        GENTBL(SL, $('#USRMSG'), $('#USRMSG'), SETMC);
        // fill the news bar			 
    }
    function SETMC() {
        var i = 0;
        $("tr", "#USRMSG tbody").each(function (index, elem) {
            i++;
        });
        $('#MC').text(i);
    }
    function CMDCHK() {
        var ACCNO = ACC.value;		
        if (USRID.value == "") {
            STS.textContent = "Please Enter Your User ID";
            $('#USRID').focus();
            return;
        }
        if (PASS.value == "") {
            STS.textContent = "Please Enter Your Password";
            $('#PASS').focus();
            return;
        }
        if (typeof (Storage) !== "undefined") {
            localStorage.LANG = $('#LNG').val();
        }
        if (document.getElementById("RMMBR").checked) {
            if (typeof (Storage) !== "undefined") {
                localStorage.USRID = $('#USRID').val();
                localStorage.PASS = $('#PASS').val();
                //localStorage.ACCNO = $('#ACC').val();
            }
        }
        else {
            localStorage.USRID = "";
        }
        CHKUSR(ACCNO, USRID.value, PASS.value, LNG.value, GETCAL);
        $('#CLNG').val($('#LNG').val());
        MSGTXT = "Connecting Please Wait ..";

        if ($('#CLNG').val() == "ARB") {
            $("body").css("font-size", "16px");
            MSGTXT = "جارى الاتصال .. يرجى الانتظار";
        }
        STS.textContent = MSGTXT;

    };
   
    function CHGPSS() {
        if (CPASS.value == "") {
            STSPAS.textContent = "Enter Current Password";
            return;
        }
        if (NPASS.value == "") {
            STSPAS.textContent = "Enter New Password";
            return;
        }
        if (NPASS2.value == "") {
            STSPAS.textContent = "Re-Enter New Password";
            return;
        }
        if (NPASS.value != NPASS2.value) {
            STSPAS.textContent = "New Password Dosn't Match";
            return;
        }
        if (NPASS.value.length < 6) {
            STSPAS.textContent = "Password Must be 6 characters at least";
            return;
        }
        var CHKNUM = false;
        var CHKCHR = false;
        var PSS = NPASS.value;
        while (PSS.length > 0) {
            var r = PSS.substring(0, 1);
            PSS = PSS.substring(1);
            if (IsNumeric(r)) {
                CHKNUM = true;
            }
            else {
                CHKCHR = true;
            }
        }
        if (!CHKCHR) {
            STSPAS.textContent = "New Password Must contain both digits and characters";
            return;
        }
        if (!CHKNUM) {
            STSPAS.textContent = "New Password Must contain both digits and characters";
            return;
        }
        CHGPAS(PASS.value, NPASS.value);
    };
    function SHOWCHG() {
        $('#CHGPASS').modal('show');
    };
    
    function CHGTHM(THEME) {
       
        if ($('#USRID').val() != "") {
            
                localStorage.USR = $('#USRID').val();
            } else {
                localStorage.USR = $('#CUSER').val();
            }
            $('#THM').val(THEME);
            localStorage.THEME = "bootstrap-3.3.2-dist/css/"+THEME+".css";
            $("#theme").attr("href", "bootstrap-3.3.2-dist/css/" + THEME + ".css");
        
        }
   

    function SHOWPAGE(PAGE) {
        LDPAGE(PAGE, $('#FLOW'));
           
        // GETFILE($('#HIMG'), "FLOW", $('#CUSER').val(), "1", "1");
    }
    //function SHOWPIC() {
           
    //    GETFILE($('#HIMG'), "FLOW", $('#CUSER').val(), "1", "1");
    //}
    function showMnu() {
        $("#LFT-MNU").toggle();
        if (document.getElementById('FLW-COL').className == "col-sm-9") {
            document.getElementById('FLW-COL').className = "col-sm-12";
        }
        else {
            document.getElementById('FLW-COL').className = "col-sm-9";
        }            
    }
    function OrignalDate() {
        $('#STRDT').val($('#SD').val());
    }
    function GSTRDT() {
        SL = "SELECT CLNDT AS 'SD' FROM CLNDTL WHERE TSK='Y' AND  CLNID=" +  $('#CLNID').val();
        GETREC($("#form1"), SL,OrignalDate);            
    }       
    function GETCNAME() {
        SL = "SELECT CNAME,SHPID FROM JOBHDR WHERE DOCNO=" + $('#DOCNO').val();
            
        GETREC($("#form1"), SL, GETSHP);
    }
    function GETSHP() {
        SL = "SELECT SHPNA FROM JOBSHOP WHERE SHPID=" + $('#SHPID').val();
        GETREC($("#form1"), SL);
    }
    function EMPTYCLN() {
        $('#SRCOPC').val("");
        $('#CLNID').val("");
        $('#CLNDT').val("");
        $('#STRTM').val("");
        $('#ENDTM').val("");
        $('#CLNDES').val("");
        $('#CLNID').val("");
        $('#STATUS').val("A");
    }
    function GETCAL() {

        if (localStorage.THEME) {
            if (localStorage.USR != "" && (localStorage.USR == $('#USRID').val() || localStorage.USR == $('#CUSER').val())) {
                $("#theme").attr("href", localStorage.THEME);

            }
        }
        // fill the news bar
        FillNews();
        //       var SL = "SELECT CLNID FROM CLNDTL ";
        //    LDTBL(SL, $('#DTLTMP'), $('#DTLTMP'), GETINFO);
        SL = "RPTNA=GETCLNDTL" + String.fromCharCode(11);
        SL += ReadForm($('#form1'));
        while (SL.indexOf(";") > -1) {
            SL = SL.replace(";", String.fromCharCode(11));
        }
        SL += String.fromCharCode(11);
        GENTBL(SL, $('#DTLTMP'), $('#DTLTMP'), GETINFO);
        if (localStorage.LANG == "ARB") {
            $("body").css("font-size", "16px");
        }
        SL = "SELECT GRPNO,GRPNA FROM CONGRP WHERE CCODE = 'USR'";
        FillCombo($("#GRPNO"), SL);
		var SL = "SELECT DSHID,DSHNA FROM DSHMAS ORDER BY DSHID";
		FillCombo($("#DSHID"), SL);
    }
    function GETUSR() {                
        GETFILE($('#IMG'), "FLOW", $('#USRID').val(), "1", "1");
        GETFILE($('#HIMG'), "FLOW", $('#USRID').val(), "1", "1");
        $('#UID').val($('#CUSER').val());
        $('#UNAME').val($('#USRNA').val());
        $('#udes').text("Log out " + $('#USRNA').val());        
        if (IsValue($('#HRNO'))) {
            
            //$('#RQEMPNO').val($('#HRNO').val());
            //$('#RQEMPNO').trigger('change');
            SL = "select EMPNM,TEL,EMPADD,EMPSEX,EMAIL,BRDT,MTRSTS from EMPMAS WHERE EMPNO=" + $('#HRNO').val();
            GETREC($("#form1"), SL, GETEMP);
          
        }
        $('#header').load('../src/header-m.html', pc);
        $('#udes').text("Log out " + $('#USRNA').val());
    }
    function GETEMP() {
      
        $('#EMPNAM').val($('#EMPNM').val());
        $('#TEL1').val($('#TEL').val());
        $('#ADD').val($('#EMPADD').val());
        $('#SEX').val($('#EMPSEX').val());
        $('#EML').val($('#EMAIL').val());
        $('#BRDATE').val($('#BRDT').val());
        $('#MTRSTATUS').val($('#MTRSTS').val());
    }
    function SAVEVN() {
        var SL = "CLNCMD,SAVCLN,";
        SL += ZIPDOC();
        EXECMD($('#form1'), SL,GETCLN);
    }
    function DELEVN() {
        var SL = "CLNCMD,DELCLN,";
        SL += ZIPDOC();
        EXECMD($('#form1'), SL, GETCLN2);
    }
    function ZIPDOC() {
        var SL;
        SL = "CLNID=" + $('#CLNID').val() + String.fromCharCode(11);
        SL += "CLNDES=" + $('#CLNDES').val() + String.fromCharCode(11);
        SL += "CLNDT=" + $('#CLNDT').val() + String.fromCharCode(11);
        SL += "STRTM=" + $('#STRTM').val() + String.fromCharCode(11);
        SL += "ENDTM=" + $('#ENDTM').val() + String.fromCharCode(11);
        SL += "CLNTYP=" + $('#CLNTYP').val() + String.fromCharCode(11);
        SL += "SRCOPC=" + $('#SRCOPC').val() + String.fromCharCode(11);
        SL += "STS=" + $('#STATUS').val() + String.fromCharCode(11);
        if (document.getElementById("TSK").checked)
        {
            SL += "TSK=Y" + String.fromCharCode(11);

        }            
        SL += String.fromCharCode(15);
        return SL;
    };
    function GCLN() {
            
        $('#EVNINF').modal('hide');
        SL = "RPTNA=GETCLNDTL" + String.fromCharCode(11);
        SL += ReadForm($('#form1'));
        while (SL.indexOf(";") > -1) {
            SL = SL.replace(";", String.fromCharCode(11));
        }
        SL += String.fromCharCode(11);
        GENTBL(SL, $('#DTLTMP'), $('#DTLTMP'), GETINFO);
    }
    function GETCLN(data) {
        EMPTYCLN();
        MSGBOX("Data has been saved succefully");
        GCLN();
    }
    function GETCLN2(data) {
        EMPTYCLN();
        MSGBOX("Data has been deleted");
        GCLN();
    }
    
       
    function GETINFO() {
        document.getElementById("cc").innerHTML = '&nbsp;';
        document.getElementById("cc").innerHTML = '<div id="calendar"></div>';
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            //navLinks: true, // can click day/week names to navigate views
            //editable: true,
            //eventLimit: true, // allow "more" link when too many events
            editable: true,
            eventLimit: 4,
            eventRender: function (event, element) {
                element.bind('dblclick', function () {
                    EMPTYCLN();
                    $('#STATS').show();
                    var info = event.id.split(String.fromCharCode(11));
                    if (info[6] == "JOBORD") {
                        SL = "SELECT DOCNO FROM JOBDTL WHERE CLNID=" + info[0];
                        GETREC($("#form1"), SL, GETCNAME);
                        SL = "SELECT JOBDES AS 'Problems' FROM JOBDTL WHERE CLNID=" + info[0];
                        LDTBL(SL, $('#DTL'), $('#DTL'));
                        $('#JOBORD').modal('toggle');
                    }
                    else {
                        $('#CLNID').val(info[0]);
                        GSTRDT();
                        $('#CLNDT').val(info[1]);
                        $('#STRTM').val(info[2]);
                        $('#ENDTM').val(info[3]);
                        $('#CLNDES').val(info[5]);
                        $('#STATUS').val(info[7]);
                        if (info[8] == "Y") {
                            $('#STR').show();
                            $('#TSK').prop('checked', true);
                        } else {
                            $('#STR').hide();
                            $('#TSK').prop('checked', false);
                        }
                        if (info[4] == "Public") {
                            $('#CLNGRP').val("A");
                        }
                        else if (info[4] == "Personal") {
                            $('#CLNGRP').val("P");
                        }
                        else if (info[4] == "Group") {
                            $('#CLNGRP').val("G");
                        }
                        else {
                            $('#CLNGRP').val("");
                        }
                        $('#EVNINF').modal('toggle');
                    }                                
                               
                });
            },
            eventDrop: function (event, dayDelta, minuteDelta, allDay, revertFunc) {
                var info = event.id.split(String.fromCharCode(11));
                if (info[6] == "JOBORD") {
                    MSGBOX("JOBORD Cannot be updated");
                    revertFunc();
                    return;
                }
                if (!confirm("Are you sure about this change?")) {
                    revertFunc();
                }
                else {
                    EMPTYCLN();
                    var info = event.id.split(String.fromCharCode(11));
                    $('#CLNID').val(info[0]);
                    date=new Date(event.start);
                    var dt = (date.getFullYear() + "-" + ('0' + (date.getMonth() + 1)).slice(-2) + "-" + ('0' + date.getDate()).slice(-2)).toString();
                    $('#CLNDT').val(dt);
                    $('#STRTM').val(info[2]);
                    $('#ENDTM').val(info[3]);
                    $('#CLNDES').val(info[5]);
                    $('#SRCOPC').val(info[6]);
                    if (info[8] == "Y") {
                        $('#TSK').prop('checked', true);
                        $('#STR').show();
                    } else {
                        $('#STR').hide();
                        $('#TSK').prop('checked', false);
                    }
                    $('#SRCOPC').val(info[8]);
                    if (info[4] == "Public") {
                        $('#CLNGRP').val("A");
                    }
                    else if (info[4] == "Personal") {
                        $('#CLNGRP').val("P");
                    }
                    else if (info[4] == "Group") {
                        $('#CLNGRP').val("G");
                    }
                    else {
                        $('#CLNGRP').val("");
                    }
                    SAVEVN();
                }
            },
            //dayRender: function (date, element, view) {
            //    element.bind('dblclick', function () {
            //        EMPTYCLN();
            //        $('#STATS').hide();
            //        $('#EVNINF').modal('toggle');
            //        date = new Date(date);
            //        var dt = (date.getFullYear() + "-" + ('0' + (date.getMonth() + 1)).slice(-2) + "-" + ('0' + date.getDate()).slice(-2)).toString();
            //        $('#CLNDT').val(dt);
            //    });
            //}
            dayClick: function (date, jsEvent, view) {
                EMPTYCLN();
                $('#STATS').hide();                            
                $('#EVNINF').modal('toggle');
                date = new Date(date);
                var dt = (date.getFullYear() + "-" + ('0' + (date.getMonth() + 1)).slice(-2) + "-" + ('0' + date.getDate()).slice(-2)).toString();
                $('#CLNDT').val(dt);
                //GSTRDT();
            }
        });
        $("tr", "#DTLTMP tbody").each(function (index, elem) {
            if (elem.cells[9].textContent == "Y") {
                d = new Date(elem.cells[1].textContent);
                c = new Date();
                if (d.getTime() < c.getTime()) {
                    elem.cells[1].textContent = new Date().toISOString().slice(0, 10);
                }
                //$('#STRDT').val(elem.cells[1].textContent);
            }
            strtm = elem.cells[1].textContent + " " + elem.cells[2].textContent;
            strtm = new Date(strtm);
            endtm = elem.cells[1].textContent + " " + elem.cells[3].textContent;
            endtm = new Date(endtm);
                           
            var sd = strtm.getDate();
            var sm = strtm.getMonth();
            var sy = strtm.getFullYear();
            var sh = strtm.getHours();
            var smns = strtm.getMinutes();
       
            var ed = endtm.getDate();
            var em = endtm.getMonth();
            var ey = endtm.getFullYear();
            var eh = endtm.getHours();
            var emns = endtm.getMinutes();
       
            var ids = elem.cells[0].textContent + String.fromCharCode(11) + elem.cells[1].textContent + String.fromCharCode(11);
            ids += elem.cells[2].textContent + String.fromCharCode(11) + elem.cells[3].textContent + String.fromCharCode(11) + elem.cells[5].textContent;
            ids += String.fromCharCode(11) + elem.cells[4].textContent + String.fromCharCode(11) + elem.cells[7].textContent + String.fromCharCode(11);
            ids += elem.cells[8].textContent + String.fromCharCode(11) + elem.cells[9].textContent;
            var titles ="ID : "+ elem.cells[0].textContent;
            if (elem.cells[4].textContent != "" &&  elem.cells[4].textContent != null) {
                titles += "\n" + elem.cells[4].textContent;
            }
          
            // element.css('border', '1px solid #faebcc');
            txtcolor = '#8a6d3b';
            bckgrndcolor = '#fcf8e3';
            border= '#faebcc';
            if (elem.cells[8].textContent == "F") {
                txtcolor = '#3c763d';
                bckgrndcolor = '#dff0d8';
                border= '#d6e9c6';
            }
            else if (elem.cells[8].textContent == "P") {
                txtcolor = '#31708f';
                bckgrndcolor = '#d9edf7';
                border= '#bce8f1';
            }
            if (elem.cells[9].textContent == "Y") {
                           
                txtcolor = '#31708f';
                bckgrndcolor = '#d9edf7';
                border = '#bce8f1';
                if (elem.cells[8].textContent == "F") {
                    txtcolor = '#3c763d';
                    bckgrndcolor = '#dff0d8';
                    border = '#d6e9c6';
                }
                else if (elem.cells[8].textContent == "P") {
                    txtcolor = '#a94442';
                    bckgrndcolor = '#f2dede';
                    border = '#ebccd1';
                }
            }
            $('#calendar').fullCalendar('renderEvent',
                {
                    id: ids,
                    title: titles,
                    start: new Date(sy, sm, sd, sh, smns),
                    end: new Date(ey, em, ed, eh, emns),
                    allDay: false,
                    textColor: txtcolor,
                    backgroundColor: bckgrndcolor,
                    borderColor: border,
                },
                 true // make the event "stick"
             );
        }); 
    }
    $('.modal').on('shown.bs.modal', function () {
        $(this).find('[autofocus]').focus();
    });
    function UPL() {
        UPLIMG('IMG', "FLOW", $('#CUSER').val(), "1", "1");

    }
    function OPN() {

        $("#asd").trigger('click');
    }
    function GETTEMPLATE() {
        var $idown;  // Keep it outside of the function, so it's initialized once.        
        var SL = "http://mcbs-global.com/org/" + $('#IMP_MASNA').val() + ".xlsx";
        if ($idown) {
            $idown.attr('src', SL);
        } else {
            $idown = $('<iframe>', { id: 'idown', src: SL }).hide().appendTo('body');
        }
    }
    function REF() {

        if (!IsValue($('#HRNO'))) {
            MSGBOX("Enter Employee");
            return;
        }
        SL = "RPTNA=GETEHREMPDAY;EMPNO=" + $('#HRNO').val() + ";FD=" + $('#FD').val() + ";LD=" + $('#LD').val() + String.fromCharCode(11);
        SL += ReadForm($('#form1'));
        while (SL.indexOf(";") > -1) {
            SL = SL.replace(";", String.fromCharCode(11));
        }
        console.log(SL);
        GENARR(SL, $('#DTL'), $('#DTL'));
    }
    $("#asd").change(function () {
        ReadImg(this, $('#IMG'));
        ReadImg(this, $('#HIMG'));
    });
	$('#RPTGEN').on('show.bs.modal', function (e) {
        var skillsSelect = document.getElementById("RPTNA");
        var selectedText = skillsSelect.options[skillsSelect.selectedIndex].text;
        $("#RPTTIT").val(selectedText);
        console.log(skillsSelect.value);
        $("#FRMRPTGEN [name=RPTNA]").val(skillsSelect.value);
        $('#DTL').html('');
        var SL1 = ReadForm($('#form1'));
        while (SL1.indexOf(String.fromCharCode(11)) > -1) {
            SL1 = SL1.replace(String.fromCharCode(11), ";");
        }
        $('#OPT').val(SL1);
        var x = '';       
        tab = document.getElementById('DTL'); // id of table        
		if ($.fn.DataTable.isDataTable(tab)) {    
		var table = $('#DTL').DataTable();
        var columns = $(tab).dataTable().dataTableSettings[0].aoColumns;
        $.each(columns, function (i, v) {
            //      alert('Column index '+i+' is ' +
            //    (table.column(i).visible() === true ? 'visible' : 'not visible')
            //);
            if (table.column(i).visible() === true) {
                if (x == '') {
                    x = '[' + i + ']'
                }
                else {
                    x += ',[' + i + ']'
                }
            }

        });
		}
        $("#SHWCOL").val(x);
        
    });
    function SAVRPTGEN() {
        if (!IsValue($("#RPTNA"))) {
            MSGBOX('Select Report');
            return;
        }
        if (!IsValue($("#RPTTIT"))) {
            MSGBOX('Enter Report Title');
            return;
        }
        if ($("#DSHID").val() == "-1") {
            MSGBOX("Enter ID");
            return;
        }        
        SAVMAS($('#FRMRPTGEN'), 'DSHCNF', 'DSHID,RPTTIT');
    };


</script>