[Solved]Custom code through Browser object?

0 favourites
  • 13 posts
From the Asset Store
This is a single chapter from the Construct Starter Kit Collection and the Student Workbook from the Workshop.
  • Hey all,

    I'm looking for a way to insert my own function (array converter, perferably with file select dialogue but that could be scrapped). This function is already written and working. I came across some ways using a browser object, but I could not for the life of .. figure out how I could get this to work. Could anyone shed some light on this case for me?

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • I really recommend you to write a plugin and forget about the Browser object.

  • I really recommend you to write a plugin and forget about the Browser object.

    For only one function, isn't that a bit of a lot of work?

  • var content="";
    var input="";
    var output="";
    var outputJson="";
    function readBlob(opt_startByte, opt_stopByte) {
    
        var files = document.getElementById('files').files;
        if (!files.length) {
          alert('Please select a file!');
          return;
        }
    
        var file = files[0];
        var start = parseInt(opt_startByte) || 0;
        var stop = parseInt(opt_stopByte) || file.size - 1;
    
        var reader = new FileReader();
    
        // If we use onloadend, we need to check the readyState.
        reader.onloadend = function(evt) {
          if (evt.target.readyState == FileReader.DONE) { // DONE == 2
            document.getElementById('byte_content').textContent = evt.target.result;
            document.getElementById('byte_range').textContent = 
                ['Read bytes: ', start + 1, ' - ', stop + 1,
                 ' of ', file.size, ' byte file'].join('');
                 content = evt.target.result;
    			 input = JSON.parse(content);
    			 output = {
        "c2array": true,
        "size": [input.frames.length, 4, 1],
        "data": input.frames.map(function(frame){
            return [
                [frame.image || ""],
                [frame.title],
                [frame.mediatype || ""],
                [frame.thumb || ""]
            ];
        })
    };
    
                    
    // the "null, 4" part is just to pretty-format the json (indent 4 spaces)
    var outputJson = JSON.stringify(output, null, 4);
          }
        };
    
        var blob = file.slice(start, stop + 1);
        reader.readAsBinaryString(blob);
      }
      
      document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {
        if (evt.target.tagName.toLowerCase() == 'button') {
          var startByte = evt.target.getAttribute('data-startbyte');
          var endByte = evt.target.getAttribute('data-endbyte');
          readBlob(startByte, endByte);
        }
      }, false);
    
    /*
    {
      "name": "werwer",
      "frames": [
        {
          "title": "[Nieuwe Dia]",
          "image": "\\files\\cacc0075a0c044cbc9ec.jpg",  //without the filepath
          "thumb": "\\files\\cacc0075a0c044cbc9ec.jpg",  //thumb could be neglected
          "mediatype": null, //same as thumb
          "media": [] //same as thumb
        },
        {
          "title": "[Nieuwe Dia]",
          "image": null,
          "thumb": null,
          "mediatype": null,
          "media": []
        },
        {
          "title": "[Nieuwe Dia]",
          "image": null,
          "thumb": null,
          "mediatype": null,
          "media": []
        },
        {
          "title": "[Nieuwe Dia]",
          "image": null,
          "thumb": null,
          "mediatype": null,
          "media": []
        }
      ]
    };
    */
    
    var output = {
        "c2array": true,
        "size": [input.frames.length, 4, 1],
        "data": input.frames.map(function(frame){
            return [
                [frame.image || ""],
                [frame.title],
                [frame.mediatype || ""],
                [frame.thumb || ""]
            ];
        })
    };
    
                    
    // the "null, 4" part is just to pretty-format the json (indent 4 spaces)
    var outputJson = JSON.stringify(output, null, 4);
    console.log("test");
    console.log(output);
    document.getElementById("out").innerHTML = outputJson;[/code:11qmusfh]
    
    This following code, it is by the way.
  • I have my own plugin where I put small functions like this. Browser Execute Javascript is not secure.

  • The SDK documentation is not really helping me in this one. Could you perhaps share this plugin you're talking about, maybe I could implement my own function in there

    To be a little bit more percise: Here is what I want to do.

    I have a JSON file, I want to select this from my hard-disk during runtime (file-dialogue). The function sees this, and reads the file > Converts it into C2JSON > Pastes this in an array called "PicProperties"

    Seeing that I am pretty new to C2, I have absolutely no idea how to do this plugin-wise. This function should ONLY be called during runtime (Thus eliminating the need for edit-time stuff.) Does this mean that I could comment out the whole edit-time part except the plugin details and such?

    EDIT (again): I am figuring that this is an ACT. How would I go and add an "File select" dialogue in C2?

    And: How could I return values to an already existing C2 array?

  • There's one problem with construct about this: You can't create associative arrays. Maybe you'll have a look at ReyRainbows HashPlugin. It's awesome to store JSON data. Maybe you could extend this plugin to fit your needs.

  • There's one problem with construct about this: You can't create associative arrays. Maybe you'll have a look at ReyRainbows HashPlugin. It's awesome to store JSON data. Maybe you could extend this plugin to fit your needs.

    The data-structure is already working, and the converter we currently use is also working, we just want to merge them

    But, thanks anyways. It's nice to see that noobs like me have no reason to be afraid to ask something

  • I'm sorry I couldnt help you. Please inform me about your progress!

  • I'm sorry I couldnt help you. Please inform me about your progress!

    It's no problem! Now things do get interesting, as we probably are going to run each input file through the converter manually

  • QuincyDK

    Hey, sorry I wasn't of more help either to your problem in the other post. What you just said made me ask myself : are those static data ? If so, the problem isn't the same. Executing code through execJS won't be a problem as it will only be for development. Once you've got the static data loaded in you array(s), you can use the "download" action to get there content as a C2 formated JSON file, that you will then be able to use in replacement of the execJS, for the real game.

  • QuincyDK

    Hey, sorry I wasn't of more help either to your problem in the other post. What you just said made me ask myself : are those static data ? If so, the problem isn't the same. Executing code through execJS won't be a problem as it will only be for development. Once you've got the static data loaded in you array(s), you can use the "download" action to get there content as a C2 formated JSON file, that you will then be able to use in replacement of the execJS, for the real game.

    Hey there! It isn't static data, as we grab the data from one of our servers. This data differs per "file". Hence the function we've written to convert to a C2 JSON string.

  • I'm sorry I couldnt help you. Please inform me about your progress!

    Here is the update: I came across callJS (plugin) and that has allowed me to use my own script file.

    With CallJS.execute("function();") I can execute a function, and then by using the CallJS.ReadExecutionReturn I can retrieve the return value

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)