 {*<!-- 6.5
 /*+*******************************************************************************
 * The content of this file is subject to the CRMTiger Pro license.
 * ("License"); You may not use this file except in compliance with the License
 * The Initial Developer of the Original Code is vTiger
 * The Modified Code of the Original Code owned by https://crmtiger.com/
 * Portions created by CRMTiger.com are Copyright(C) CRMTiger.com
 * All Rights Reserved.
  ***************************************************************************** */
-->*}
<link href="layouts/vlayout/modules/CTMobileSettings/style.css" rel="stylesheet">
<link href="layouts/vlayout/modules/CTMobileSettings/popup.css" rel="stylesheet">
{literal}
<style>
h4{
font-weight:bold;
font-size:16px;}

.upgrade-button {
background-color: #287DF2;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}

.upgrade{
	width: 150px;
    padding: 2px;
    font-size: 16px;
	cursor:pointer;
	background-color:#178FFF;
	border: 1px solid #178FFF;
	color:#fff;
	border-radius: 4px;
}

.marquee > .overlay{
	z-index: 1111 !important;
}

#checklistTable td {
	text-align: center;
	padding: 5px;
}

#waitmsg{
	text-align: center;
	display: none;
}

.imageHolder{
	background:white !important;
}

#WhatsNew{
	background:#4ad504;    display: inline-block;
    text-transform: uppercase;
    height: 19px;
    line-height: 19px;
    font-size: 9px;
    font-weight: 700;
    color: #fff;
    border-radius: 10px;
    padding: 0 8px;
}

.containerCheck input[type="checkbox"]{
  margin: 8px 7px 0px 8px;
}
.containerCheck input[type="checkbox"]:checked::after {
  content:url('layouts/vlayout/skins/images/Enable.png');
}

.closebtn{
    position: absolute;
    float: right !important;
    background: transparent;
    border: transparent;
    /* color: #fff; */
    margin-left: 97%;
    font-size:18px;
}

#updateCRMTigerModal .modal.fade.in{
	left:40% !important;
	top:45% !important;
}

</style>
{/literal}

