Html – Programmatically add youtube ad breaks to own video via script (in JS)

//modified code from https://stackoverflow.com/questions/6157929/how-to-simulate-a-mouse-click-using-javascript
//added a function that makes pointer event coordinates to be at the exact coordinates of the clicked element
var defaultOptions = {
    pointerX: 0,
    pointerY: 0,
    button: 0,
    ctrlKey: false,
    altKey: false,
    shiftKey: false,
    metaKey: false,
    bubbles: true,
    cancelable: true
}
function extend(destination, source) {
    for (var property in source)
      destination[property] = source[property];
    return destination;
}

var eventMatchers = {
    'HTMLEvents': /^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/,
    'MouseEvents': /^(?:click|dblclick|mouse(?:down|up|over|move|out))$/
}

//function that simulates typing of a string
function typeString(element, str){
    for (var i = 0; i < str.length; i++){
        var keyCode = str.charCodeAt(i);
        simulateKeyboard(element, "keydown", {keyCode: keyCode});
        simulateKeyboard(element, "keypress", {keyCode: keyCode});
        simulateKeyboard(element, "keyup", {keyCode: keyCode});
        element.value += str[i];
    }
}


//in order to automatically add ad breaks to the video, we can use it like this:
simulate(document.querySelector("#add-ad-break"), "mousedown");
simulate(document.querySelector("#add-ad-break"), "click");
simulate(document.querySelector("#add-ad-break"), "mouseup");

//you can play around a bit and see if it works
typeString(document.querySelector("#search"), "hello world");
//now send enter or tab in order for youtube to recognize the input
simulateKeyboard(document.querySelector("#search"), "keydown", {keyCode: 13});


function simulate(element, eventName, extraoptions) {
    var options = extend(defaultOptions, extraoptions || {});
    var oEvent, eventType = null;
    //get position of element and set pointer event coordinates to be at the exact coordinates of the clicked element
var rect = element.getBoundingClientRect();
options.pointerX = rect.left + rect.width/2;
options.pointerY = rect.top + rect.height/2;

    for (var name in eventMatchers) {
        if (eventMatchers[name].test(eventName)) { eventType = name; break; }
    }

    if (!eventType)
        throw new SyntaxError('Only HTMLEvents and MouseEvents interfaces are supported');

    if (document.createEvent) {
        oEvent = document.createEvent(eventType);
        if (eventType == 'HTMLEvents') {
            oEvent.initEvent(eventName, options.bubbles, options.cancelable);
        }
        else {
            oEvent.initMouseEvent(eventName, options.bubbles, options.cancelable, document.defaultView,
            options.button, options.pointerX, options.pointerY, options.pointerX, options.pointerY,
            options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, element);
        }
        element.dispatchEvent(oEvent);
    }
    else {
        options.clientX = options.pointerX;
        options.clientY = options.pointerY;
        var evt = document.createEventObject();
        oEvent = extend(evt, options);
        element.fireEvent('on' + eventName, oEvent);
    }
    return element;
}
function simulateKeyboard(element, eventName, extraoptions) {
    var options = extend(defaultOptions, extraoptions || {});
    var oEvent, eventType = null;

    if (document.createEvent) {
        oEvent = document.createEvent("KeyboardEvent");
        oEvent.initKeyboardEvent(eventName, options.bubbles, options.cancelable, document.defaultView, options.key, options.location, options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.repeat, options.locale);
        element.dispatchEvent(oEvent);
    }
    else {
        var evt = document.createEventObject();
        oEvent = extend(evt, options);
        element.fireEvent('on' + eventName, oEvent);
    }
    return element;
}

<input type=text id=search>
<button onclick="console.log('click')" id=add-ad-break>onclick</button>