Javascript Improved

Initialize

PageEnter

PageLeave

<html>

<head><title>Something is not working...</title></head>

<body>

<center><div style="width:400px;background-color:#FF0000;color:#FFFFFF;padding:30px;margin:40px 0px 40px 0px; font-family: Tahoma, Geneva, sans-serif; font-size: 18px;"><p>Sorry for the inconvenience, but something is not working.</p><p>Please make sure that you use one of the recommended browsers Chrome, Safari, Internet Explorer 11 or Firefox.</p></div></center>

</body></html>

AxureEx

Release 2018-03-17 | dejongh.dk/license

Made By Sam Hepworth

//}</style><script type="text/javascript">
/*! AxureEx 2018-03-17 | dejongh.dk/license */
// var $, $axure, $var;
window.open = window.open;
window.open = function () {
  "use strict";
  function initialize() {
    if (window.$) {
      $(document).ready(function () {
       setTimeout(function () {window.open('javascript:');}, 0);
      });
     } else {
      setTimeout(initialize, 0);
     }
  }
  setTimeout(initialize, 0);
  if (typeof String.prototype.trim !== "function") {
    String.prototype.trim = function () {
      return this.replace(/^\s+|\s+$/g, "");
    };
  }
  var _open = window.open;
  var __open = function(url, a, b, c) {
      if (c !== undefined) return _open(url, a, b, c);
      if (b !== undefined) return _open(url, a, b);
      if (a !== undefined) return _open(url, a);
      return _open(url);
  };
  return function (url, a, b, c) {
    if ((url.substring(0, 11) !== "javascript:") || (!$axure)) {
      if (window.openReplace) {
        window.openReplace = false;
        window.location.replace(url);
        return false;
      }
      return __open(url, a, b, c);
    }
    if (!$axure.error) {
      var ignoreError;
      $axure.error = function (msg) {
         if (console) console.log(msg);
        if (!ignoreError) ignoreError = !confirm(msg);
        return false;
      };
      $axure.internal(function ($ax) {
        $axure.debug = $ax.globalVariableProvider.getVariableValue('Debug') !== '';
      });
      if (window.AxureExInitialize) window.AxureExInitialize();
    }
    var script = url.substring(11).trim();
    if (false && console) console.log("** " + script + " **\n");
    if ((script[0] === '/') && (script[1] === '/')) return false;
    if ((script[0] == '@') || (script[0] == '#')) {
      var args = script.split("<,>");
      var src = args[0].split(":");
      script = $axure(src[0].trim()).text();
      if (!script) return $axure.error('Widget "' + src[0] + '" not found.');
      for (var i = 1; i < args.length; i++) {
        var l = args[i].split(':');
        script = script.replace("[[" + l[0].trim() + "]]", JSON.stringify(l.slice(1).join(':')).slice(1, -1).replace("'", "\\'"));
      }
      if (src.length > 1) {
        var frame = $axure(src[1].trim()).$().children("iframe")[0];
        if (!frame) return $axure.error('Widget InlineFrame "' + src[1] + '" not found.');
        frame = (frame.contentWindow ? frame.contentWindow : frame.contentDocument.document ? frame.contentDocument.document : frame.contentDocument).document;
        frame.open("text/html", "replace");
        frame.write(script);
        frame.close();
        return false;
      }
    }
    if (script !== '') {
      if ($axure.debug) script = eval(script);
      else try {
        script = eval(script);
      } catch (err) {
        return $axure.error("Exception:\n" + err + "\n\nTrace:\n" + err.stack + "\n\nScript:\n" + script.slice(0, 1024));
      }
      if (script) return __open('javascript: ' + JSON.stringify(script) + ';', a, b, c);
    }
    return false;
  };
}();
if (console) console.log("** AxureEx **");
//</script><style type="text/css">{

Javascript Examples

Javascript Inline Frame

AxureEx Examples

AxureEx Transform

AxureEx History A

AxureEx History B

AxureEx History C

AxureEx Repeater A

AxureEx Repeater B

Desktop Candy

Mobile Candy

Webfonts

Material Design

AxureEx @ dejongh.dk

Native Examples

AxureEx @ github.com

AxureEx @ forum.axure.com

Sticky Header

Javascript Imrpoved

jshint.com

Javascript code inserted via the "Webfont Tag" in the preview settings of the prototype enables Javascript to be executed using the "Open link in new window/tab" action. This method has a number of advantages over executing javascript via "Open link in current window."

Improved Javascript Injection

Old Method Demo

Improve javascript injection with a chuck of javascript inserted as a webfont. The javascript overrides the window.open function enabling javascript to be executed in an "Open Link in New Window/Tab" action.

In the Axure menu choose "Publish > Preview Options > Configure", add a new webfont and insert the javascript below in the webfont tag.

The most important benefit of the new javascript injection method is that multiple actions with javascript no longer cancel out each other.

Click on the [Old Method] button to see that only the javascript in the second action is executed when viewed in the Chrome browser.

Click on the [New Method] button to see that the javascript in both actions are executed when viewed in the Chrome browser.

New Method Demo

Executing javascript via "Open Link in New Window/Tab" has the additional benefit the function stored in window.AxureExInitialize is called before any javascript is executed. Place initialization code in this function.

Is this prototype window.AxureExInitialize is initialized by javascript stored in the AxureEx.Shared webfont. AxureEx extends the AxQuery API with additional functionality.

1

2

3

The new method also allowes text of widgets to be executed as javascript.

Use the syntax javascript:"@"<name of widget> to automatically execute the text of a widget as javascript.

It is even possible to pass variables to the executed javascript. Use the synax javascript:"@"<name of widget>"<,>"<name of variable>":"<value of variabe> an example;

@Example.Script<,>Name:Sam

New Method Demo

4

CSS can also be inserted via the "Webfont Tag".