From f549174424ab330240ef498cd4b1a7e87b948135 Mon Sep 17 00:00:00 2001 From: jdescottes Date: Fri, 11 Oct 2013 00:04:40 +0200 Subject: [PATCH 01/10] Import panel: - added pskl.controller.settings.ImportController (empty atm) - moved SettingsController under settings namespace - move settings templates in a dedicated folder - created import icon (svg is in the resources folder) - added import button in right-layer --- css/settings.css | 6 +- css/tools.css | 9 +- img/import-icon.png | Bin 0 -> 720 bytes index.html | 5 +- js/app.js | 2 +- js/controller/settings/ImportController.js | 8 ++ .../{ => settings}/SettingsController.js | 26 +++-- piskel-script-list.js | 6 +- resources/import-icon.svg | 105 ++++++++++++++++++ templates/settings.html | 7 ++ .../application.html} | 0 .../export-gif.html} | 0 templates/settings/import.html | 16 +++ 13 files changed, 171 insertions(+), 19 deletions(-) create mode 100644 img/import-icon.png create mode 100644 js/controller/settings/ImportController.js rename js/controller/{ => settings}/SettingsController.js (81%) create mode 100644 resources/import-icon.svg rename templates/{settings-application.html => settings/application.html} (100%) rename templates/{settings-export-gif.html => settings/export-gif.html} (100%) create mode 100644 templates/settings/import.html diff --git a/css/settings.css b/css/settings.css index d872702a..d2dd2440 100644 --- a/css/settings.css +++ b/css/settings.css @@ -31,14 +31,14 @@ } .right-sticky-section.expanded .tool-icon { - margin-right: 1px; + padding-right: 1px; } .right-sticky-section .tool-icon.has-expanded-drawer { position: relative; background-color: #444; margin-right: 0; - padding-right: 1px; + padding-right: 2px; } .settings-section { @@ -81,7 +81,7 @@ top: -2px; right: -2px; bottom: -2px; - left: -2px; + left: -2px; } .background-picker:hover:after { diff --git a/css/tools.css b/css/tools.css index 3ee94ddf..664221a5 100644 --- a/css/tools.css +++ b/css/tools.css @@ -25,7 +25,7 @@ .tool-icon:hover { background-color: #444; -} +} /* * Tool icons: @@ -209,6 +209,13 @@ position: relative; } +.tool-icon.import-icon { + background-image: url(../img/import-icon.png); + background-position: 10px 5px; + background-size: 26px; + position: relative; +} + .upload-cloud-icon .label { position: absolute; left: 0; diff --git a/img/import-icon.png b/img/import-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..ed3106560c3b231fd6a325a97a1036469d0b9f34 GIT binary patch literal 720 zcmV;>0x$iEP)LoK~zYI?U&C>6;Tw&Kl3bk8CoFHBIws5ix4;MqM)4>wTPnD zZGwlGo1p(7TDELe&_ddTv~tt7pr95)A_f(uB^2nBRMO|C#mv)*H$UFkGg|nC3&XwV ze81cHlB_4JZSbP{*POhO;iLdM_jT*Ezn!k=+<> zl&PLA6zqxYR!eN$uZ5I!wE}hSwts#twgtBZ|9`=>&r>(>m@uFkum&8<;5h`0Mz%)w zcY(JJma%G4j#Y-8>Kk<}qq<~aM%^FdE7up&Qn~`11>WZ;sR1*k*+nabN&5rhnb28GX z1Zror%Yy|X-V8ngeI>$-Ta literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 50c1ddd6..d3b160cd 100644 --- a/index.html +++ b/index.html @@ -45,8 +45,9 @@
- - + + +
diff --git a/js/app.js b/js/app.js index 529e201b..76b5310e 100644 --- a/js/app.js +++ b/js/app.js @@ -33,7 +33,7 @@ this.layersListController = new pskl.controller.LayersListController(this.piskelController); this.layersListController.init(); - this.settingsController = new pskl.controller.SettingsController(this.piskelController); + this.settingsController = new pskl.controller.settings.SettingsController(this.piskelController); this.settingsController.init(); this.selectionManager = new pskl.selection.SelectionManager(this.piskelController); diff --git a/js/controller/settings/ImportController.js b/js/controller/settings/ImportController.js new file mode 100644 index 00000000..64bbb10d --- /dev/null +++ b/js/controller/settings/ImportController.js @@ -0,0 +1,8 @@ +(function () { + var ns = $.namespace('pskl.controller.settings'); + + ns.ImportController = function () {}; + + ns.ImportController.prototype.init = function () {}; + +})(); \ No newline at end of file diff --git a/js/controller/SettingsController.js b/js/controller/settings/SettingsController.js similarity index 81% rename from js/controller/SettingsController.js rename to js/controller/settings/SettingsController.js index 611eebf2..d56497c7 100644 --- a/js/controller/SettingsController.js +++ b/js/controller/settings/SettingsController.js @@ -1,14 +1,18 @@ (function () { - var ns = $.namespace("pskl.controller"); - + var ns = $.namespace("pskl.controller.settings"); + var settings = { - user : { - template : 'templates/settings-application.html', - controller : ns.settings.ApplicationSettingsController + 'user' : { + template : 'templates/settings/application.html', + controller : ns.ApplicationSettingsController }, - gif : { - template : 'templates/settings-export-gif.html', - controller : ns.settings.GifExportController + 'gif' : { + template : 'templates/settings/export-gif.html', + controller : ns.GifExportController + }, + 'import' : { + template : 'templates/settings/import.html', + controller : ns.ImportController } }; @@ -49,9 +53,9 @@ ns.SettingsController.prototype.loadSetting = function (setting) { this.drawerContainer.innerHTML = pskl.utils.Template.get(settings[setting].template); (new settings[setting].controller(this.piskelController)).init(); - + this.settingsContainer.addClass(EXP_DRAWER_CLS); - + $('.' + SEL_SETTING_CLS).removeClass(SEL_SETTING_CLS); $('[data-setting='+setting+']').addClass(SEL_SETTING_CLS); @@ -66,5 +70,5 @@ this.expanded = false; this.currentSetting = null; }; - + })(); \ No newline at end of file diff --git a/piskel-script-list.js b/piskel-script-list.js index a35ebdcf..83be2261 100644 --- a/piskel-script-list.js +++ b/piskel-script-list.js @@ -49,9 +49,13 @@ exports.scripts = [ "js/controller/ToolController.js", "js/controller/PaletteController.js", "js/controller/NotificationController.js", + + // Settings sub-controllers "js/controller/settings/ApplicationSettingsController.js", "js/controller/settings/GifExportController.js", - "js/controller/SettingsController.js", + "js/controller/settings/ImportController.js", + // Settings controller + "js/controller/settings/SettingsController.js", // Services "js/service/LocalStorageService.js", diff --git a/resources/import-icon.svg b/resources/import-icon.svg new file mode 100644 index 00000000..10a61e4c --- /dev/null +++ b/resources/import-icon.svg @@ -0,0 +1,105 @@ + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + diff --git a/templates/settings.html b/templates/settings.html index 75087895..af898973 100644 --- a/templates/settings.html +++ b/templates/settings.html @@ -25,6 +25,13 @@ GIF +
+
+
+
+ Import stuff +
+
+ +
+ +
+ +
+
+
\ No newline at end of file From a8b42a35da51d22881e40676d92f644ace4c23bf Mon Sep 17 00:00:00 2001 From: jdescottes Date: Wed, 16 Oct 2013 21:43:47 +0200 Subject: [PATCH 02/10] import template basic version --- templates/settings/import.html | 22 ++++++++++++++-------- 1 file changed, 14 insertions(+), 8 deletions(-) diff --git a/templates/settings/import.html b/templates/settings/import.html index d684d845..f63ef801 100644 --- a/templates/settings/import.html +++ b/templates/settings/import.html @@ -1,16 +1,22 @@
- Import stuff + Import Picture
-
- -
- +
+ + +
+
+ + +
+
\ No newline at end of file From 1156008213af5c3235f0ca379e59ad231ea7d52b Mon Sep 17 00:00:00 2001 From: jdescottes Date: Wed, 16 Oct 2013 23:14:41 +0200 Subject: [PATCH 03/10] Import from file --- js/controller/settings/ImportController.js | 84 +++++++++++++++++++++- js/utils/FileUtils.js | 13 ++++ js/utils/Template.js | 4 +- piskel-script-list.js | 1 + templates/settings/import.html | 4 +- 5 files changed, 100 insertions(+), 6 deletions(-) create mode 100644 js/utils/FileUtils.js diff --git a/js/controller/settings/ImportController.js b/js/controller/settings/ImportController.js index 64bbb10d..a0a4e8eb 100644 --- a/js/controller/settings/ImportController.js +++ b/js/controller/settings/ImportController.js @@ -1,8 +1,88 @@ (function () { var ns = $.namespace('pskl.controller.settings'); - ns.ImportController = function () {}; + ns.ImportController = function (piskelController) { + this.piskelController = piskelController; + }; - ns.ImportController.prototype.init = function () {}; + ns.ImportController.prototype.init = function () { + this.fileUploadInput = $("[name=file-upload-input]"); + + this.importForm = $("[name=import-form]"); + this.importForm.submit(this.onImportFormSubmit_.bind(this)); + }; + + ns.ImportController.prototype.onImportFormSubmit_ = function (evt) { + evt.originalEvent.preventDefault(); + var files = this.fileUploadInput.get(0).files; + if (files.length == 1) { + var file = files[0]; + if (this.isImage_(file)) { + this.readImageFile_(file); + } else { + throw "File is not an image : " + file.type; + } + } + }; + + ns.ImportController.prototype.readImageFile_ = function (imageFile) { + pskl.utils.FileUtils.readFile(imageFile, this.processImageData_.bind(this)); + }; + + ns.ImportController.prototype.processImageData_ = function (imageData) { + var image = new Image(); + image.onload = this.onImageLoaded_.bind(this); + image.src = imageData; + }; + + ns.ImportController.prototype.onImageLoaded_ = function (evt) { + var image = evt.target; + + var w = image.width, h = image.height; + var canvas = pskl.CanvasUtils.createCanvas(w, h); + var context = canvas.getContext('2d'); + + context.drawImage(image, 0,0,w,h,0,0,w,h); + var imgData = context.getImageData(0,0,w,h).data; + // Draw the zoomed-up pixels to a different canvas context + var framesheet = []; + for (var x=0;x
-
+
From 2509ba80a41737a9aa3467b09f90f9e0c3f888a3 Mon Sep 17 00:00:00 2001 From: jdescottes Date: Fri, 18 Oct 2013 08:01:25 +0200 Subject: [PATCH 04/10] intermediary --- js/app.js | 2 +- js/controller/settings/ImportController.js | 80 +++++++++++++++++++--- templates/settings.html | 23 ++++--- templates/settings/import.html | 6 +- 4 files changed, 89 insertions(+), 22 deletions(-) diff --git a/js/app.js b/js/app.js index efaa2c5d..3262db09 100644 --- a/js/app.js +++ b/js/app.js @@ -94,7 +94,7 @@ finishInitAppEngine_ : function () { if (pskl.framesheetData_ && pskl.framesheetData_.content) { var piskel = pskl.utils.Serializer.createPiskel(pskl.framesheetData_.content); - piskel.app.PiskelController.setPiskel(piskel); + pskl.app.piskelController.setPiskel(piskel); pskl.app.animationController.setFPS(pskl.framesheetData_.fps); } }, diff --git a/js/controller/settings/ImportController.js b/js/controller/settings/ImportController.js index a0a4e8eb..a12d2269 100644 --- a/js/controller/settings/ImportController.js +++ b/js/controller/settings/ImportController.js @@ -7,32 +7,94 @@ ns.ImportController.prototype.init = function () { this.fileUploadInput = $("[name=file-upload-input]"); - + this.urlInput = $("[name=url-input]"); this.importForm = $("[name=import-form]"); this.importForm.submit(this.onImportFormSubmit_.bind(this)); }; + ns.ImportController.prototype.reset_ = function () { + this.importForm.get(0).reset(); + }; + ns.ImportController.prototype.onImportFormSubmit_ = function (evt) { evt.originalEvent.preventDefault(); + var importType = this.getSelectedRadioValue_(); + if (importType === 'FILE') { + this.importFromFile_(); + } else if (importType === 'URL') { + this.importFromUrl_(); + } + }; + + ns.ImportController.prototype.getSelectedRadioValue_ = function () { + var radios = this.getRadios_(); + var selectedRadios = radios.filter(function(radio) { + return !!radio.checked; + }); + + if (selectedRadios.length == 1) { + return selectedRadios[0].value; + } else { + throw "Unexpected error when retrieving selected radio"; + } + }; + + ns.ImportController.prototype.importFromFile_ = function () { var files = this.fileUploadInput.get(0).files; if (files.length == 1) { var file = files[0]; if (this.isImage_(file)) { this.readImageFile_(file); } else { + this.reset_(); throw "File is not an image : " + file.type; } } }; - ns.ImportController.prototype.readImageFile_ = function (imageFile) { - pskl.utils.FileUtils.readFile(imageFile, this.processImageData_.bind(this)); + ns.ImportController.prototype.importFromUrl_ = function () { + var url = this.urlInput.get(0).value; + if (this.isUrl_(url)) { + this.processImageSource_(url); + } else { + this.reset_(); + throw "Not a url : " + url; + } }; - ns.ImportController.prototype.processImageData_ = function (imageData) { + /** + * TODO : implement it properly + * @param {String} url potential url to test + * @return {Boolean} true if url looks like a URL + */ + ns.ImportController.prototype.isUrl_ = function (url) { + if (typeof url === 'string') { + return (/^http/).test(url); + } else { + return false; + } + }; + + ns.ImportController.prototype.getRadios_ = function () { + var radiosColl = this.importForm.get(0).querySelectorAll("[name=upload-source-type]"), + radios = Array.prototype.slice.call(radiosColl,0); + return radios; + }; + + ns.ImportController.prototype.readImageFile_ = function (imageFile) { + pskl.utils.FileUtils.readFile(imageFile, this.processImageSource_.bind(this)); + }; + + /** + * Create an image from the given source (url or data-url), and onload forward to onImageLoaded + * TODO : should be a generic utility method, should take a callback + * @param {String} imageSource url or data-url, will be used as src for the image + */ + ns.ImportController.prototype.processImageSource_ = function (imageSource) { var image = new Image(); image.onload = this.onImageLoaded_.bind(this); - image.src = imageData; + image.crossOrigin = ''; + image.src = imageSource; }; ns.ImportController.prototype.onImageLoaded_ = function (evt) { @@ -66,10 +128,12 @@ "A new Piskel will be created from your picture, size : " + w + "x" + h; if (window.confirm(confirmationMessage)) { - console.log(framesheet); - } else { - console.log("ABORT ABORT"); + var piskel = pskl.utils.Serializer.createPiskel([framesheet]); + pskl.app.piskelController.setPiskel(piskel); + pskl.app.animationController.setFPS(12); } + + this.reset_(); }; ns.ImportController.prototype.rgbToHex_ = function (r, g, b) { diff --git a/templates/settings.html b/templates/settings.html index af898973..ed48a850 100644 --- a/templates/settings.html +++ b/templates/settings.html @@ -3,19 +3,29 @@ data-setting="user" class="tool-icon gear-icon" title="Preferences" - rel="tooltip" data-placement="left">
+ rel="tooltip" data-placement="left"> +
+ +
+
+ rel="tooltip" data-placement="left" target="_blank"> +
+ rel="tooltip" data-placement="left" > +
GIF
-
-
-
- +
- +
From 61419f0bbaea46cecbcd7d56602c81b6fe5ac1ec Mon Sep 17 00:00:00 2001 From: jdescottes Date: Mon, 21 Oct 2013 23:08:12 +0200 Subject: [PATCH 05/10] import panel : before removal of import from URL option --- js/controller/settings/ImportController.js | 1 - 1 file changed, 1 deletion(-) diff --git a/js/controller/settings/ImportController.js b/js/controller/settings/ImportController.js index a12d2269..d0b6fd06 100644 --- a/js/controller/settings/ImportController.js +++ b/js/controller/settings/ImportController.js @@ -93,7 +93,6 @@ ns.ImportController.prototype.processImageSource_ = function (imageSource) { var image = new Image(); image.onload = this.onImageLoaded_.bind(this); - image.crossOrigin = ''; image.src = imageSource; }; From 6c0f54032db29a9fc97af40ecc99cec35c9801c5 Mon Sep 17 00:00:00 2001 From: jdescottes Date: Tue, 22 Oct 2013 07:40:08 +0200 Subject: [PATCH 06/10] Import panel --- css/settings.css | 36 ++++++ css/style.css | 26 +--- index.html | 1 + js/controller/settings/ImportController.js | 138 +++++++++++---------- templates/layers-list.html | 8 +- templates/settings/import.html | 23 ++-- 6 files changed, 130 insertions(+), 102 deletions(-) diff --git a/css/settings.css b/css/settings.css index d2dd2440..3af8a57c 100644 --- a/css/settings.css +++ b/css/settings.css @@ -115,4 +115,40 @@ -moz-box-sizing:border-box; background: rgba(0,0,0,0.5); color: white; +} + +/* Import panel */ +.import-section { + margin: 15px 0; +} + +.import-resize-field { + width: 30px; + margin: 0px 8px; + text-align: right; +} + +.file-input-button { + margin: 0px 8px; + border-radius: 2px; +} + +.file-input-status { + font-style: italic; + font-weight: normal; + text-shadow : none; +} + +.import-button { + float: right; + padding : 8px 10px; + height: auto; + background: gold; + color: black; + text-shadow: 0px 1px 0 #fff; + border-radius: 2px; + font-size : 1.2rem; + border-color: rgb(179, 164, 0); + border-top-color: white; + border-bottom-color: rgb(151, 133, 0); } \ No newline at end of file diff --git a/css/style.css b/css/style.css index 1b810419..5b5eb220 100644 --- a/css/style.css +++ b/css/style.css @@ -246,35 +246,19 @@ body { } .layers-button { - height: 24px; margin: 0; width: 25%; float : left; - border: none; - box-sizing: border-box; - border-top: 1px solid #666; - border-right: 1px solid #333; - border-bottom: 1px solid #333; - background-color: #3f3f3f; - cursor: pointer; - color: white; - font-size: 0.7em; - font-weight: bold; - text-align: center; - text-decoration: none; - text-shadow: 0px -1px 0 #000; - transition: background-color 0.2s linear; +} + +/* @override */ +.button.layers-button { + border-left-width: 0; } .layers-button:last-child { border-right-width: 0; } - -.layers-button:hover { - text-decoration: none; - background-color: #484848; - color: gold; -} /** * User messages */ diff --git a/index.html b/index.html index d3b160cd..309d86f3 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,7 @@ + diff --git a/js/controller/settings/ImportController.js b/js/controller/settings/ImportController.js index d0b6fd06..c69ac924 100644 --- a/js/controller/settings/ImportController.js +++ b/js/controller/settings/ImportController.js @@ -1,46 +1,47 @@ (function () { var ns = $.namespace('pskl.controller.settings'); - + var DEFAULT_FILE_STATUS = 'No file selected ...'; ns.ImportController = function (piskelController) { this.piskelController = piskelController; + this.importedImage_ = null; }; ns.ImportController.prototype.init = function () { - this.fileUploadInput = $("[name=file-upload-input]"); - this.urlInput = $("[name=url-input]"); this.importForm = $("[name=import-form]"); + this.hiddenFileInput = $("[name=file-upload-input]"); + this.fileInputButton = $(".file-input-button"); + this.fileInputStatus=$(".file-input-status"); + this.fileInputStatus.html(DEFAULT_FILE_STATUS); + + this.resizeWidth = $("[name=resize-width]"); + this.resizeHeight = $("[name=resize-height]"); + this.importForm.submit(this.onImportFormSubmit_.bind(this)); + this.hiddenFileInput.change(this.onFileUploadChange_.bind(this)); + this.fileInputButton.click(this.onFileInputClick_.bind(this)); }; ns.ImportController.prototype.reset_ = function () { this.importForm.get(0).reset(); + this.fileInputStatus.html(DEFAULT_FILE_STATUS); + }; ns.ImportController.prototype.onImportFormSubmit_ = function (evt) { evt.originalEvent.preventDefault(); - var importType = this.getSelectedRadioValue_(); - if (importType === 'FILE') { - this.importFromFile_(); - } else if (importType === 'URL') { - this.importFromUrl_(); - } + this.importImageToPiskel_(); }; - ns.ImportController.prototype.getSelectedRadioValue_ = function () { - var radios = this.getRadios_(); - var selectedRadios = radios.filter(function(radio) { - return !!radio.checked; - }); + ns.ImportController.prototype.onFileUploadChange_ = function (evt) { + this.importFromFile_(); + }; - if (selectedRadios.length == 1) { - return selectedRadios[0].value; - } else { - throw "Unexpected error when retrieving selected radio"; - } + ns.ImportController.prototype.onFileInputClick_ = function (evt) { + this.hiddenFileInput.click(); }; ns.ImportController.prototype.importFromFile_ = function () { - var files = this.fileUploadInput.get(0).files; + var files = this.hiddenFileInput.get(0).files; if (files.length == 1) { var file = files[0]; if (this.isImage_(file)) { @@ -52,35 +53,6 @@ } }; - ns.ImportController.prototype.importFromUrl_ = function () { - var url = this.urlInput.get(0).value; - if (this.isUrl_(url)) { - this.processImageSource_(url); - } else { - this.reset_(); - throw "Not a url : " + url; - } - }; - - /** - * TODO : implement it properly - * @param {String} url potential url to test - * @return {Boolean} true if url looks like a URL - */ - ns.ImportController.prototype.isUrl_ = function (url) { - if (typeof url === 'string') { - return (/^http/).test(url); - } else { - return false; - } - }; - - ns.ImportController.prototype.getRadios_ = function () { - var radiosColl = this.importForm.get(0).querySelectorAll("[name=upload-source-type]"), - radios = Array.prototype.slice.call(radiosColl,0); - return radios; - }; - ns.ImportController.prototype.readImageFile_ = function (imageFile) { pskl.utils.FileUtils.readFile(imageFile, this.processImageSource_.bind(this)); }; @@ -91,24 +63,63 @@ * @param {String} imageSource url or data-url, will be used as src for the image */ ns.ImportController.prototype.processImageSource_ = function (imageSource) { - var image = new Image(); - image.onload = this.onImageLoaded_.bind(this); - image.src = imageSource; + this.importedImage_ = new Image(); + this.importedImage_.onload = this.onImageLoaded_.bind(this); + this.importedImage_.src = imageSource; }; ns.ImportController.prototype.onImageLoaded_ = function (evt) { - var image = evt.target; + var w = this.importedImage_.width, + h = this.importedImage_.height; + this.resizeWidth.val(w); + this.resizeHeight.val(h); - var w = image.width, h = image.height; + var filePath = this.hiddenFileInput.val(); + var fileName = this.extractFileNameFromPath_(filePath); + this.fileInputStatus.html(fileName); + }; + + ns.ImportController.prototype.extractFileNameFromPath_ = function (path) { + var parts = []; + if (path.indexOf('/') !== -1) { + parts = path.split('/'); + } else if (path.indexOf('\\') !== -1) { + parts = path.split('\\'); + } else { + parts = [path]; + } + return parts[parts.length-1]; + }; + + ns.ImportController.prototype.importImageToPiskel_ = function () { + if (this.importedImage_) { + var image = this.importedImage_; + var frames = this.createFramesFromImage(image); + var confirmationMessage = "You are about to erase your current Piskel. " + + "A new Piskel will be created from your picture, size : " + image.width + "x" + image.height; + + if (window.confirm(confirmationMessage)) { + var piskel = pskl.utils.Serializer.createPiskel([frames]); + pskl.app.piskelController.setPiskel(piskel); + pskl.app.animationController.setFPS(12); + } + + this.reset_(); + } + }; + + ns.ImportController.prototype.createFramesFromImage = function (image) { + var w = image.width, + h = image.height; var canvas = pskl.CanvasUtils.createCanvas(w, h); var context = canvas.getContext('2d'); context.drawImage(image, 0,0,w,h,0,0,w,h); var imgData = context.getImageData(0,0,w,h).data; // Draw the zoomed-up pixels to a different canvas context - var framesheet = []; + var frames = []; for (var x=0;x

Layers

- - - - + + + +
- + + -
+
\ No newline at end of file diff --git a/templates/settings/import.html b/templates/settings/import.html index 0201dd42..405cd092 100644 --- a/templates/settings/import.html +++ b/templates/settings/import.html @@ -6,22 +6,26 @@
File : - +
-
+
+ Preview : +
+
+
Size : x
-
+
Smooth resize : - +
- +
\ No newline at end of file From b2258a668d7137aa05a05731863a1e4771734140 Mon Sep 17 00:00:00 2001 From: jdescottes Date: Fri, 25 Oct 2013 00:31:45 +0200 Subject: [PATCH 09/10] import-picture-panel : IE10 CSS fix for input text with text-align:right --- css/style.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/css/style.css b/css/style.css index 5b5eb220..e865270d 100644 --- a/css/style.css +++ b/css/style.css @@ -1,4 +1,6 @@ - +::-ms-clear { + display: none; +} body { background: radial-gradient(circle, #000, #373737); From c332aa2dea1ce7bb2174dc5beee07cef21d161f9 Mon Sep 17 00:00:00 2001 From: jdescottes Date: Fri, 25 Oct 2013 00:32:42 +0200 Subject: [PATCH 10/10] import-picture-panel : IE10 CSS fix for input text with text-align:right --- css/style.css | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/css/style.css b/css/style.css index e865270d..841f5325 100644 --- a/css/style.css +++ b/css/style.css @@ -1,7 +1,3 @@ -::-ms-clear { - display: none; -} - body { background: radial-gradient(circle, #000, #373737); /* 16/06/2013 : -webkit still needed for @@ -10,6 +6,11 @@ body { background: -webkit-radial-gradient(circle, #000, #373737); } +/* Browser fixes */ +::-ms-clear { + display: none; +} + /** * Application layout */