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 00000000..ed310656
Binary files /dev/null and b/img/import-icon.png differ
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 @@
+
+
+
+
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
+
+
+
\ No newline at end of file