onlycode.org

javascript
jquery
html
angularjs
css
node.js
ajax
html5
php
json
arrays
google-chrome
dom
regex
reactjs
ecmascript-6
javascript-events

your's history:
upgrade to babel 7 canno...

Upgrade to Babel 7: Cannot read property 'bindings' of null, just only code

babeljs | node.js | javascript

edit
{ "presets": ["env"] } 
{ "presets": ["@babel/preset-env"] }

25
connexo, 30.08.2018 11:48


edit
import Cookies from 'js-cookie';

let cleanForm = (form) => {
	const htmlForm = form.getFormElem();
    htmlForm.removeClass('mktoForm').removeAttr('style');
    htmlForm.find('[style]').removeAttr('style');
    // htmlForm.find('label').text();
	htmlForm.find('.mktoCheckboxList').parent().addClass('custom-control custom-checkbox');
    // htmlForm.find('.mktoField, .mktoLabel, .mktoCheckboxList, .mktoButtonWrap, .mktoFieldDescriptor, .mktoFormCol, .mktoHtmlText, .mktoRadioList ').attr('style','');
    htmlForm.find('.mktoGutter, .mktoClear, .mktoOffset, .mktoAsterix').remove();
    $('#mktoForms2BaseStyle').remove();
    // htmlForm.find('.mktoRadioList').find()
};


let styleCheckbox = (index, element) =>{
	let jqEl  = $(element);
	jqEl.addClass('custom-control-input').removeClass('mktoField');
	$("label[for=" jqEl.attr('id') "].custom-control-label").insertAfter(jqEl);
};

let styleRadio = (index, element) =>{
	let jqEl  = $(element);
	jqEl.addClass('custom-control-input').removeClass('mktoField');
	$("label[for=" jqEl.attr('id') "].custom-control-label").insertAfter(jqEl);
};


let addStyles = (form) => {
    const htmlForm = form.getFormElem();
    htmlForm.find('.mktoFormRow').addClass('row').removeClass('mktoFormRow');
	htmlForm.find('.mktoButtonRow').addClass('row').removeClass('mktoButtonRow');
	htmlForm.find('.mktoFormCol').addClass('col-md').removeClass('mktoFormCol');
    //htmlForm.find('.custom-control').children('.mktoLabel').addClass('custom-control-label');
    htmlForm.find('.mktoRadioList').find('input').map(function(){
        $(this).next().addClass('custom-control-label');
        $(this).next().addBack().wrapAll('<div class="custom-control custom-radio">');
      });
    let checkboxList = htmlForm.find('.mktoCheckboxList');
    checkboxList.find('input').map(function(){
        $(this).parent().addClass('row');
        $(this).next().addClass('custom-control-label');
        if(checkboxList.children().length){
            $(this).next().addBack().wrapAll('<div class="custom-control custom-checkbox col-md-4">');
        }else{
            $(this).next().addBack().wrapAll('<div class="custom-control custom-checkbox col-md">');
        }

    });


    htmlForm.find('select').addClass('custom-select mb-0 mt-4');
	const btnIcon =  '<span class="rounded-circle border border-white btn-icon align-middle ml-2"><svg viewBox="0 0 100 100" fill="currentColor" class="icon"><use xlink:href="#arrow-point-to-right"></use></svg></span>';
    let checkbox = htmlForm.find('input[type=checkbox]');
    let radio = htmlForm.find('input[type=radio]');
    let submitButton = htmlForm.find('.mktoButton');
	let inputs = htmlForm.find('.mktoField').not( 'input[type=checkbox]').not( 'input[type=radio]');
    let fieldset = htmlForm.find('fieldset');
    let labels = inputs.prev();
    checkbox.map(styleCheckbox);
    radio.map(styleCheckbox);

	// htmlForm.addClass('form-icons marketoForm');
    inputs.addClass('form-control mb-0 mt-4');
    labels.addClass('mb-0 mt-4 fs-17');
	fieldset.addClass('my-c_3 mt-5');
    submitButton.parent().addClass('ml-auto mr-md-3 mt-md-3 w-sm-100 mb-3');
	submitButton.addClass('btn btn-orange px-5 py-2 w-sm-100');
};



