{% extends 'themes/default/setup/layout.html' %}
{% block body %}

<style>
	.wizard-steps{
		display: none;
	}
	
	.wizard-steps.active{
		display: block !important;
	}
	
	.platform-logo{
		cursor: pointer;
		padding: 20px;
		border: 1px solid lightgray;
		border-radius: 15px;
		min-height: 150px;
	}
	
	.disabled i{
		color: #9F9F9F !important;
	}
</style>

<div class="container center-align">
<div class="row">	

<div class="col s12  card z-depth-4 wizard-steps step1 active" style="margin-top:10%">
<div class="card-content">
<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
<h5>Customer Portal | <b>Setup Wizard</b></h5>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}}">1</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled">2</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled">3</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled"><i class="small material-icons ">thumb_up</i></a>
<br><br><h3>Choose your platform</h3>
	<div class="row">
      <div class="col s12 ">
	      <p>
	      <div class="platform-logo z-depth-4">
	      <img class="responsive-img" src="{{app.config.app_url}}/app/themes/default/resources/images/vtiger-logo.png"><br>
	      <input name="platformselect" type="radio" id="vtigercrm" checked="checked"/>
	      <label for="vtigercrm">vTiger CRM</label>
	      </div>
	      <p>
	  </div>
      
	</div>  
    
     
     <div class="col s12  card vtigerinstructions " style="padding:30px;">
	 
	 <h4 class="thin">Instructions for vTiger CRM</h4>
	 <div style="">
	 Please Download the MYCExtendedWebservices module using the following button then install it on your vTiger CRM throug the Module Manager import tool. &nbsp;<br><br><a class="btn {{themebasiccolor}}" href="downloadvtigerzip">Download</a><br>
	 </div>
	 
	 </div>
    
    <div class="input-field col s12">
        <input name="platformurl" id="platformurl" type="url" class="validate" value="" required="">
        <label for="platformurl">Platform URL</label>
    </div>
    <div class="input-field col s12">
        <input name="apiuser" id="apiuser" type="text" class="validate" value="">
        <label for="apiuser">API Username</label>
    </div>
    <div class="input-field col s12">
        <input name="apikey" id="apikey" type="password" class="validate">
        <label for="apikey">API Key/Password</label>
    </div>
        
    <div class="col s6 offset-s3 card grey white-text hide" id="apitestcheck" style="padding:10px;">
	 Checking Connection . . .<br><div class="progress"><div class="indeterminate"></div></div>
	</div>
    
    <div class="col s6 offset-s3 card red white-text hide" id="apitesterror" style="padding:10px;">
	 <div class="messages wrong_url">Wrong URL</div>
	 <div class="messages wrong_credentials">Wrong Credentials</div>
	 <div class="messages myc_module_missing">MYC Module Missing</div>
	</div>
	
	<div class="col s12 text-center">
    <a href="javascript:testConnection();" class="btn {{themebasiccolor}}" />Next</a>
    <br><br>
    </div>
	
</div>
</div>

<div class="col s12  card z-depth-4 wizard-steps step2" style="margin-top:10%">
<div class="card-content">
<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
<h5>Customer Portal | <b>Setup Wizard</b></h5>
<a class="btn-floating btn-large waves-effect waves-light green">1</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} ">2</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled">3</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled"><i class="small material-icons ">thumb_up</i></a>
{% if error %}
<div class="card {{themebasiccolor}} white-text" style="padding:10px;">
	{{ error }}
</div>
{% endif %}

<form action="{{app.config.base_url}}/admin/login_check" method="post">
    

    <div class="input-field col s12">
        <input name="adminuser" id="adminuser" type="text" class="validate" value="">
        <label for="adminuser">Admin Username</label>
    </div>
    <div class="input-field col s12">
        <input name="adminpass" id="adminpass" type="password" class="validate">
        <label for="adminpass">Admin Password</label>
    </div>
    <div class="input-field col s12">
        <input name="adminpass_confirm" id="adminpass_confirm" type="password" class="validate">
        <label for="adminpass_confirm">Admin Password Confirm</label>
    </div>
    <div class="input-field col s12">
        <input name="adminemail" id="adminemail" type="email" class="validate">
        <label for="adminemail">Admin Email</label>
    </div>
        
    <a href="javascript:prevStep();" class="btn {{themebasiccolor}}" />Prev</a>
    <a href="javascript:submitAdminInfo();" class="btn {{themebasiccolor}}" />Next</a>
    
</form>
</div>
</div>


<div class="col s12  card z-depth-4 wizard-steps step3" style="margin-top:10%">
<div class="card-content">
<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
<h5>Customer Portal | <b>Setup Wizard</b></h5>
<a class="btn-floating btn-large waves-effect waves-light green">1</a>
<a class="btn-floating btn-large waves-effect waves-light green ">2</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}}">3</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}} disabled"><i class="small material-icons ">thumb_up</i></a>


    
	<div class="col s12">
		<h2>License Agreement</h2>
		<p style="max-height:400px; overflow: scroll">
		1. License Agreement
