--- a/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Mon May 15 14:44:14 2017 +0200
+++ b/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Tue May 16 11:29:33 2017 +0200
@@ -59,6 +59,7 @@
                 </defs>
             </svg>
         </div>
+        <div class="overlay" v-show="showOverlay"></div>
         <div class="controls" v-show="loaded">
             <div class="controls-left">
                 <button
@@ -107,7 +108,7 @@
                     v-bind:imageWidth="imageWidth"
                     v-bind:imageHeight="imageHeight"></zoom-thumbnail>
             </div>
-            <div class="controls-right" data-intro="Zoomez dans l'image" data-position="top">
+            <div class="controls-zoom" data-intro="Zoomez dans l'image" data-position="top">
                 <button @click="zoomOut" type="button" class="btn"
                     v-bind:class="{ disabled: scale === 1 }">
                     <i class="fa fa-minus" aria-hidden="true"></i>
@@ -117,6 +118,12 @@
                     <i class="fa fa-plus" aria-hidden="true"></i>
                 </button>
             </div>
+            <div class="controls-right">
+                <button @click="addAnnotationWithoutFragment" type="button" class="btn"
+                    title="Annoter toute l'image" data-intro="Annoter toute l'image" data-position="top">
+                    <i class="fa fa-plus-square" aria-hidden="true"></i>
+                </button>
+            </div>
         </div>
         <div class="help">
             <a href="#" class="btn btn-default" v-on:click.stop.prevent="showOnboarding"><i class="fa fa-question-circle"></i></a>
@@ -208,6 +215,9 @@
                 }
 
                 return normalizedAnnotations;
+            },
+            showOverlay: function() {
+                return this.annotation && !this.annotation.annotation_guid
             }
         },
         watch: {
@@ -633,7 +643,11 @@
                     Cookies.set('__iconolab_onboarding', 'true', { expires: 365 });
                 })
                 intro.start()
-            }
+            },
+
+            addAnnotationWithoutFragment: function() {
+                this.$emit('add:annotation')
+            },
         }
     }
 
@@ -698,10 +712,14 @@
         border-radius: 4px;
         padding: 8px;
     }
-    .controls .controls-right {
+    .controls .controls-zoom {
         border-top-right-radius: 4px;
         border-bottom-right-radius: 4px;
     }
+    .controls .controls-right {
+        margin-left: 5px;
+        border-radius: 4px;
+    }
 
 .help {
     position: absolute;
@@ -709,4 +727,14 @@
     right: 10px;
 }
 
+.overlay {
+    position: absolute;
+    background-color: #c5f2ff;
+    opacity: 0.25;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+}
+
 </style>