fix(image rendering): fixed issue with image rendering, fixes #3804

public/less/sidemenu.less

@@ -13,6 +13,7 @@
   min-height: 100%;
   z-index: 101;
   transform: translate3d(-100%, 0, 0);
+  visibility: hidden;
 
   a:focus {
     text-decoration: none;

public/views/index.html

@@ -56,6 +56,7 @@
 	</script>
 
 	<!-- build:js [[.AppSubUrl]]/public/app/boot.js -->
+	<script src="[[.AppSubUrl]]/public/vendor/npm/es5-shim/es5-shim.js"></script>
 	<script src="[[.AppSubUrl]]/public/vendor/npm/es6-shim/es6-shim.js"></script>
 	<script src="[[.AppSubUrl]]/public/vendor/npm/es6-promise/dist/es6-promise.js"></script>
 	<script src="[[.AppSubUrl]]/public/vendor/npm/systemjs/dist/system.src.js"></script>

tasks/options/concat.js

@@ -28,6 +28,7 @@ module.exports = function(config) {
 
     js: {
       src: [
+        '<%= genDir %>/vendor/npm/es6-shim/es5-shim.js',
         '<%= genDir %>/vendor/npm/es6-shim/es6-shim.js',
         '<%= genDir %>/vendor/npm/es6-promise/es6-promise.js',
         '<%= genDir %>/vendor/npm/systemjs/dist/system.js',

vendor/phantomjs/render.js

@@ -1,55 +1,63 @@
-var page = require('webpage').create();
-var args = require('system').args;
-var params = {};
-var regexp = /^([^=]+)=([^$]+)/;
-
-args.forEach(function(arg) {
-  var parts = arg.match(regexp);
-  if (!parts) { return; }
-  params[parts[1]] = parts[2];
-});
-
-var usage = "url=<url> png=<filename> width=<width> height=<height> cookiename=<cookiename> sessionid=<sessionid> domain=<domain>";
-
-if (!params.url || !params.png || !params.cookiename || ! params.sessionid || !params.domain) {
-  console.log(usage);
-  phantom.exit();
-}
-
-phantom.addCookie({
-  'name': params.cookiename,
-  'value': params.sessionid,
-  'domain': params.domain
-});
-
-page.viewportSize = {
-  width: params.width || '800',
-  height: params.height || '400'
-};
-
-var tries = 0;
-
-page.open(params.url, function (status) {
-  console.log('Loading a web page: ' + params.url);
-
-  function checkIsReady() {
-    var canvas = page.evaluate(function() {
-      var body = angular.element(document.body);   // 1
-      var rootScope = body.scope().$root;
-      var panelsToLoad = angular.element('div.panel').length;
-      return rootScope.performance.panelsRendered >= panelsToLoad;
-    });
-
-    if (canvas || tries === 1000) {
-      page.render(params.png);
-      phantom.exit();
-    }
-    else {
-      tries++;
-      setTimeout(checkIsReady, 10);
-    }
+(function() {
+  'use strict';
+
+  var page = require('webpage').create();
+  var args = require('system').args;
+  var params = {};
+  var regexp = /^([^=]+)=([^$]+)/;
+
+  args.forEach(function(arg) {
+    var parts = arg.match(regexp);
+    if (!parts) { return; }
+    params[parts[1]] = parts[2];
+  });
+
+  var usage = "url=<url> png=<filename> width=<width> height=<height> cookiename=<cookiename> sessionid=<sessionid> domain=<domain>";
+
+  if (!params.url || !params.png || !params.cookiename || ! params.sessionid || !params.domain) {
+    console.log(usage);
+    phantom.exit();
   }
 
-  setTimeout(checkIsReady, 200);
+  phantom.addCookie({
+    'name': params.cookiename,
+    'value': params.sessionid,
+    'domain': params.domain
+  });
+
+  page.viewportSize = {
+    width: params.width || '800',
+    height: params.height || '400'
+  };
+
+  var tries = 0;
+
+  page.open(params.url, function (status) {
+    console.log('Loading a web page: ' + params.url + ' status: ' + status);
+
+    function checkIsReady() {
+      var canvas = page.evaluate(function() {
+        if (!window.angular) { return false; }
+        var body = window.angular.element(document.body);   // 1
+        if (!body.scope) { return false; }
+
+        var rootScope = body.scope();
+        if (!rootScope) {return false;}
+        if (!rootScope.performance) { return false; }
+        var panelsToLoad = window.angular.element('div.panel').length;
+        return rootScope.performance.panelsRendered >= panelsToLoad;
+      });
+
+      if (canvas || tries === 1000) {
+        page.render(params.png);
+        phantom.exit();
+      }
+      else {
+        tries++;
+        setTimeout(checkIsReady, 10);
+      }
+    }
 
-});
+    setTimeout(checkIsReady, 200);
+  });
+})();