let addIcon = (name, icons) => {
  let key = name.toLowerCase();
	let iconName;

  if(icons.hasOwnProperty(key)){
    iconName = icons[key];
  }else{
    iconName = icons.default;
  }

  return '<label class="input-icon" for="' name '"><svg class="icon ' iconName '"><use xlink:href="#' iconName '"></use></svg></label>';
};

let contactIcons = () => ({
	'projettechnos'      :'white-cogwheel',
    'email'              :'email',
    'phone'              :'telephone',
    'fonction'           :'pen',
    'servicescontactform':'white-cogwheel',
    'lastname'           :'lastname',
    'firstname'          :'lastname',
    'messagecontactform' :'send',
    'company'            :'city',
    'right-arrow'        :'right-arrow',
    'default'            :'white-cogwheel'
});

// Modal
let modalAuto =  $('#modal-auto');
let modalForm = $('#modal-form');
let modalThanks = $('#modal-thanks');


// store marketo submitetdata
var mktoData;

let successCallback = (form) => {
    form.onSuccess(function(values){
        location.href="#";
        modalForm.modal('hide');
        modalThanks.modal('show');
        mktoData = values;
        return false;

    });
}

let styleForm = (form) => {
    cleanForm(form);
    addStyles(form);
    successCallback(form);
    actions(form);
}

let actions = (form) =>{
    modalForm.on('hide.bs.modal', function () {
        let fomrElements = form.getFormElem()[0];
        fomrElements.reset();
        return true;
    });
}

var modalTimer;
if(settings.displayPopUp) {
    if('ontouchstart' in document.documentElement){
        //mobile behaviour
        modalTimer = setInterval(()=> modalAuto.modal('show'), settings.modalTimer*1000);
    } else{
        //desktop behavior
        document.addEventListener('mouseleave', (ev) => {
            if(ev.clientY < 0){
                if(!Cookies.get('showedModal')){
                    modalAuto.modal('show');
                }
            }
        });
    }
}



let addScript = ( src ) => {
  let s = document.createElement( 'script' );
  s.setAttribute( 'src', src );
  s.setAttribute("defer", "defer");
  document.body.appendChild( s );
}

let addStyle = ( src ) => {
    let head = document.getElementsByTagName('head')[0];
    let style = document.createElement('link');
    style.href = src;
    style.type = 'text/css';
    style.rel = 'stylesheet';
    head.appendChild(style);
}

if(settings.calendly){
    addStyle('https://assets.calendly.com/assets/external/widget.css');
    addScript('https://assets.calendly.com/assets/external/widget.js');


    $('[data-calendly]').on('click',(ev)=>{
        let calendlyData =
            `first_name=${mktoData.FirstName ? mktoData.FirstName : ''}
            &last_name=${mktoData.LastName ? mktoData.LastName : ''}
            &email=${mktoData.Email ? mktoData.Email : ''}
            &a1=${mktoData.Company ? mktoData.Company : ''}
            &a2=${mktoData.Phone ? mktoData.Phone : ''}`
        let calendlyURL = $(ev.target).data('calendly')
        Calendly.showPopupWidget(calendlyURL  "?" calendlyData);
    })

}

modalAuto.on('shown.bs.modal', function () {
    clearInterval(modalTimer);
    Cookies.set('showedModal', true, { expires: 1 });
})

modalForm.on('shown.bs.modal', function () {
    clearInterval(modalTimer);
    $('body').addClass('modal-open');
    $(this).addClass('bg-blue-gradient-y');

}).on('hide.bs.modal', function(){
    $(this).removeClass('bg-blue-gradient-y');
});


modalThanks.on('shown.bs.modal', function() {
    $('body').addClass('modal-open');
    $(this).addClass('bg-blue-gradient-y');
}).on('hide.bs.modal', function(){
    $(this).removeClass('bg-blue-gradient-y');
});

export default styleForm;


, 09.04.2019 14:14


Add your just only code

your name:    



If you need full text click here

Some similar links Upgrade to Babel 7: Cannot read property 'bindings' of null ↓:
Cannot read property 'addEventListener' of null

D3 v4 - cannot read property text of null

Uncaught TypeError: Cannot read property 'value' of null

Uncaught Typeerror: cannot read property 'innerHTML' of null



This project is created for those who just need only code, wihout maaaaaaaaaaany words.