Hooked up presets preview to open in modal

platforms/common/application/styles/index.js

@@ -1,6 +1,7 @@
 "use strict";
 var ready = require('elements/domready'),
     $ = require('elements/attributes'),
+    modal = require('../ui').modal,
     contains = require('mout/array/contains'),
     forEach = require('mout/collection/forEach');
 
@@ -14,7 +15,10 @@ ready(function() {
     var body = $('body');
 
     body.delegate('click', '[data-g-styles]', function(event, element) {
+        var target = $(event.target);
         if (event && event.preventDefault) { event.preventDefault(); }
+        if (target.hasClass('swatch-preview') || target.parent('.swatch-preview')) { return true; }
+        ;
         var data = JSON.parse(element.data('g-styles')), input, value, type, evt;
         forEach(data, function(preset, name) {
             input = $('[name="' + name + '"]');
@@ -35,6 +39,22 @@ ready(function() {
         });
     });
 
+    body.delegate('click', '[data-g-styles] .swatch-preview', function(event, element) {
+        var image = element.parent('[data-g-styles]').find('img');
+        if (!image) { return false; }
+
+        modal.open({
+            content: image[0].outerHTML,
+            afterOpen: function(container) {
+                var padding = parseInt(container.compute('padding-left'), 10) + parseInt(container.compute('padding-right'), 10);
+                container.style({
+                    maxWidth: '80%',
+                    width: padding + (image[0].naturalWidth || image[0].width)
+                });
+            }
+        });
+    });
+
 });
 
 module.exports = {};