<br>This license is a legal agreement between you (hereinafter Licensee) and MakeYourCloud (hereinafter the Licensor) for MakeYourCloud FREE and PAID themes, modules, extensions, plug-ins, portal (hereinafter Software) downloading or using. Licensor reserves the right to change or modify the current document without prior notice. The Software is protected by copyright laws and international copyright treaties, as well as other intellectual property laws and treaties. The Software is licensed, not sold. Licensor grants Licensee a non-exclusive and non-transferable right to use the Software. With one license you will be able to setup the Software as many times you need on the same domain (subdomains are considered different domains), for your own personal use! By purchasing the Software you acknowledge that you have read this Agreement, and that you agree to the content of the Agreement and its terms, and agree to use the Software in compliance with this Agreement.
<br><br>
2. Browser Compatibility
<br>MakeYourCloud themes are tested for the most common web browsers. If you have a browser specific question, browser compatibility should be tested against the theme demonstrations provided by MakeYourCloud. Please ensure that the browsers you use will work with the themes as we cannot guarantee that MakeYourCloud themes will work with all browsers. There is no guarantee for our Software compatibility with all 3rd party components and plugins.
<br><br>
3. Delivery & Installation
<br>As soon as we receive your payment, we will email you your membership details. In case you have not received an email from makeyourcloud.com within 24 hours, please contact us by sending an email to info@makeyourcloud.com and we will resend you the login details manually. After receiving our email with your account details you can immediate access to our downloads. The email address you give should be valid as we will use it to contact you. We recommend to use your main email address.
<br><br>
4. Support
<br>Only PAID licenses includes free support for one year, we provide technical assistance for MakeYourCloud products only with our support system, documentation, tutorials and ticket assistance. We offer no support via email, Twitter or chat. If you have any membership or billing questions please go to support.makeyourcloud.com and open a ticket; if you are not yet a member user, please contact us at info@makeyourcloud.com. During our general support hours Monday to Saturday, from 9:00 to 18:00 (GMT+1), we will make every effort to respond to your queries within 12 – 24 hours if not sooner.
<br><br>
5. Modifications
<br>You may NOT modify our MakeYourCloud Code in any way, however you may modify THEMES and LANGUAGES based on your needs.
<br><br>
6. Upgrades
<br>An annual license includes support and upgrades for a period of one year. To receive support and updates after one year requires a renewal of the license.
<br><br>
7. Ownership & Distribution
<br>Software is a property of Licensor. Licensee may not claim intellectual or exclusive ownership rights to Software, modified or unmodified. Licensee may not redistribute, sell, rent, lease, sub-license, or otherwise transfer rights to any third party. Licensee must not remove copyright or other proprietary notices in Software.
USERS WITH FREE LICENSE MUST NOT REMOVE OR HIDE OR MODIFY the copyright notice at the bottom of the login page.
Users may NOT, however, redistribute or repost/ resell for download any part of this software (MAKEYOURCLOUD PACKAGE) without expressed written consent from the MakeYourCloud Team. Redistribution is defined as re-offering our scripts for download in any fashion, whether on a competing web site, an application that generates code snippets, or a CD-ROM collection of PHP codes etc.
<br><br>
8. Disclaimer Of Warranty
<br>The Software is supplied "AS IS". Licensor disclaims all warranties, expressed or implied, including, without limitation, the warranties of merchantability and of fitness for any purpose. The user must assume the entire risk of using the Software.
<br><br>
9. Limitations Of Liability
<br>In no event shall the Licensor be liable for any damages including, but not limited to, direct, indirect, special, incidental or consequential damages or other losses arising out of the use of or inability to use the Software. This includes without limitation, lost profits, business interruption, or lost information.
<br><br>
10. Refund Policy
<br>Since all the Software are non-tangible digital goods, all purchases are final and non refundable. Before make a purchase, please make sure that the Software you'd like to purchase is suitable for your needs. No refund is provided for services associated with the Software; this includes professional installation, support and customization services.
<br><br>
11. Termination
<br>License agreement remains effective until terminated. You may terminate it at any time by destroying the Software, together with all copies thereof. This License will also terminate if you fail to comply with any term or condition of this Agreement. Upon such termination, you agree to destroy the Software, together with all copies thereof. MakeYourCloud reserves the right to change or alter the current set of Terms and Conditions without prior notice.
		</p>
	</div>
  
    <div class="col s12 text-center">
      
	      <input type="checkbox" id="acceptlicense" />
	      <label for="acceptlicense">Accept License</label>
       
	    <br><br>
    </div>
    <div class="col s12 text-center">    
	    <a href="javascript:prevStep();" class="btn {{themebasiccolor}}" />Prev</a>
	    <a href="javascript:completeSetup();" id="completesetup" class="btn {{themebasiccolor}} disabled" />Finish</a>
		<br><br>
    </div>
