From e6e0cd8b7e517a04cec9e9d74035b4bd6b29ddab Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@weahead.se>
Date: Mon, 12 Jun 2017 10:55:43 +0200
Subject: [PATCH] Documentation 3d handler

---
 src/js/includes/3dHandler.js | 23 +++++++++++++++++++++--
 src/js/init.js               |  2 +-
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/src/js/includes/3dHandler.js b/src/js/includes/3dHandler.js
index d126b62..9bebb0f 100644
--- a/src/js/includes/3dHandler.js
+++ b/src/js/includes/3dHandler.js
@@ -2,19 +2,22 @@
 
 var util = require('./util');
 
+/**
+ * Handles 3d image of canvas products.
+ * @param {canvas}
+ */
 function ThreeDHandler(canvas) {
     var _overlay = new fabric.Group();
     var _image;
 
     function init() {
-
-        // Width is made bigger as this works better with resizing the editor
         _overlay
             .set({
                 visible: false,
                 left: 0
             })
             .addWithUpdate(new fabric.Rect({
+                // Width is made bigger as this works better with resizing the editor
                 width: canvas.width * 2,
                 height: canvas.height,
                 top: 0,
@@ -28,6 +31,7 @@ function ThreeDHandler(canvas) {
     init();
 
     /**
+     * Disables the 3d image by removing visibility
      * @return {ThreeDHandler}
      */
     this.disable = function () {
@@ -36,6 +40,8 @@ function ThreeDHandler(canvas) {
     };
 
     /**
+     * Enables the 3d image by setting the width and visibility of the overlay and moving elements which
+     * needs to be visible to the front.
      * @return {ThreeDHandler}
      */
     this.enable = function () {
@@ -50,10 +56,17 @@ function ThreeDHandler(canvas) {
         return this;
     };
 
+    /**
+     * Checks if 3d mode is enabled/visible.
+     * @returns {boolean}
+     */
     this.isEnabled = function () {
         return _overlay.visible;
     };
 
+    /**
+     * Refreshes the image. This is mostly done upon resize of the window
+     */
     this.refreshImage = function() {
         if (util.isMobile()) {
             this.disable();
@@ -79,6 +92,10 @@ function ThreeDHandler(canvas) {
         this.applyImage();
     };
 
+    /**
+     * (Re)adds the new/existing image with new configuration to the overlay.
+     * @param {img}
+     */
     this.applyImage = function(img) {
         img = img || _image;
 
@@ -88,6 +105,8 @@ function ThreeDHandler(canvas) {
     };
 
     /**
+     * Sets the image and enables 3d mode.
+     * @param {img}
      * @return {ThreeDHandler}
      */
     this.setImage = function (img) {
diff --git a/src/js/init.js b/src/js/init.js
index d7221ff..30ddd5e 100644
--- a/src/js/init.js
+++ b/src/js/init.js
@@ -1,11 +1,11 @@
 'use strict';
 
-
 /**
  * This is just an example usage of the image editor. Also this is used for testing.
  * This code can be pretty messy, but that is fine because nothing of this will come to
  * production.
  */
+
 (function() {
     var $document = $(document);
     var $window = $(window);