added tooltips

extension/Resources/Public/Json/fabric.buttons.json

@@ -10,6 +10,7 @@
             "hasToggleElement": false,
             "toggleElement": "",
             "disabled": false,
+            "tooltip": "Draw with a pencil",
             "icon": "glyphicon-pencil"
         },
         {
@@ -22,6 +23,7 @@
             "hasToggleElement": false,
             "toggleElement": "",
             "disabled": false,
+            "tooltip": "Highlighter",
             "icon": "glyphicon-pencil"
         },
 
@@ -35,6 +37,7 @@
           "hasToggleElement": true,
           "toggleElement": "emojiContainer",
           "disabled": false,
+          "tooltip": "Emojis",
           "icon": "glyphicon-ice-lolly-tasted"
         },
         {
@@ -47,6 +50,7 @@
             "hasToggleElement": false,
             "toggleElement": "",
           "disabled": false,
+          "tooltip": "Draw a rectangle to highlight areas",
             "icon": "glyphicon-stop"
         },
       {
@@ -59,6 +63,7 @@
         "hasToggleElement": false,
         "toggleElement": "",
         "disabled": false,
+        "tooltip": "Adds a customizable text to canvas",
         "icon": "glyphicon-text-height"
       },
         {
@@ -71,6 +76,7 @@
             "hasToggleElement": false,
             "toggleElement": "",
           "disabled": false,
+          "tooltip": "Move the viewport, useful if zoomed",
             "icon": "glyphicon-move"
         },
         {
@@ -83,6 +89,7 @@
             "hasToggleElement": false,
             "toggleElement": "",
           "disabled": false,
+          "tooltip": "Delete selected object",
             "icon": "glyphicon-trash"
         },
         {
@@ -95,6 +102,7 @@
           "hasToggleElement": false,
           "toggleElement": "",
           "disabled": false,
+          "tooltip": "Zoom viewport",
           "icon": "glyphicon-search"
         },
       {
@@ -107,6 +115,7 @@
         "hasToggleElement": false,
         "toggleElement": "",
         "disabled": false,
+        "tooltip": "Normal mouse to select objects in canvas",
         "icon": "glyphicon-hand-up"
       },
       {
@@ -119,6 +128,7 @@
         "hasToggleElement": false,
         "toggleElement": "",
         "disabled": true,
+        "tooltip": "Undo",
         "icon": "glyphicon-repeat icon-flipped"
       },
       {
@@ -131,6 +141,7 @@
         "hasToggleElement": false,
         "toggleElement": "",
         "disabled": true,
+        "tooltip": "Redo",
         "icon": "glyphicon-repeat"
       }
 

javascript/src/Plugins/qfq.fabric.js

@@ -114,6 +114,7 @@ $(function (n) {
                     that.qFabric.buttonPress(modePressed, $button)
                 });
                 $button.prop("disabled", o.disabled);
+                $button.prop("title", o.tooltip)
             });
             $controlWrapper.append($buttonGroup);