</div>
</div>





<div class="col s12  card z-depth-4 wizard-steps step4" style="margin-top:10%">
<div class="card-content">
<img src="{{app.config.app_url}}/app/themes/default/resources/images/logo-myc.png">
<h5>Customer Portal | <b>Setup Wizard</b></h5>
<a class="btn-floating btn-large waves-effect waves-light green">1</a>
<a class="btn-floating btn-large waves-effect waves-light green ">2</a>
<a class="btn-floating btn-large waves-effect waves-light green">3</a>
<a class="btn-floating btn-large waves-effect waves-light {{themebasiccolor}}"><i class="small material-icons ">thumb_up</i></a>


    
	<div class="col s12">
		<h2>Well Done!</h2>
		<p style="display: none">
		Many thanks for your collaborations!
		</p>
	</div>
  
    
    <div class="col s12 text-center">    
	    <a href="{{app.config.base_url}}/myc-config" class="btn {{themebasiccolor}}" />Configure Your Portal</a>
		<br><br>
    </div>
</div>
</div>


</div>
</div>
<script>
	var currStep = 1;
	
	$(function(){
		$(".platform-logo").click(function(){
			return true;
			$(this).find("input[name='platformselect']").prop("checked","checked");
			$(".platform-logo").removeClass("z-depth-4 ");
			$(this).addClass("z-depth-4 ");
		});
		
		$("#acceptlicense").change(function(){
			if($("#acceptlicense").is(':checked'))
				$("#completesetup").removeClass("disabled");
			else $("#completesetup").addClass("disabled");
		});
	});
	
	function completeSetup(){
		if($("#acceptlicense").is(':checked')){
			$.post( "complete-setup", { platform: "vtiger", platformurl: $("#platformurl").val(), apiuser: $("#apiuser").val(), apikey: $("#apikey").val(), adminemail: $("#adminemail").val(), adminuser: $("#adminuser").val(), adminpass: $("#adminpass").val()})
			.done(function( data ) {
			  console.log(data);
			  var response = jQuery.parseJSON(data);
			  nextStep();
			})
			
		}
				
		else $("#acceptlicense").focus();
	}
	
	function testConnection(){
		
		if($("#platformurl").val()==""){
			$("#platformurl").addClass("invalid").focus();
			return false;
		}
		
		var urlstring = $("#platformurl").val();
		var n = urlstring.indexOf('index.php');
		$("#platformurl").val(urlstring.substring(0, n != -1 ? n : urlstring.length))
		
		$("#apitestcheck").removeClass("hide");
		$("#apitesterror").addClass("hide");
		
		$.post( "test-connection", { platform: "vtiger", platformurl: $("#platformurl").val(), apiuser: $("#apiuser").val(), apikey: $("#apikey").val() })
		  .done(function( data ) {
			console.log(data);
			  var response = jQuery.parseJSON(data);
			  
			  if(response.connectionresult!="success"){
				  $("#apitestcheck").addClass("hide");
				  $("#apitesterror .messages").addClass("hide");
				  console.log(response.error);
				  if(response.error=="404") $("#apitesterror .wrong_url").removeClass("hide");
				  else if(response.error=="MYC_MODULE_NOT_INSTALLED") 
				  	$("#apitesterror .myc_module_missing").removeClass("hide");
				  else $("#apitesterror .wrong_credentials").removeClass("hide");
				  
				  $("#apitesterror").removeClass("hide");
			  }
		      else{
			      $("#apitestcheck").html("Check Successfully Completed!").removeClass("grey").addClass("green");
			      $("#apitesterror").addClass("hide");
			      nextStep();
		      }
		  });
	}
	
	function submitAdminInfo(){
		
		if($("#adminuser").val()==""){
			$("#adminuser").addClass("invalid").focus();
			return false;
		}
		if($("#adminpass").val()==""){
			$("#adminpass").addClass("invalid").focus();
			return false;
		}
		if($("#adminpass_confirm").val()!=$("#adminpass").val()){
			$("#adminpass_confirm").addClass("invalid").focus();
			return false;
		}	
		
		if($("#adminemail").val()==""){
			$("#adminemail").addClass("invalid").focus();
			return false;
		}
		
		nextStep();
	}
	
	function nextStep(){
		$(".step"+currStep).removeClass("active");
		currStep++;
		$(".step"+currStep).addClass("active");
	}
	
	function prevStep(){
		$("#apitesterror, #apitestcheck").hide();
		$(".step"+currStep).removeClass("active");
		currStep--;
		$(".step"+currStep).addClass("active");
	}
</script>
{% endblock %}