Image Load detection

$('<img />').load( function(){
console.log('Image Loaded');
$(".js-gallery-popup-loader").hide();
}).attr('src', item.imagePath);

get vimeo thumbnail

var video_code = $(".video-code").val();
$.ajax({
    type:'GET',
    url: 'http://vimeo.com/api/v2/video/' + video_code + '.json',
    jsonp: 'callback',
    dataType: 'jsonp',
    success: function(data){
        var thumbnail_src = data[0].thumbnail_large;
        if(thumbnail_src) {
            pageBody.find('.thumb-container img').attr("src", thumbnail_src);
        }
    }
});

Get Image Size in Javascrip

var getImageSize = function(imgSrc){
       var imageSize = '';
        var obj = new XMLHttpRequest();
        obj.open('HEAD', imgSrc, true);
        obj.onreadystatechange = function(){
            if ( obj.readyState == 4 ) {
                if ( obj.status == 200 ) {
                    //alert('Size in bytes: ' + obj.getResponseHeader('Content-Length'));
                    imageSize = obj.getResponseHeader('Content-Length');
                } else {
                }
            }
        };
        obj.send(null);
        return imageSize;
    };

base64 Image

form.find("input[type='file']").on("change", function () {
if (this.files && this.files[0]) {
var FR = new FileReader();
FR.onload = function () {
previewElement.attr('src', FR.result);
};
FR.readAsDataURL(this.files[0]);
}
});

http://www.javascripture.com/FileReader


const reader  = new FileReader();
reader.addEventListener('load', function (e) {
document.querySelector('.photo-image').setAttribute('src', reader.result);
}, false);
reader.readAsDataURL(file);

Javascript/jQuery Same but little difference

mousedown vs click
parents vs closest

Prototype

Prototype:

Prototype is a property of functions and of objects that are created by constructor functions. The prototype of a function is an object. Its main use is when a function is used as a constructor.

·         https://docs.microsoft.com/en-us/scripting/javascript/advanced/prototypes-and-prototype-inheritance

https://github.com/happymishra/JavaScriptTutorials/blob/master/Part2/Prototypes.md

·         http://javascriptissexy.com/javascript-prototype-in-plain-detailed-language/

Javascript call, bind and apply

The call() method calls a function with a given this value and arguments provided individually.

The apply() method calls a function with a given this value, and arguments provided as an array

The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.

While the syntax of this function is almost identical to that of apply(), the fundamental difference is that call() accepts an argument list, while apply() accepts a single array of arguments.

The difference is that apply lets you invoke the function with arguments as an array; callrequires the parameters be listed explicitly. A useful mnemonic is "A for array and C for comma."

Pseudo syntax:

theFunction.apply(valueForThis, arrayOfArgs)

theFunction.call(valueForThis, arg1, arg2, ...)

Use .bind() when you want that function to later be called with a certain context, useful in events. Use .call() or .apply() when you want to invoke the function immediately, and modify the context.

Call/apply call the function immediately, whereas bind returns a function that, when later executed, will have the correct context set for calling the original function. This way you can maintain context in async callbacks and events.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call

JavaScript Practical Applications of Call,Apply and Bind functions

https://www.youtube.com/watch?v=c0mLRpw-9rI

Javascript Undefined vs NULL

https://stackoverflow.com/questions/5076944/what-is-the-difference-between-null-and-undefined-in-javascript

undefined means a variable has been declared but has not yet been assigned a value. On the other hand, null is an assignment value. It can be assigned to a variable as a representation of no value.

Also, undefined and null are two distinct types: undefined is a type itself (undefined) while null is an object.

Unassigned variables are initialized by JavaScript with a default value of undefined. JavaScript never sets a value to null. That must be done programmatically.