/**
 * Extend object a with the properties of object b.
 * If there's a conflict, object b takes precedence.
 *
 * @param {object} a
 * @param {object} b
 */
export const extend = (a, b) => {
    for (let i in b) {
        a[i] = b[i];
    }

    return a;
};

/**
 * querySelectorAll but returns an Array.
 */
export const queryAll = (el, selector) => {
    return Array.from(el.querySelectorAll(selector));
};

/**
 * classList.toggle() with cross browser support
 */
export const toggleClass = (el, className, value) => {
    if (value) {
        el.classList.add(className);
    } else {
        el.classList.remove(className);
    }
};

/**
 * Utility for deserializing a value.
 *
 * @param {*} value
 * @return {*}
 */
export const deserialize = (value) => {
    if (typeof value === "string") {
        if (value === "null") return null;
        else if (value === "true") return true;
        else if (value === "false") return false;
        else if (value.match(/^-?[\d\.]+$/)) return parseFloat(value);
    }

    return value;
};

/**
 * Measures the distance in pixels between point a
 * and point b.
 *
 * @param {object} a point with x/y properties
 * @param {object} b point with x/y properties
 *
 * @return {number}
 */
export const distanceBetween = (a, b) => {
    let dx = a.x - b.x,
        dy = a.y - b.y;

    return Math.sqrt(dx * dx + dy * dy);
};

/**
 * Applies a CSS transform to the target element.
 *
 * @param {HTMLElement} element
 * @param {string} transform
 */
export const transformElement = (element, transform) => {
    element.style.transform = transform;
};

/**
 * Element.matches with IE support.
 *
 * @param {HTMLElement} target The element to match
 * @param {String} selector The CSS selector to match
 * the element against
 *
 * @return {Boolean}
 */
export const matches = (target, selector) => {
    let matchesMethod =
        target.matches || target.matchesSelector || target.msMatchesSelector;

    return !!(matchesMethod && matchesMethod.call(target, selector));
};

/**
 * Find the closest parent that matches the given
 * selector.
 *
 * @param {HTMLElement} target The child element
 * @param {String} selector The CSS selector to match
 * the parents against
 *
 * @return {HTMLElement} The matched parent or null
 * if no matching parent was found
 */
export const closest = (target, selector) => {
    // Native Element.closest
    if (typeof target.closest === "function") {
        return target.closest(selector);
    }

    // Polyfill
    while (target) {
        if (matches(target, selector)) {
            return target;
        }

        // Keep searching
        target = target.parentNode;
    }

    return null;
};

/**
 * Handling the fullscreen functionality via the fullscreen API
 *
 * @see http://fullscreen.spec.whatwg.org/
 * @see https://developer.mozilla.org/en-US/docs/DOM/Using_fullscreen_mode
 */
export const enterFullscreen = (element) => {
    element = element || document.documentElement;

    // Check which implementation is available
    let requestMethod =
        element.requestFullscreen ||
        element.webkitRequestFullscreen ||
        element.webkitRequestFullScreen ||
        element.mozRequestFullScreen ||
        element.msRequestFullscreen;

    if (requestMethod) {
        requestMethod.apply(element);
    }
};

/**
 * Creates an HTML element and returns a reference to it.
 * If the element already exists the existing instance will
 * be returned.
 *
 * @param {HTMLElement} container
 * @param {string} tagname
 * @param {string} classname
 * @param {string} innerHTML
 *
 * @return {HTMLElement}
 */
export const createSingletonNode = (
    container,
    tagname,
    classname,
    innerHTML = "",
) => {
    // Find all nodes matching the description
    let nodes = container.querySelectorAll("." + classname);

    // Check all matches to find one which is a direct child of
    // the specified container
    for (let i = 0; i < nodes.length; i++) {
        let testNode = nodes[i];
        if (testNode.parentNode === container) {
            return testNode;
        }
    }

    // If no node was found, create it now
    let node = document.createElement(tagname);
    node.className = classname;
    node.innerHTML = innerHTML;
    container.appendChild(node);

    return node;
};

/**
 * Injects the given CSS styles into the DOM.
 *
 * @param {string} value
 */
export const createStyleSheet = (value) => {
    let tag = document.createElement("style");
    tag.type = "text/css";

    if (value && value.length > 0) {
        if (tag.styleSheet) {
            tag.styleSheet.cssText = value;
        } else {
            tag.appendChild(document.createTextNode(value));
        }
    }

    document.head.appendChild(tag);

    return tag;
};

/**
 * Returns a key:value hash of all query params.
 */
export const getQueryHash = () => {
    let query = {};

    location.search.replace(/[A-Z0-9]+?=([\w\.%-]*)/gi, (a) => {
        query[a.split("=").shift()] = a.split("=").pop();
    });

    // Basic deserialization
    for (let i in query) {
        let value = query[i];

        query[i] = deserialize(unescape(value));
    }

    // Do not accept new dependencies via query config to avoid
    // the potential of malicious script injection
    if (typeof query["dependencies"] !== "undefined")
        delete query["dependencies"];

    return query;
};

/**
 * Returns the remaining height within the parent of the
 * target element.
 *
 * remaining height = [ configured parent height ] - [ current parent height ]
 *
 * @param {HTMLElement} element
 * @param {number} [height]
 */
export const getRemainingHeight = (element, height = 0) => {
    if (element) {
        let newHeight,
            oldHeight = element.style.height;

        // Change the .stretch element height to 0 in order find the height of all
        // the other elements
        element.style.height = "0px";

        // In Overview mode, the parent (.slide) height is set of 700px.
        // Restore it temporarily to its natural height.
        element.parentNode.style.height = "auto";

        newHeight = height - element.parentNode.offsetHeight;

        // Restore the old height, just in case
        element.style.height = oldHeight + "px";

        // Clear the parent (.slide) height. .removeProperty works in IE9+
        element.parentNode.style.removeProperty("height");

        return newHeight;
    }

    return height;
};

const fileExtensionToMimeMap = {
    mp4: "video/mp4",
    m4a: "video/mp4",
    ogv: "video/ogg",
    mpeg: "video/mpeg",
    webm: "video/webm",
};

/**
 * Guess the MIME type for common file formats.
 */
export const getMimeTypeFromFile = (filename = "") => {
    return fileExtensionToMimeMap[filename.split(".").pop()];
};

/**
 * Encodes a string for RFC3986-compliant URL format.
 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI#encoding_for_rfc3986
 *
 * @param {string} url
 */
export const encodeRFC3986URI = (url = "") => {
    return encodeURI(url)
        .replace(/%5B/g, "[")
        .replace(/%5D/g, "]")
        .replace(
            /[!'()*]/g,
            (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`,
        );
};
