<div id="content">
<div id="loading_image" style="display: none;">
    <div class="modalLoading"><b><?=$this->translate("LOADING...")?></b><br /><img src="/images/loading.gif" /></div>
</div>

<div id="bread">
    <a href="/account/admin"><?=$this->translate('Admin')?></a>
</div>
<h1><?=($this->label_id ? $this->translate('Edit Subaccount') : $this->translate('Create New Subaccount'))?></h1>
<form id="editlabel_form" autocomplete = "off">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title"><?=$this->translate("Subaccount Info")?></h3>
        </div>
    <div class="panel-body">
        <div class="col-md-6">
            <div class="form-group">
                <label for=subaccountName><?=$this->translate('Subaccount Name')?><span class="required">*</span></label>
                <?=$this->form->subaccountName->setAttrib('class', 'form-control')->renderViewHelper()?>
                <div id="subaccountExistError" class="missingForm"></div>
            </div>
            <div class="form-group">
                <label for="genreId"><?=$this->translate('Key Genre')?></label>
                <?=$this->form->genreId->setAttrib('class', 'form-control')->renderViewHelper()?>
                <div id="genreIdError" class="missingForm"></div>
            </div>
            <div class="form-group">
                <label for="websiteUrl"><?=$this->translate('Website URL')?></label>
                <?=$this->form->websiteUrl->setAttrib('class', 'form-control')->renderViewHelper()?>
                <div id="websiteUrlError" class="missingForm"></div>
            </div>
            <div class="form-group">
                <label for="location"><?=$this->translate('Location')?></label>
                <?=$this->form->city->setAttrib('class', 'form-control')->renderViewHelper()?>
                <label class="smalltext" for="city"><?=$this->translate("City")?></label>
            </div>
            <div class="form-group">
                <?=$this->form->stateProvince->setAttrib('class', 'form-control')->renderViewHelper()?>
                <label class="smalltext" for="stateProvince"><?=$this->translate('State/Province')?></label>
                <div id="stateProvinceError" class="missingForm"></div>
            </div>
            <div class="form-group">
                <?=$this->form->isoCountryCode->setAttrib('class', 'form-control')->renderViewHelper()?>
                <label class="smalltext" for="isoCountryCode"><?=$this->translate('Country')?></label>
                <div id="isoCountryCodeError" class="missingForm"></div>
            </div>
        </div>
        <div class="col-md-6">
            <div id="label-commission">
                <div class="form-group">
                    <label for="revenueSplitType"><?= $this->translate('Revenue Split Type') ?>
                        <span class="revenueTooltip handPointer">
                            <img src="/images/redesign/info-tooltip.svg" class="info-icon revenueTooltip">
                            <div class="tooltip right-arrow tooltip-right-position" style="display: none;">
                                <p>This option allows you to select whether your subaccount will view a percentage based off of your gross or net revenue. For example, if you select "Gross" and provide a 100% split, they will see true gross revenue. If you select "Net" and provide a 90% split, they will see 90% of your net revenue.</p>
                            </div>
                        </span>
                    </label>
                    <div class="radio-btn-group row">
                        <div class="col-md-12 btn-group">
                            <div class="btn btn-default subaccountSplitType <?=$this->revenueSplitType == 'Gross' ? 'active' : ''?>">
                                <input type="radio" name="subaccountSplitType" id="subaccountSplitTypeGross" value="Gross" <?=$this->revenueSplitType == 'Gross' ? 'checked' : ''?>>
                                <label for="subaccountSplitTypeGross">Gross</label>
                            </div>
                            <div class="btn btn-default subaccountSplitType <?=$this->revenueSplitType == 'Net' ? 'active' : ''?>">
                                <input type="radio" name="subaccountSplitType" id="subaccountSplitTypeNet" value="Net" <?=$this->revenueSplitType == 'Net' ? 'checked' : ''?>>
                                <label for="subaccountSplitTypeNet">Net</label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="commissionOverride"><?= $this->translate('Revenue Split') ?></label>
                    <div class="row">
                        <div class="col-md-5">
                            <span class="smalltext"><?= $this->translate('Subaccount\'s Share') ?> %:</span>
                            <?= $this->form->commissionOverride->setAttrib('class', 'form-control')->renderViewHelper() ?>
                        </div>
                        <div class="col-md-5">
                            <span class="smalltext"><?= $this->translate('Your Share') ?> %:</span>
                            <input type="text" class="form-control" id="commisionPercentage" maxlength='5' disabled>
                        </div>
                    </div>
                    <label class="smalltext" for="commissionOverride"><?= $this->translate('Use this value to specify what percentage of <br>your total revenue is displayed to this subaccount\'s users') ?></label>
                    <div id="commissionOverrideError" class="missingForm"></div>
                    <div class="validation_message"></div>
                </div>
            </div>
            <div class="form-group">
                <label for="description"><?=$this->translate('Description')?></label>
                <?=$this->form->description->setAttrib('class', 'form-control')->renderViewHelper()?>
            </div>
            <div class="form-group">
                <label for="soundscancode_USA"><?=$this->translate('SoundScan (USA)')?>:
                <?=$this->filterSoundscancode($this->soundscanCodes, 'US')?> </label>
            </div>
            <div class="form-group">
                <label for="soundscancode_CA"><?=$this->translate('SoundScan (CANADA)')?>:
                <?=$this->filterSoundscancode($this->soundscanCodes, 'CA')?></label>
            </div>
            <div class="clear"></div>
        </div>
        <div class="clear"></div>
        </div>
		<input name="label_id" id="label_id" type="hidden" value="<?=$this->label_id?>">
	</div>
