Javascript Archives • Yoolk • Digital Ninja

Append url parameters to links with classname #Javascript

//Append url parameters to links with classname
(function() {
var domainsToDecorate = ['domain.com'], queryParams = ['utm_medium','utm_source','utm_campaign','utm_term','utm_content'];
var links = document.querySelectorAll('.rewrite-url'); 
for (var linkIndex = 0; linkIndex < links.length; linkIndex++) {
 for (var domainIndex = 0; domainIndex < domainsToDecorate.length; domainIndex++) { 
   if (links[linkIndex].href.indexOf(domainsToDecorate[domainIndex]) > -1 && links[linkIndex].href.indexOf("#") === -1) {
	 links[linkIndex].href = decorateUrl(links[linkIndex].href);
   }
 }
}
function decorateUrl(urlToDecorate) {
 urlToDecorate = (urlToDecorate.indexOf('?') === -1) ? urlToDecorate + '?' : urlToDecorate + '&';
 var collectedQueryParams = [];
 for (var queryIndex = 0; queryIndex < queryParams.length; queryIndex++) {
   if (getQueryParam(queryParams[queryIndex])) {
	 collectedQueryParams.push(queryParams[queryIndex] + '=' + getQueryParam(queryParams[queryIndex]))
   }
 }
 return urlToDecorate + collectedQueryParams.join('&');
}
function getQueryParam(name) {
 if (name = (new RegExp('[?&]' + encodeURIComponent(name) + '=([^&]*)')).exec(window.location.search))
   return decodeURIComponent(name[1]);
}

Hubspot Form Callbacks #Hubspot

// https://legacydocs.hubspot.com/global-form-events
// onBeforeFormInit - onFormReady - onFormSubmit - onFormSubmitted
window.addEventListener('message', event => {
 if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormReady') {
  // Form Ready
 } else if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmit') {
  // Form Submit
 }
});

Fetch .json file #Javascript

function fetchJSONFile(path, callback) {
    var httpRequest = new XMLHttpRequest();
    httpRequest.onreadystatechange = function() {
        if (httpRequest.readyState === 4) {
            if (httpRequest.status === 200) {
                var data = JSON.parse(httpRequest.responseText);
                if (callback) callback(data);
            }
        }
    };
    httpRequest.open('GET', path);
    httpRequest.send(); 
}

fetchJSONFile('file.json', function(data){
	// Do something with Data
    console.log(data);
});

Trim Input Whitespace #Javascript

/* trim-whitespace-input.js*/
$('.no-spaces-field').keyup(function() {
  $(this).val($(this).val().replace(/ +?/g, ''));
});

Download Textarea Content as Html File #Javascript

/* Download Textarea Content as Html File.js */
$('#download-button').click(function() {
    if ('Blob' in window) {
        var fileName = prompt('Please enter file name to save', 'Untitled.html');
        if (fileName) {
            var textValue = $('textarea').html();
            var textToWrite = htmlDecode(textValue);
            var textFileAsBlob = new Blob([textToWrite], {
                type: 'application/xhtml+xml'
            });
            if ('msSaveOrOpenBlob' in navigator) {
                navigator.msSaveOrOpenBlob(textFileAsBlob, fileName);
            } else {
                var downloadLink = document.createElement('a');
                downloadLink.download = fileName;
                downloadLink.innerHTML = 'Download File';
                if ('webkitURL' in window) {
                    downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
                } else {
                    downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
                    downloadLink.click(function() {
                        document.body.removeChild(event.target);
                    });
                    downloadLink.style.display = 'none';
                    document.body.appendChild(downloadLink);
                }
                downloadLink.click();
            }
        }
    } else {
        alert('Your browser does not support the HTML5 Blob.');
    }
});

Pass UTMs to iframe src #Javascript

// Iframe Container
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
jQuery(function() {
	var oldIframe = jQuery('#iframe');
	if (oldIframe.length) {
		var src = oldIframe.attr('src');
		if (src) {
			var iframeContent = $('<iframe id="iframe-new" src="' + src + location.search + '" style="border: none;width: 100%;background-color:#fff;"></iframe>');
			oldIframe.replaceWith(iframeContent);
		}
	}
});
</script>
<iframe id="iframe" src="https://go.domain.com/form.html"></iframe>

Create iFrame from Textarea Content Html #Javascript

/* Create iFrame from Textarea Content Html */
function setFrame() {
    var HTMLval = TextareaContentID.value;
    var iframe = document.getElementById('iframeID');
    iframe.contentWindow.document.open();
    iframe.contentWindow.document.write(HTMLval);
    iframe.contentWindow.document.close();
}

Detect Click Outside of the Element #Javascript

 // Hide Div when Click Outside of the Element using jQuery / https://www.codexworld.com/
$(document).mouseup(function(e){
    var container = $("#elementID");

    // If the target of the click isn't the container
    if(!container.is(e.target) && container.has(e.target).length === 0){
        container.hide();
    }
});

Pass Iframe height to Parent #Javascript

<!-- Iframe Container -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
var Iframe = jQuery('#iframe');
window.addEventListener('message', function(e) { 
	var eventName = e.data[0]; 
	var data = e.data[1]; 
	switch(eventName) { 
		case 'setHeight': 
			newIframe.height(data); 
		break;
	} 
}, false);
</script>
<iframe id="iframe" src="https://go.domain.com/form.html"></iframe>

<!-- Iframe Content -->
<script>
var StatusResizing = 'on';
setInterval(function() {
	if(StatusResizing == 'on') {
		resize();
	}
}, 1000);
function resize() {
	var height = $('body').outerHeight();
	window.parent.postMessage(["setHeight", height], "*"); 
}</script>

Detect if iOs #Javascript

/* Detect iOs */
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
// do something
}

No more items to load