Open file from parent document

Hi,

You can use an HTML event puzzle with your parent doc (for example, to setup clicks on a div). Inside its do slot just use the open file puzzle. It should work!

So the image already exists and you just need to fetch it? By URL or something?

Thanks for the details, now I see what you want.

The open file puzzle creates an input element, “clicks” on it, waits until the image is loaded and then saves the loaded image data to a global variable. You can check the generated code in the visual_logic.js file. It looks like this:

function openFile(callback) {

    _pGlob.openedFile = '';

    var input = document.createElement('input');
    input.type = 'file';
    input.style = 'display: none';
    // NOTE: fixes iOS event issue
    document.body.appendChild(input);

    input.addEventListener('change', function(event) {
        var file = event.target.files[0];

        var reader = new FileReader();

        reader.addEventListener('load', function () {
            _pGlob.openedFile = reader.result;
            callback();
            document.body.removeChild(input);
        }, false);

        reader.readAsDataURL(file);
    });

    if (appInstance.controls) {
        appInstance.controls.dispose();
        appInstance.enableControls();
    }

    input.click();
}

So, instead of that temporary input element, you need to use an existing one provided by Woocommerce. To do that, replace

var input = document.createElement('input');

with

var input = parent.document.getElementsByClassName('wc-pao-addon-file-upload input-text wc-pao-addon-field');

and remove other lines related to input creation and deletion so that it looks like

function openFile(callback) {

    _pGlob.openedFile = '';

    var input = parent.document.getElementsByClassName('wc-pao-addon-file-upload input-text wc-pao-addon-field');

    input.addEventListener('change', function(event) {
        var file = event.target.files[0];

        var reader = new FileReader();

        reader.addEventListener('load', function () {
            _pGlob.openedFile = reader.result;
            callback();

        }, false);

        reader.readAsDataURL(file);
    });

    if (appInstance.controls) {
        appInstance.controls.dispose();
        appInstance.enableControls();
    }

    input.click();
}

The changes in visual_logic.js will be dropped once you save Puzzles again, but at least give this a try.

May be the rest of the document has not loaded yet. Try calling open file upon mouse click or something.

Hi,

This won’t work with class name. Try creating your own button or use a timer puzzle.

Excellent!