<?php
/** @var \Magetop\Advancepreview\Block\CustomerCustomer $block */
/** @var \Magetop\Advancepreview\Helper\Data $preivewHelper */
$block->getCustomerAttribute();
$preivewHelper = $this->helper('Magetop\Advancepreview\Helper\Data');
//echo get_class($preivewHelper);
$industryOptions = $preivewHelper->getOpdSetting('advancepreview/register_setting/industry_value');
//echo $industryOptions;
$industryOptions = $industryOptions != '' ? explode(',',$industryOptions) : [];
$allStores = $preivewHelper->getAllStore();
$bigTypefileds = [
    'company_name'=>'Company name',
    'industry'=>'Industry',
    'street'=>'Street',
    'number'=>'House number',
    'postcode'=>'Postcode',
    'city'=>'City',
    'country'=>'Country',
    'phone'=>'Phone',
    'is_reseller'=>'Is reseller?',
//    'taxvat'=>'Sales tax / VAT number',
    'preferred_language'=>'Preferred language'
];
$customerAttributes = $block->getCustomerAttribute();
$group = $block->getCustomerGroup();
?>
<?php if($group > 1) : ?>
<div class="" id="custom-fields-big" style="">
    <legend class="custom-legend"><span><?php echo __('Company information') ?></span></legend>
    <?php foreach ($bigTypefileds as $key => $bigTypefiled) : ?>
        <?php $inputRequired = in_array($key,array('phone')) ? false : true; ?>
        <div class="mgt-custom-additnation-filed" id="mgt-custom-additnation-filed-<?php echo $key; ?>" style="display:<?php echo $key == 'preferred_language'? 'none':'black'; ?>">
            <label class="label" for="custom-<?php echo $key; ?>">
                <span><?= $block->escapeHtml(__($bigTypefiled)) ?><?php if($inputRequired) { ?><span class="mand">*</span><?php } ?></span>
            </label>
            <div class="control">
                <?php if($key == 'industry') : ?>
                    <select id="custom-<?php echo $key; ?>" name="custom[custom_<?php echo $key; ?>]" data-validate="{required:true}">
                        <?php if(count($industryOptions)) : ?>
                            <option value=""><?php echo __('Select') ?></option>
                            <?php foreach ($industryOptions as $industryOption) : ?>
                                <?php $vIndustryOption = str_replace(' ','',$industryOption) ?>
                                <option value="<?php echo $vIndustryOption ?>" <?php echo isset($customerAttributes['custom_'.$key]) && $customerAttributes['custom_'.$key] == $vIndustryOption ? 'selected="selected"' : ''; ?>><?php echo __($industryOption) ?></option>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    </select>
                <?php elseif($key == 'preferred_language') : ?>
                    <select style="display:<?php echo $key == 'preferred_language'? 'none':'black'; ?>" id="custom-<?php echo $key; ?>" name="custom[custom_<?php echo $key; ?>]" data-validate="{required:true}">
                        <option value=""><?php echo __('Select') ?></option>
                        <?php if(count($allStores)) : ?>
                            <?php foreach ($allStores as $allStore) : ?>
                                <option value="<?php echo $allStore['store_code'] ?>" <?php echo isset($customerAttributes['custom_'.$key]) && $customerAttributes['custom_'.$key] == $allStore['store_code'] ? 'selected="selected"' : ''; ?>><?php echo $allStore['store_name']  ?></option>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    </select>
                <?php elseif($key == 'is_reseller') : ?>
                    <input type="hidden" name="custom[custom_<?php echo $key; ?>]" value="<?php echo isset($customerAttributes['custom_'.$key]) && $customerAttributes['custom_'.$key] == 1 ? 1 : 0; ?>">
                    <label class="switch">
                        <input type="checkbox" id="txt-register-is-seller" name="custom[custom_<?php echo $key; ?>]" value="1" <?php echo isset($customerAttributes['custom_'.$key]) && $customerAttributes['custom_'.$key] == 1 ? 'checked' : ''; ?> disabled="disabled">
                        <span class="slider round"></span>
                    </label>
                <?php else:  ?>
                    <?php $typeInput = in_array($key,array('phone','postcode')) ? 'number' : 'text'; ?>

                    <input  <?php if($key == 'phone'){ ?> type="text" onkeypress="return validatePhone(event);" maxlength="18" onpaste="return false" <?php } else if($key == 'postcode') {?> type="<?php echo $typeInput; ?>" onkeypress="return validateQty(event);" maxlength="10" onpaste="return false" <?php } else{?> type="<?php echo $typeInput; ?>" onkeypress="return characterWithSpaceAddress(event);" maxlength="200" <?php } ?> onpaste="return false" name="custom[custom_<?php echo $key; ?>]" id="custom-<?php echo $key; ?>" value="<?php echo isset($customerAttributes['custom_'.$key]) ? $customerAttributes['custom_'.$key] : ''; ?>" title="<?= $block->escapeHtmlAttr(__($bigTypefiled)) ?>" class="input-text" <?php if($inputRequired) { ?>data-validate="{required:true}"<?php } ?>>

                <?php endif; ?>
            </div>

        </div>
    <?php endforeach; ?>
