Trying to load Ace.js editor on a Google App Engine site causes a malformed path error

Question

I have a problem with the using the Ace editor on my Python-based Google App Engine site. On my index page (which I render with jinja2), I load Ace like this:

<script type="text/javascript" src='media/ace-uncompressed-noconflict.js' charset='utf-8'></script>

When the <script> tag tries to load both the modes and themes of ace, a double slash shows up in the path after the media/ directory and an error like this results:

http://asdfcoding.appspot.com/media//theme-eclipse-uncompressed-noconflict.js
Failed to load resource: the server responded with a status of 404 (Not Found)

How can I get Ace's theme and mode files to load correctly?

My live site is asdfcoding on AppSpot. If you need more information, just let me know.

Answer 1

I had the same problem but on an embedded Microchip TCPIP stack server, quite unforgiving for malformed requests.

As a quick fix i did this:

In full ace.js:

change

this._loadTheme = function(name, callback) {
    if (!config.get("packaged"))
        return callback();

    var base = name.split("/").pop();
    var filename = config.get("themePath") + "/theme-" + base + config.get("suffix");
    net.loadScript(filename, callback);
};

add in filename = filename.replace("//theme","/theme");

this._loadTheme = function(name, callback) {
    if (!config.get("packaged"))
        return callback();

    var base = name.split("/").pop();
    var filename = config.get("themePath") + "/theme-" + base + config.get("suffix");
filename = filename.replace("//theme","/theme");
    net.loadScript(filename, callback);
};

and change

    function fetch(callback) {
        if (!config.get("packaged"))
            return callback();

        var base = mode.split("/").pop();
        var filename = config.get("modePath") + "/mode-" + base + ".js";
        net.loadScript(filename, callback);
    }

add in filename = filename.replace("//mode","/mode");

    function fetch(callback) {
        if (!config.get("packaged"))
            return callback();

        var base = mode.split("/").pop();
        var filename = config.get("modePath") + "/mode-" + base + ".js";
    filename = filename.replace("//mode","/mode");
        net.loadScript(filename, callback);
    }