Feature : add onion skin option

New option in application settings : onion skin.
You can choose the overlay to display now :
- no overlay
- onion skin (default)
- layer preview (previous default)

Available in Application Settings panel.

Only one overlay can be used at the same time.
The onion skin overlay is driven by a new OnionSkinRenderer maanged by the
drawing.

The drawing controller is responsible for instanciating and 'choosing' the
overlay renderer.

When switching to a new overlay, other overlays are cleared and flushed
(they cache their rendering frame, flush empties the cache).

NB : flush is only available on LayersRenderer and OnionSkinRenderer for
now.

src/js/controller/settings/ApplicationSettingsController.js

@@ -18,9 +18,9 @@
     $('#grid-width').val(gridWidth);
     $('#grid-width').change(this.onGridWidthChange.bind(this));
 
-    var tiledPreview = pskl.UserSettings.get(pskl.UserSettings.TILED_PREVIEW);
-    $('#tiled-preview').prop('checked', tiledPreview);
-    $('#tiled-preview').change(this.onTiledPreviewChange.bind(this));
+    var overlay = pskl.UserSettings.get(pskl.UserSettings.OVERLAY);
+    $('#overlay').val(overlay);
+    $('#overlay').change(this.onOverlayChange.bind(this));
 
     // Handle canvas background changes:
     $('#background-picker-wrapper').click(this.onBackgroundClick.bind(this));
@@ -31,9 +31,9 @@
     pskl.UserSettings.set(pskl.UserSettings.GRID_WIDTH, parseInt(width, 10));
   };
 
-  ns.ApplicationSettingsController.prototype.onTiledPreviewChange = function (evt) {
-    var checked = $('#tiled-preview').prop('checked');
-    pskl.UserSettings.set(pskl.UserSettings.TILED_PREVIEW, checked);
+  ns.ApplicationSettingsController.prototype.onOverlayChange = function (evt) {
+    var overlay = $('#overlay').val();
+    pskl.UserSettings.set(pskl.UserSettings.OVERLAY, overlay);
   };
 
   ns.ApplicationSettingsController.prototype.onBackgroundClick = function (evt) {