</div>
<input type="hidden" id="txt-tmp-group-id" value="<?php echo $group; ?>">
<?php endif; ?>
<style>
    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 34px;
    }

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .4s;
        transition: .4s;
    }

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

    input:checked + .slider {
        background-color: #d9222a;
    }

    input:focus + .slider {
        box-shadow: 0 0 1px #d9222a;
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

    /* Rounded sliders */
    .slider.round {
        border-radius: 34px;
    }

    .slider.round:before {
        border-radius: 50%;
    }
    .mand{
        color: #e02b27;
        font-size: 1.2rem;
        margin: 0 0 0 6px;
    }
    #mgt-custom-additnation-filed-preferred_language{
        margin-bottom: 30px;
    }
    .field.choice.newsletter{
        margin-bottom: 12px;
    }
    .fieldset.create.account{
        padding-bottom: 75px !important;
    }

    .custom-legend span{
        font-size: 2rem;
        margin: 20px 0;
        display: inline-block;
        position: relative;
        left: -2px;
    }
    .mgt-custom-additnation-filed{
        margin-bottom: 20px;
    }
</style>
<script>
    require([
        'jquery'
    ],function ($) {
        var group = $('#txt-tmp-group-id').val();
        if(group === '2') {
            $('.taxvat').css('display','block');
        }
        else {
            $('.taxvat').css('display','none');
        }
        $('#txt-register-is-seller').click(function () {
            var isCheck = $(this).is(":checked");
            if(isCheck) {
                $('.taxvat').css('display','none');
            }
            else {
                $('.taxvat').css('display','block');
            }
        })

    })
</script>
<script>
    // document.querySelector("#custom-phone").addEventListener("keypress", function (evt) {
    //     if (evt.which != 8 && evt.which != 0 && evt.which < 48 || evt.which > 57)
    //     {
    //         evt.preventDefault();
    //     }
    // });
    // document.querySelector("#custom-postcode").addEventListener("keypress", function (evt) {
    //     if (evt.which != 8 && evt.which != 0 && evt.which < 48 || evt.which > 57)
    //     {
    //         evt.preventDefault();
    //     }
    // });
    function characterWithSpaceAddress(event) {
        var regex = /^[@#$%<>"!`_~:;?\/\^\]&\[*}{)(=\\]*$/;
        var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
        console.log(key);
        if (regex.test(key)) {
            event.preventDefault();
            return false;
        }
    };
    function validateQty(event) {
        var key = window.event ? event.keyCode : event.which;
        if (event.keyCode == 8 || event.keyCode == 46
         || event.keyCode == 39) {
            return true;
        }
        else if ( key < 48 || key > 57 ) {
            return false;
        }
        else return true;
    };
    function validatePhone(event) {
        var key = window.event ? event.keyCode : event.which;
        console.log(key);
        if (event.keyCode == 8 || event.keyCode == 46 || event.keyCode == 39 || event.keyCode == 40 || event.keyCode == 41 || event.keyCode == 43 || event.keyCode == 45) {
            return true;
        }
        else if ( key < 48 || key > 57 ) {
            return false;
        }
        else return true;
    };
</script>