<div class="main_div">
    <div class="headDiv">
        <ul>
            <li>
                <h3>{vtranslate("MODULE_LBL",$MODULE)}</h3></li>
            <li class="dash_right  icon_image_pos2">
                 <a href="#" title="{vtranslate("Help",$MODULE)}" id="help_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_HELP_URL}"><img src="layouts/vlayout/modules/CTMobileSettings/images/question-icon.png" alt="Icon" ></a>
            </li>
            <li class="dash_right  icon_image_pos2">
               <a href="#" title="{vtranslate("Apple Store",$MODULE)}" id="ios_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_APPLE_STORE_URL}"><img src="layouts/vlayout/modules/CTMobileSettings/images/apple-icon.png" alt="Icon"></a>
            </li>
            <li class="dash_right icon_image_pos2">
               <a href="#" title="{vtranslate("Android Store",$MODULE)}" id="android_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_ANDROID_STORE_URL}"><img src="layouts/vlayout/modules/CTMobileSettings/images/android-icon.png" alt="Icon"></a>
            </li>
            <li class="dash_right icon_image_pos2">
			  	{if strtolower($LICENSE_DATA['Plan']) eq 'free'}
			  	<a href="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}" title="{vtranslate("Upgrade to premium version to get more feature",$MODULE)}" id="help_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}"><img src="layouts/vlayout/modules/CTMobileSettings/images/upgrade-icon.png" alt="Icon" style="height:40px;"></a>
	            {/if}
	        </li>
			{if $CT_REQUIREMENTS eq false}
			<li class="dash_right icon_image_pos2">
				 <a class="showErrorModal" href="#" title="{vtranslate("Error",$MODULE)}" id="errorModelButtton"><img src="layouts/vlayout/modules/CTMobileSettings/images/error.png" alt="Icon"></a>
			</li>
			{/if}
        </ul>
    </div>
	{if strtolower($LICENSE_DATA['Plan']) eq 'free'}
	<div class="container-fluid">
			<div class="row-fluid" style="text-align:center;font-size:16px;background:#4d9ffb;color:#fff;">
				{vtranslate('Do you Love CRMTiger Apps ? Would Like to enjoy more features ?',$MODULE)}
				<a href="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}" target="_blank">{vtranslate('Click here',$MODULE)}</a>
				{vtranslate('to upgrade to premium plan to enjoy more features',$MODULE)}
			</center>
			</div>
	</div>
	{/if}

	<div class="marquee">
	  {if $CT_REQUIREMENTS eq false}
	  	
	  <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
	      <div class="modal-dialog modal-dialog-centered" role="document">

	        <!-- Modal content-->
	        <div class="modal-content">
	          <div class="modal-header">
	            <h4 class="modal-title" id="exampleModalLongTitle">{vtranslate('Verifying extensions updates...','CTMobileSettings')}</h4>
	          </div>
	          <div class="modal-body">
		    	<table id="checklistTable" border="1" cellspacing="2" style="width:90%; margin:10px 0px 10px 10px;">
	                 
	                    <tr>
	                      <td><b>{vtranslate('Modules/Features','CTMobileSettings')}</b></td>
	                      <td><b>{vtranslate('Status','CTMobileSettings')}</b></td>
	                      <td><b>{vtranslate('Action','CTMobileSettings')}</b></td>
	                    </tr>
						   {foreach from=$CT_REQUIREMENTS_DATA key=keys item=name}	
				                    <tr>
				                      <td>{$CT_REQUIREMENTS_DATA[$keys]['requirements_module']}</td>
							{if $CT_REQUIREMENTS_DATA[$keys]['requirements'] eq 1}	
							     <td><span style="color:green;">{vtranslate('Success','CTMobileSettings')}</span></td>	
							     <td>&nbsp;</td>	
							{else}
								
								<td><span style="color:red;">{vtranslate('Fail !!!','CTMobileSettings')}</span>
								</td>
								<td><a class="upgrade" href="javascript:updateModule('{$CT_REQUIREMENTS_DATA[$keys]['requirements_module']}')">{vtranslate('Install','CTMobileSettings')}</a></td>
							{/if}    
	                    </tr>
					   {/foreach}
	                 	
	            </table>
	            <div><strong>Note : If you're experience any problem in installation of CRMTiger Mobile Apps extensions.</strong> 
				<br/><strong><a href="https://kb.crmtiger.com/knowledge-base/error-code-solutions/" target="_blank" class="btn btn-success">Click here</a> to download and install manually one by one all updated extensions related to CRMTiger Mobile Apps for respected vTiger version from</strong> <a href="index.php?module=ModuleManager&parent=Settings&view=List" class="btn btn-primary" target="_blank">Settings</a>
				</div>
	             <div id="waitmsg">
	            	<p>{vtranslate('Please wait while we are updating extensions for you...','CTMobileSettings')}</p>
            		<p>{vtranslate('It will take around 1-2 minutes for extensions to update..','CTMobileSettings')}</p>
	            </div>

	            </div>
	        </div>

	    </div>
	  </div>
	  
	  {/if}
	</div>

	</br>
    <div class="container-fluid" style="display: flex;">
		<div class="col-xs-3">
			<div class="card">
			  <div class="card-body">
				<div class="col-xs-12"><h4 class="mn_ttl">{vtranslate("Active Users",$MODULE)}</h4></div>
				<hr>
				<div class="col-xs-12" style="display: flex;">
					<div class="col-xs-6">
						<img src="layouts/vlayout/modules/CTMobileSettings/images/active-users.png" alt="Icon">
					</div>
					<div class="col-xs-6 pul-right">
						<h2 style="padding: 3px 0px;">{$ACTIVE_USER}</h2>
					</div>
				</div>
			  </div>
			</div>
		</div>
		<div class="col-xs-3">
			<div class="card">
			  <div class="card-body">
				<div class="col-xs-12"><h4 class="mn_ttl">{vtranslate("Mobile Users",$MODULE)}</h4></div>
				<hr>
				<div class="col-xs-12" style="display: flex;">
					<div class="col-xs-6">
						<img src="layouts/vlayout/modules/CTMobileSettings/images/mobile-users.png" alt="Icon">
					</div>
					<div class="col-xs-6 pul-right">
						<h2 style="padding: 3px 0px;">{$MOBILE_USER}</h2>
					</div>
				</div>
			  </div>
			</div>
		</div>
		<div class="col-xs-3">
			<div class="card">
			  <div class="card-body">
				<div class="col-xs-12"><h4 class="mn_ttl">{vtranslate("Checked-In Meetings",$MODULE)}</h4></div>
				<hr>
				<div class="col-xs-12" style="display: flex;">
					<div class="col-xs-6">
						<img src="layouts/vlayout/modules/CTMobileSettings/images/cheked-in.png" alt="Icon">
					</div>
					<div class="col-xs-6 pul-right">
						<h2 style="padding: 3px 0px;">{$MEETING_RECORDS}</h2>
					</div>
				</div>
			  </div>
			</div>
		</div>
		<div class="col-xs-3">
			<div class="card">
			  <div class="card-body">
				<div class="col-xs-12"><h4 class="mn_ttl">{vtranslate("Checked-Out Meetings",$MODULE)}</h4></div>
				<hr>
				<div class="col-xs-12" style="display: flex;">
					<div class="col-xs-6">
						<img src="layouts/vlayout/modules/CTMobileSettings/images/cheked-out.png" alt="Icon"/>
					</div>
					<div class="col-xs-6 pul-right">
						<h2 style="padding: 3px 0px;">{$CHECKOUT_RECORDS}</h2>
					</div>
				</div>
			  </div>
			</div>
		</div>
    </div>
	
	<div class="container-fluid" style="top: 20px;position: relative;">
		<div class="col-xs-12">
			<section id="pinBoot">
				{if $CURRENT_USER->get('is_admin') eq 'on'}
				<article class="white-panel">
					<div class="middle-second-boc">
						<h3><span class="glyphicon glyphicon-briefcase"></span> {vtranslate("LBL_ACCOUNT_SUMMARY",$MODULE)}
						<a href="{CTMobileSettings_Module_Model::$MY_ACCOUNT_SUMMARY_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a></h3> 

						<div class="box_count">
						   <p>{vtranslate("LBL_ORDER",$MODULE)} : <b>{$LICENSE_DATA['ORDER_ID']}</b></p>
						   
						   	{if strtolower($LICENSE_DATA['Plan']) eq 'free'}
						   	  <p>{vtranslate("LBL_MY_PLAN",$MODULE)} : <b>{vtranslate($LICENSE_DATA['Plan'],$MODULE)}</b>
						   		<button class="upgrade" onclick="window.open('{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}','_blank');" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Upgrade (Monthly)",$MODULE)}</button></p>

						   	{else if $LICENSE_DATA['Plan'] eq 'Premium ( Monthly )'}

						   		<p>{vtranslate("LBL_MY_PLAN",$MODULE)} : <b>{vtranslate($LICENSE_DATA['Plan'],$MODULE)}</b>
						   		<button class="upgrade" onclick="window.open('{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}','_blank');" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Upgrade (Yearly)",$MODULE)}</button></p>

							  	<p>{vtranslate("Next renewal date",$MODULE)} : <b>{Vtiger_Date_UIType::getDisplayValue($LICENSE_DATA['NextPaymentDate'])}</b></p>
						   {else}
						   		<p>{vtranslate("LBL_MY_PLAN",$MODULE)} : <b>{vtranslate($LICENSE_DATA['Plan'],$MODULE)}</b>
						   		<p>{vtranslate("Next renewal date",$MODULE)} : <b>{Vtiger_Date_UIType::getDisplayValue($LICENSE_DATA['NextPaymentDate'])}</b></p>
						   {/if}

						   <p class="ctbtn" title="{vtranslate("LBL_LICENSE_CONFIGURATION",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_LICENSE_DETAILVIEW_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_LICENSE_DETAILVIEW_URL}"><b>{vtranslate("LBL_LICENSE_CONFIGURATION",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>

						   {if strtolower($LICENSE_DATA['Plan']) eq 'free'}
						   <p class="ctbtn" title="{vtranslate("BTN_CTMOBILE_ACCESS_USER",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_ACCESSUSER_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_ACCESSUSER_URL}"><b>{vtranslate("BTN_CTMOBILE_ACCESS_USER",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>
						   {/if}


						   <p class="ctbtn" title="{vtranslate("Setup Language for Mobile",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_LANGUAGE_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_LANGUAGE_URL}"><b>{vtranslate("Setup Language for Mobile",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>
						   
						   <p class="ctbtn" title="{vtranslate("Setup Mobile Apps Icons",$MODULE)}" ><a href="{CTMobileSettings_Module_Model::$MODULE_ICON_URL}"><b>{vtranslate("Setup Mobile Apps Icons",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

						   <p class="ctbtn" title="{vtranslate("Login History",$MODULE)}" ><a href="index.php?module=CTMobileSettings&parent=Settings&view=LoginHistory"><b>{vtranslate("Login History",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

						   <p class="ctbtn" title="{vtranslate("Force logout all mobile app users",$MODULE)}" id="forcelogout"><a href="#"><b>{vtranslate("Force logout all mobile app users",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

						   <p class="ctbtn" title="{vtranslate("Apps Logging",$MODULE)}" ><a href="{CTMobileSettings_Module_Model::$APILOGS_SETTINGS_URL}"><b>{vtranslate("Apps Logging",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>


						   <p class="ctbtn" title="{vtranslate("LBL_CLOSE_ACCOUNT",$MODULE)}" id="unInstallCTMobile"><a href="#"><b style="color:red;">{vtranslate("LBL_CLOSE_ACCOUNT",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>
						</div>
					</div>
				</article>
				{/if}

				
				{if $CURRENT_USER->get('is_admin') eq 'on'}
				<article class="white-panel">
				  {if strtolower($LICENSE_DATA['Plan']) eq 'free'}
					 <button class="blur_box_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Premium",$MODULE)}</button>
					  <div class="overlay"></div>
					{/if}
				  <div class="col-md-12 col-xs-12 backgeound_comm_class">
				   <div class="middle-second-boc">
						<h3><span class="glyphicon glyphicon-cog"></span> {vtranslate("General Settings",$MODULE)}
						<a href="{CTMobileSettings_Module_Model::$GENERAL_SETTINGS_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a></h3>
						  <div class="box_count">

						  	<p class="ctbtn" title="{vtranslate('Feature access management','CTMobileSettings')}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_USER_SETTINGS_URL}" style="font-size:16px;margin-bottom:8px !important;"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_USER_SETTINGS_URL}"><b>{vtranslate('Feature access management','CTMobileSettings')}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

						  	<p>{vtranslate("Allow access to various CRMtiger Apps feature",$MODULE)}</p>

							<ul>
							<li>{vtranslate("Access to mobile",$MODULE)}</li>
							<li>{vtranslate("Module Management",$MODULE)} <img src="layouts/vlayout/modules/CTMobileSettings/icon/new.png"></li>
							<li>{vtranslate("Premium Feature management",$MODULE)} <img src="layouts/vlayout/modules/CTMobileSettings/icon/new.png"></li>
							<li>{vtranslate("Location tracking",$MODULE)}</li>
							<li>{vtranslate("Route planning",$MODULE)}</li>
							<li>{vtranslate("Time tracking",$MODULE)}</li>
							<li>{vtranslate("Call Logging",$MODULE)} <img src="layouts/vlayout/modules/CTMobileSettings/icon/new.png"></li>
							</ul>

							<p class="ctbtn" title="{vtranslate("Fields access management",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_FIELD_SETTINGS_URL}" style="font-size:16px;margin-bottom:8px !important;"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_FIELD_SETTINGS_URL}"><b>{vtranslate("Fields access management",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

							<p>{vtranslate("Add/Setup fields for premium feature",$MODULE)}</p>

							<ul>
							<li>{vtranslate("Setup fields for vCard",$MODULE)}</li>
							<li>{vtranslate("Setup fields for BarCode",$MODULE)}</li>
							<li>{vtranslate("Setup fields for Signature / Pictures or Documents",$MODULE)}</li>
							</ul>

						  </div>

						  
					</div>
				  </div>
				</article>
				{/if}

				{if $CURRENT_USER->get('is_admin') eq 'on'}
				<article class="white-panel">
				   <div class="middle-second-boc ">
						<h3><span class="glyphicon glyphicon-saved"></span> {vtranslate("LBL_APP_UPDATES",$MODULE)}
						<a href="{CTMobileSettings_Module_Model::$VERSION_AND_UPDATES_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a></h3>
						
						<div class="box_count">
						   <p>{vtranslate("Your Version",$MODULE)} : <b>{$VERSION}</b></p>
						   <p>{vtranslate("LBL_LATEST_VERSION",$MODULE)} : <b>{$ext_ver}</b></p>
						   
						   {if $VERSION neq $ext_ver}
						   <p title="{vtranslate("LBL_CLICK_UPDATE",$MODULE)}" data-toggle="modal" data-target="#updateCRMTigerModal" data-backdrop="static" data-keyboard="false"><a href="#"><b>{vtranslate("LBL_CLICK_UPDATE",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>
						   {else}
						   <p><b><label class="text text-success">{vtranslate("LBL_UPDATED_VERSION",$MODULE)}</label></b></p>

						   <p title="{vtranslate("Issue ? Click here to update",$MODULE)}" data-toggle="modal" data-target="#updateCRMTigerModal" data-backdrop="static" data-keyboard="false"><a href="#"><b>{vtranslate("Issue ? Click here to update",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>

						   {/if}

						   <p class="ctbtn"><a target="_blank" href="{CTMobileSettings_Module_Model::$CTMOBILE_RELEASE_NOTE_URL}" title="{vtranslate("View Release Note",$MODULE)}"><b>{vtranslate("View Release Note",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>

						   <a href="#" id="WhatsNew">{vtranslate("What's New",$MODULE)}</a>
						</div>  
					</div>
				</article>
				{/if}
				
				{if $CURRENT_USER->get('is_admin') eq 'on'}
				<article class="white-panel">
					{if strtolower($LICENSE_DATA['Plan']) eq 'free'}
					 <button class="blur_box_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Premium",$MODULE)}</button>
					  <div class="overlay"></div>
					{/if}
				   <div class="col-xs-12 col-xs-12 backgeound_comm_class">
				   <div class="middle-second-boc ">
						<h3><span class="glyphicon glyphicon-cog"></span> {vtranslate("LBL_MAP_CONFIGURATION",$MODULE)} 
						<a href="{CTMobileSettings_Module_Model::$GEO_SETTINGS_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a></h3>
						
						<div class="box_count">
						   <p>{vtranslate("LBL_CTMOBILE_LIMITED_OFFER",$MODULE)}</p>

						   <p class="ctbtn"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_GEOLOCATION_SETUP_URL}"><b>{vtranslate("GEO Location Settings",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>
						   
						   {vtranslate("CRMTiger provides the following Map related features",$MODULE)}
						   <ul>
						   <li>{vtranslate("Nearby Contacts view in Mobile app",$MODULE)}</li>
						   <li>{vtranslate("Live Tracking of Team(users) who enable their GPS",$MODULE)}</li>
						   <li>{vtranslate("Calculate Distance between two Location",$MODULE)}</li>
						   </ul>
						   
						</div>  
					  </div>
					 </div>
				</article>
				{/if}

						<article class="white-panel">
				  {if strtolower($LICENSE_DATA['Plan']) eq 'free'}
					 <button class="blur_box_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Premium",$MODULE)}</button>
					  <div class="overlay"></div>
					{/if}
				  <div class="col-md-12 col-xs-12 backgeound_comm_class">
				   <div class="middle-second-boc">
						<h3><span class="fa fa-bar-chart"></span> {vtranslate("Reports & Analytics",$MODULE)}
						<a href="{CTMobileSettings_Module_Model::$REPORTS_AND_ANALYTICS_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a></h3>
						  <div class="box_count">

						  	<h4>{vtranslate("Team Activities Report",$MODULE)}</h4>
						  	
						  	{if $CURRENT_USER->get('is_admin') eq 'on'}
							<p class="ctbtn" title="{vtranslate("User activity on Map",$MODULE)}"  data-url="{CTMobileSettings_Module_Model::$CTMOBILE_TEAMTRACKING_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_TEAMTRACKING_URL}"><b>{vtranslate("User activity on Map",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>
							{/if}

							<p class="ctbtn" title="{vtranslate("Time Tracking Report",$MODULE)}"  data-url="{$TIME_TRACKING_LOG_URL}"><a href="{$TIME_TRACKING_LOG_URL}"><b>{vtranslate("Time Tracking Report",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

							<h4>{vtranslate("Meeting & Attendance Report",$MODULE)}</h4>

							<p class="ctbtn" title="{vtranslate("Meeting & Attendance (GEO Location)",$MODULE)}"  data-url="{$CTATTENDANCE_URL}"><a href="{$CTATTENDANCE_URL}"><b>{vtranslate("Meeting & Attendance (GEO Location)",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

							<h4>{vtranslate("LBL_ROUTE_PLANNING_REPORT",$MODULE)}</h4>

							<p class="ctbtn" title="{vtranslate("Route Activities",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_ROUTE_ANALYTICS_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_ROUTE_ANALYTICS_URL}"><b>{vtranslate("Route Activities",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

							<h4>{vtranslate("Call Log Report",$MODULE)}</h4>

							<p class="ctbtn" title="{vtranslate("Call logs with recording",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_CALL_LOG_RECORDING_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_CALL_LOG_RECORDING_URL}"><b>{vtranslate("Call logs with recording",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

						  </div>

						  
					</div>
				  </div>
				</article>

				<article class="white-panel">
					{if strtolower($LICENSE_DATA['Plan']) eq 'free'}
					 <button class="blur_box_btn" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_MYACCOUNT_URL}">{vtranslate("Premium",$MODULE)}</button>
					  <div class="overlay"></div>
					{/if}
					<div class="col-xs-12 col-xs-12 backgeound_comm_class premium_box">
						<div class="middle-second-boc ">
							<h3><span class="glyphicon glyphicon-bell"></span> {vtranslate("Notification Settings",$MODULE)}
							<a href="{CTMobileSettings_Module_Model::$NOTIFICATIONS_URL}" target="_blank"><span class="glyphicon glyphicon-question-sign pull-right" style="font-size:25px"></span></a> </h3>
							
							<div class="box_count">
							  {if $CURRENT_USER->get('is_admin') eq 'on'}
							   <p class="ctbtn" title="{vtranslate("Setup Important(Default) Notification",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$NOTIFICATIONS_SETTINGS_URL}"><a href="{CTMobileSettings_Module_Model::$NOTIFICATIONS_SETTINGS_URL}"><b>{vtranslate("Setup Important(Default) Notification",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a> <img src="layouts/vlayout/modules/CTMobileSettings/icon/new.png"/></p>
							  
							   <p class="ctbtn" title="{vtranslate("Setup Notification Action from Workflow",$MODULE)}" data-url="{CTMobileSettings_Module_Model::$CTMOBILE_WORKFLOW_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_WORKFLOW_URL}"><b>{vtranslate("Setup Notification Action from Workflow",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>

							   <p><a class="text text-info" href="https://youtu.be/D34Uv-gIGNE" target="_blank"><span>{vtranslate("Click here to see how to setup ?",$MODULE)}</span></a></p>
							   {/if}
							   <p class="ctbtn" title="{vtranslate("Send Push Notification to Users",$MODULE)}"  data-url="{CTMobileSettings_Module_Model::$CTMOBILE_CTPUSHNOTIFICATION_URL}"><a href="{CTMobileSettings_Module_Model::$CTMOBILE_CTPUSHNOTIFICATION_URL}"><b>{vtranslate("Send Push Notification to Users",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow"></a></p>

							   <br/>
							   <p class="ctbtn" title="{vtranslate("Notification Logs",$MODULE)}" data-url="{$CTPUSHNOTIFICATION_URL}"><a href="{$CTPUSHNOTIFICATION_URL}"><b>{vtranslate("Notification Logs",$MODULE)}</b><img src="layouts/vlayout/modules/CTMobileSettings/images/right-arrow.png" alt="Icon" class="dash_arrow "></a></p>
							</div>
						</div>
					</div>
				</article>


				

			</section>
		</div>
    </div>
	
</div>




<style>
	
#pinBoot {
  position: relative;
  max-width: 100%;
  width: 100%;
}

.white-panel {
  position: absolute;
  background: white;
  border-radius:5px;
  border:1px solid rgba(0,0,0,.125);
}

.white-panel h1 {
  font-size: 1em;
}
.white-panel h1 a {
  color: #A92733;
}
.white-panel:hover {
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
  margin-top: -5px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
</style>
<script>
	$(document).ready(function() {
$('#pinBoot').pinterest_grid({
no_columns: 3,
padding_x: 10,
padding_y: 10,
margin_bottom: 50,
single_column_breakpoint: 900
});
});

;(function ($, window, document, undefined) {
    var pluginName = 'pinterest_grid',
        defaults = {
            padding_x: 10,
            padding_y: 10,
            no_columns: 3,
            margin_bottom: 50,
            single_column_breakpoint: 700
        },
        columns,
        $article,
        article_width;

    function Plugin(element, options) {
        this.element = element;
        this.options = $.extend({}, defaults, options) ;
        this._defaults = defaults;
        this._name = pluginName;
        this.init();
    }

    Plugin.prototype.init = function () {
        var self = this,
        resize_finish;
        self.make_layout_change(self);
    };

    Plugin.prototype.calculate = function (single_column_mode) {
        var self = this,
            tallest = 0,
            row = 0,
            $container = $(this.element),
            container_width = $container.width();
            $article = $(this.element).children();

        if(single_column_mode === true) {
            article_width = $container.width() - self.options.padding_x;
        } else {
            article_width = ($container.width() - self.options.padding_x * self.options.no_columns) / self.options.no_columns;
        }

        $article.each(function() {
            $(this).css('width', article_width);
        });

        columns = self.options.no_columns;

        $article.each(function(index) {
            var current_column,
                left_out = 0,
                top = 0,
                $this = $(this),
                prevAll = $this.prevAll(),
                tallest = 0;

            if(single_column_mode === false) {
                current_column = (index % columns);
            } else {
                current_column = 0;
            }

            for(var t = 0; t < columns; t++) {
                $this.removeClass('c'+t);
            }

            if(index % columns === 0) {
                row++;
            }

            $this.addClass('c' + current_column);
            $this.addClass('r' + row);

            prevAll.each(function(index) {
                if($(this).hasClass('c' + current_column)) {
                    top += $(this).outerHeight() + self.options.padding_y;
                }
            });

            if(single_column_mode === true) {
                left_out = 0;
            } else {
                left_out = (index % columns) * (article_width + self.options.padding_x);
            }

            $this.css({
                'left': left_out,
                'top' : top
            });
        });

        this.tallest($container);
        $(window).resize();
    };

    Plugin.prototype.tallest = function (_container) {
        var column_heights = [],
            largest = 0;

        for(var z = 0; z < columns; z++) {
            var temp_height = 0;
            _container.find('.c'+z).each(function() {
                temp_height += $(this).outerHeight();
            });
            column_heights[z] = temp_height;
        }

        largest = Math.max.apply(Math, column_heights);
        _container.css('height', largest + (this.options.padding_y + this.options.margin_bottom));
    };

    Plugin.prototype.make_layout_change = function (_self) {
        if($(window).width() < _self.options.single_column_breakpoint) {
            _self.calculate(true);
        } else {
            _self.calculate(false);
        }
    };

    $.fn[pluginName] = function (options) {
        return this.each(function () {
            if (!$.data(this, 'plugin_' + pluginName)) {
                $.data(this, 'plugin_' + pluginName,
                new Plugin(this, options));
            }
        });
    }

})(jQuery, window, document);
</script>

<!-- The Modal -->
  <div class="modal fade" id="updateCRMTigerModal" style="width: fit-content;
    max-height: fit-content;">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content">
      
        <!-- Modal Header -->
        <!-- <div class="modal-header">
          <h4 class="modal-title">Modal Heading</h4>
          <button type="button" class="close" data-dismiss="modal">×</button>
        </div> -->
        
        <!-- Modal body -->
        <div class="modal-body">
          <button type="button" title="Close" class="closebtn" data-dismiss="modal">X</button>
          <div class="tabs">
            <form>
                <p class="tabWrapper">
                	<label class="installHeadtext">{vtranslate('List of modules to install','CTMobileSetttings')}</label>
                	<label class="nextbtntxt">{vtranslate('Click Next >> button to install','CTMobileSetttings')}</label>
                	<input type="hidden" id="step" name="step" value="{$step}"/>
					<label class="containerCheck">{vtranslate('Download Extension','CTMobileSetttings')}
                        <input type="checkbox" name="step0" id="step0" {if $step - 1 gte 0} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                    <label class="containerCheck">{vtranslate('CRMTiger Mobile Extension','CTMobileSetttings')}
                        <input type="checkbox" name="step1" id="step1" {if $step - 1 gte 1} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Mobile Time Tracker','CTMobileSetttings')}
                        <input type="checkbox" name="step2" id="step2" {if $step - 1 gte 2} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Time tracker report','CTMobileSetttings')}
                        <input type="checkbox" name="step3" id="step3" {if $step - 1 gte 3} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Route Planner','CTMobileSetttings')}
                        <input type="checkbox" name="step4" id="step4" {if $step - 1 gte 4} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Route Tracking','CTMobileSetttings')}
                        <input type="checkbox" name="step5" id="step5" {if $step - 1 gte 5} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Mobile Attendance','CTMobileSetttings')}
                        <input type="checkbox" name="step6" id="step6" {if $step - 1 gte 6} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('Key Metrics','CTMobileSetttings')}
                        <input type="checkbox" name="step7" id="step7" {if $step - 1 gte 7} checked {/if}>
                        <span class="checkmark"></span>
                      </label>
                      <label class="containerCheck">{vtranslate('SMS/Email Templates','CTMobileSetttings')}
                        <input type="checkbox" name="step8" id="step8" {if $step - 1 gte 8} checked {/if}>
                        <span class="checkmark"></span>
                      </label>  
                      <label class="containerCheck">{vtranslate('Mobile Push Notification','CTMobileSetttings')}
                        <input type="checkbox" name="step9" id="step9" {if $step - 1 gte 9} checked {/if}>
                        <span class="checkmark"></span>
                      </label>  
                      <label class="containerCheck">{vtranslate('CRMTiger Mobile App Settings','CTMobileSetttings')}
                        <input type="checkbox" name="step10" id="step10" {if $step - 1 gte 10} checked {/if}>
                        <span class="checkmark"></span>
                      </label>   
                </p>
              </form>
          </div>
          <div class="progressContain">
            <div class="progressbar-container">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <p>{vtranslate('View Installation Progress','CTMobileSetttings')}</p>
                <div class="progressbar-bar"><div class="progressbar-label"></div></div>
                <p class="progressContent"></p>
              </div>
              <div class="btnWrapper">
                <!-- <button type="button" class="btn btn-secondary btn-sm">{vtranslate('Cancel','CTMobileSetttings')}</button> -->
                <button type="button" id="nextbtn" class="btn btn-primary btn-sm">{if $step gte 11}{vtranslate('Finish','CTMobileSetttings')} {else} {vtranslate('Next','CTMobileSetttings')} {/if}</button>
               </div>

               <div class="installationinsdiv">
	            	<center><p>{vtranslate('Issue in installation ?','CTMobileSetttings')} <a style="color:#15c;" href="https://kb.crmtiger.com/knowledge-base/crmtiger-mobileapps-extensions/" target="_blank">{vtranslate('Click here','CTMobileSetttings')}</a> {vtranslate('to download extension','CTMobileSetttings')}</p>
	            	<p>{vtranslate('OR','CTMobileSetttings')}</p>
	            	<p><a href="#" id="createTickets" style="color:#15c;">{vtranslate('Click here','CTMobileSetttings')}</a> {vtranslate('to send error','CTMobileSetttings')}</p></center>
	            </div>
          </div>
        </div>
        
      </div>
    </div>
  </div>

{literal}
  <script>
    $(document).ready(function () {
  // get box count
  var count = 0;
  var checked = 0;
  function countBoxes() {
    count = $("input[type='checkbox']").length;
  }
  $("input[type='checkbox']").prop('disabled',true);
  countBoxes();
  $(":checkbox").click(countBoxes);

  // count checks

  function countChecked() {
    checked = $("input:checked").length;

    var percentage = parseInt((checked / count) * 100, 10);
    $(".progressbar-bar").progressbar({
      value: percentage
    });
    $(".progressbar-label").text(percentage + "%");
  }

  countChecked();
  $(":checkbox").click(countChecked);

  jQuery('#nextbtn').click(function(){

	  var step = parseInt(jQuery('#step').val());

	  if(step >= 11){
	  	 location.reload();
	  }else{
		  var progressIndicatorElement = jQuery.progressIndicator({
			'position' : 'html',
			'blockInfo' : {
				'enabled' : true
			}
		  });
		  var postData = {
			"module": 'CTMobileSettings',
			"action": 'StepAjax',
			"step": step
			};

			AppConnector.request(postData).then(function(response) {
					progressIndicatorElement.progressIndicator({'mode' : 'hide'});
					var step = parseInt(jQuery('#step').val());
					jQuery('#step'+step).prop('checked',true);
					countChecked();
					if(step+1 >= 11){
					   jQuery('#nextbtn').text('Finish');
					}
					jQuery('#step').val(step+1);	
				},
				function(error,err){
					
				}
			);
	  }
  });

  jQuery('#createTickets').click(function(){
  		var step = parseInt(jQuery('#step').val());
  		var progressIndicatorElement = jQuery.progressIndicator({
			'position' : 'html',
			'blockInfo' : {
				'enabled' : true
			}
		});
		var postData = {
			"module": 'CTMobileSettings',
			"action": 'CreateTickets',
			"step": step
			};

		AppConnector.request(postData).then(function(response) {
			progressIndicatorElement.progressIndicator({'mode' : 'hide'});
			var params = {
				title : app.vtranslate('success'),
				text: app.vtranslate('Error Sent successfully'),
				animation: 'show',
				type: 'success'
			};
			Vtiger_Helper_Js.showPnotify(params);
		});
  });


});



</script>
 
{/literal}