Fix initialization of ButtonMenu

index.php

@@ -35,7 +35,7 @@
     </div>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.11/fabric.js"></script>
-    <script src="/dist/js/pw-image-editor.js"></script>
+    <script src="/dist/js/main.js"></script>
     <script src="/dist/js/init.js"></script>
 </body>
 </html>

src/js/components/ImageEditor/Canvas.js

@@ -1,4 +1,5 @@
 'use strict';
+var config = require('../config');
 var util = require('../util');
 var ApertureHandler = require('./ApertureHandler');
 var ButtonMenu = require('./ButtonMenu');
@@ -62,7 +63,8 @@ var Canvas = fabric.util.createClass(fabric.Canvas, {
      */
     getButtonMenu: function (settings) {
         if (!this.__buttonMenu) {
-            this.__buttonMenu = new ButtonMenu(this, settings);
+            var defaults = config.buttonMenu[this.__type];
+            this.__buttonMenu = new ButtonMenu(this, $.extend({}, defaults, settings));
         }
         return this.__buttonMenu;
     },

src/js/components/ImageEditor/ImageEditor.js

@@ -23,26 +23,24 @@ function ImageEditor(canvasId, args) {
      * @TODO: Refactor this. Since Canvas knows the type of editor it probably
      *        better could reside there.
      */
-    $(function () {
+    if (_canvas.__type === 'canvas') {
-        if (_canvas.__type === 'canvas') {
+        _canvas.getButtonMenu()
-            _canvas.getButtonMenu(config.buttonMenu.canvas)
+            .addItem('3D', function () {})
-                .addItem('3D', function () {})
+            .addItem('Flat', function () {}, true)
-                .addItem('Flat', function () {}, true)
+            .render();
-                .render();
+    } else {
-        } else {
+        _canvas.getButtonMenu()
-            _canvas.getButtonMenu(config.buttonMenu.wallpaper)
+            .addItem(['Show Murals Panel', 'Hide Murals Panel'], function () {
-                .addItem(['Show Murals Panel', 'Hide Murals Panel'], function () {
+                _canvas.getViewport().getGores().enable(this.isActive());
-                    _canvas.getViewport().getGores().enable(this.isActive());
+            })
-                })
+            .addItem(['Show Ruler', 'Hide Ruler'], function () {
-                .addItem(['Show Ruler', 'Hide Ruler'], function () {
+                _canvas.getViewport().getRulers().enable(this.isActive());
-                    _canvas.getViewport().getRulers().enable(this.isActive());
+            })
-                })
+            .addItem(['Fullscreen', 'Exit Fullscreen'], function () {
-                .addItem(['Fullscreen', 'Exit Fullscreen'], function () {
+                util.toggleFullscreen(_canvas.getSelectionElement().parentNode);
-                    util.toggleFullscreen(_canvas.getSelectionElement().parentNode);
+            })
-                })
+            .render();
-                .render();
+    }
-        }
-    });
 
     /**
      * Crops image to desired dimensions

src/js/init.js

@@ -13,7 +13,7 @@
 
     var imageUrl = '//images.photowall.com/products/' + $input.image_id.val() + '.jpg?h=450';
 
-    var editor = new ImageEditor('canvas-editor', {'type': 'wallpaper'})
+    var editor = new ImageEditor('canvas-editor', {'type': 'canvas'})
         .loadImage(imageUrl, function() {
             $input.w.trigger('input');
         });