</div>
	<?php
	if ($this->label_id) {
		$saveButton = $this->translate->_("Save Subaccount Info");
	} else {
		$saveButton = $this->translate->_("Create Subaccount");
	}
	?>
    <button class="btn btn-primary" id="submit_label_form"><?=$saveButton?></button>
	<div id="editlabel_error_message"  class="submitMessage" style="color:red"></div>
	<div id="editlabel_success_message"  class="submitMessage" style="color:green"></div>
</form>
<script language="javascript" type="text/javascript">

$(document).ready(function () {
    $('.subaccountSplitType').click(function () {
        $('.subaccountSplitType').removeClass('active');
        $(this).addClass('active');
        $(this).find('input[type="radio"]').attr('checked', true);
    });
    $('.revenueTooltip').hover(function(){
        $('.tooltip').show();
    });
    $('.revenueTooltip').mouseout(function(){
        $('.tooltip').hide();
    });
    $('#submit_label_form').click(function (e) {
        e.preventDefault();
        $('#editlabel_form').submit();
    });
	$("#editlabel_form").validate({
			rules: {
				subaccountName: {
			      required: true
			    },
			    websiteUrl: {
					validateUrl: true
			    },
			    commissionOverride:{
					validateCommissionOverride: true
				}
			},
			messages: {
				subaccountName: {required:"<?=$this->escapejs($this->translate("Subaccount Name is required"))?>"}
			},
			submitHandler: function(form) {

					var label_values = $('#editlabel_form').serialize();
					$('#submit_label_form').html('<span><?=$this->escapejs($this->translate("Saving..."))?></span>');
					$('#editlabel_error_message').fadeOut();
					$.ajax({
						 type: 'POST',
						 url: '/account/savelabel',
						 data: "format=json&ajax=1&"+label_values,
						 dataType: 'json',
						 beforeSend: function(){
						 },
						 success: function( data, textStatus, XMLHttpRequest ){
							$("#submit_label_form").html("<span><?=($this->label_id ? $this->escapejs($this->translate("Save Subaccount Info")) : $this->escapejs($this->translate->_("Create Subaccount")))?></span>");
								$('#editlabel_success_message').html("<?=$this->escapejs($this->translate("Subaccount Data Saved Successfully."))?>");
								$('#editlabel_success_message').fadeIn();
								window.location.href = "/account/admin/";
						 },
						 error: function( xhr, textStatus, errorThrown ){
							 $("div.missingForm").html('');
							 //Show generic not-saved message and proper error message if required validations fail
							 $("#submit_label_form").html("<span><?=($this->label_id ? $this->escapejs($this->translate("Save Subaccount Info")) : $this->escapejs($this->translate->_("Create Subaccount")))?></span>");
							 $('#editlabel_error_message').html("<?=$this->escapejs($this->translate("Subaccount Data Not Saved..."))?>");
							 $('#editlabel_error_message').fadeIn();
							 	var obj = jQuery.parseJSON(xhr.responseText);
							 	//Eg: "error":{"subaccountName":{"isEmpty":"Value is required and can't be empty"},"commissionOverride":{"notBetween":"'200' is not between '0' and '100', inclusively"}
        						for(var i in obj.error){
        							if(obj.error.subaccountName && obj.error.subaccountName.isEmpty){
        								$("#subaccountExistError").html("Subaccount Name is missing.");
        								$("#subaccountName").focus();$("#subaccountExistError").show();
            						}else if(obj.error.subaccountName && obj.error.subaccountName.isDuplicate){
        								$("#subaccountExistError").html("Subaccount name already exists");
        								$("#subaccountName").focus();$("#subaccountExistError").show();
            						}
            						if(obj.error.websiteUrl && obj.error.websiteUrl.regexNotMatch){
            							$("#websiteUrlError").html("Invalid url");
            							$("#websiteUrl").focus();$("#websiteUrlError").show();
            						}
            						if(obj.error.genreId && obj.error.genreId.notInArray){
            							$("#genreIdError").html("Invalid key genre selected");
            							$("#genreId").focus();$("#genreIdError").show();
            						}
            						if(obj.error.stateProvince && obj.error.stateProvince.notInArray){
            							$("#stateProvinceError").html("Invalid state selected");
            							$("#stateProvince").focus();$("#stateProvinceError").show();
            						}
            						if(obj.error.isoCountryCode && obj.error.isoCountryCode.notInArray){
            							$("#isoCountryCodeError").html("Invalid country selected");
            							$("#isoCountryCode").focus();$("#isoCountryCodeError").show();
            						}
            						if(obj.error.commissionOverride && obj.error.commissionOverride.notBetween){
            							$("#commissionOverrideError").html("Commission override must be a % value.");
            							$("#commissionOverride").focus();$("#commissionOverrideError").show();
        						}
					 	 }
					 	 }
					 });
					return false;
			},
				onkeyup: false,
	        	errorClass: "missingForm",
	        	highlight: function(element, errorClass) {
	    	        $(element).removeClass(errorClass);
	    	    }
			});
			$.validator.addMethod('validateCommissionOverride', function(value, element) {
				element.value = value;
				return this.optional(element) || (value >= 0 && value <= 100);
		    },'Please enter a value between 0.00 and 100.00');
			$.validator.addMethod('validateUrl', function(value, element) {
				urlRegex = /^((http?):\/\/|(www)\.)[a-z0-9-]+(\.[a-z0-9-]+)+([\/?].*)?$/i;
				return this.optional(element) || urlRegex.test(value);
		    },'Invalid url');

			var isExistLabelId = <?=($this->label_id)?>;
			if (isExistLabelId > 0){
		           $("#subaccountName").attr('readonly', true);
		    }
			//This function calculates the 'Your Share' percantage on document ready
			$('#commisionPercentage').val(100 - $('#commissionOverride').val());
	});

$("#subaccountName").click(function(){
	$("#subaccountExistError").hide();
});

//This function calculates the 'Your Share' percantage on keyup
$("#commissionOverride").keyup(function(){
	$('#commisionPercentage').val(100 - $('#commissionOverride').val());
});

</script>