mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Design attempt

Browse Source
This commit is contained in:
jdescottes 2013-11-27 23:43:59 +01:00
parent 42862e188d
commit 75dc1c5944
5 changed files with 17 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
css/spectrum/spectrum-overrides.css
View File

@ -18,18 +18,11 @@
/* Remove the padding on the input container */
.sp-replacer {
padding: 3px;
height: 50%;
height: 100%;
border-width: 0;
box-sizing: border-box;
background-color: #888;
}
.sp-replacer:first-of-type {
padding-bottom: 0px;
}
.sp-replacer:not(:first-of-type) {
padding-top: 0px;
}
/* Hide the triangle */
.sp-dd {
display: none;

3
css/tools.css
View File

@ -149,6 +149,9 @@
margin-left: 0;
}
.palette-wrapper {
margin-top: 10px;
}
.palette-color[data-color=TRANSPARENT] {
position: relative;

9
js/controller/PaletteController.js
View File

@ -36,10 +36,13 @@
var colorPicker = $('#color-picker');
colorPicker.spectrum($.extend({color: Constants.DEFAULT_PEN_COLOR}, spectrumCfg));
colorPicker.change({isPrimary : true}, $.proxy(this.onPickerChange_, this));
this.setTitleOnPicker_(Constants.DEFAULT_PEN_COLOR, colorPicker);
var secondaryColorPicker = $('#secondary-color-picker');
secondaryColorPicker.spectrum($.extend({color: Constants.TRANSPARENT_COLOR}, spectrumCfg));
secondaryColorPicker.change({isPrimary : false}, $.proxy(this.onPickerChange_, this));
this.setTitleOnPicker_(Constants.TRANSPARENT_COLOR, secondaryColorPicker);
};
/**
@ -128,6 +131,12 @@
} else {
colorPicker.spectrum("set", color);
}
this.setTitleOnPicker_(color, colorPicker);
};
ns.PaletteController.prototype.setTitleOnPicker_ = function (title, colorPicker) {
var spectrumInputSelector = '.sp-replacer';
colorPicker.next(spectrumInputSelector).attr('title', title);
};
})();

4
js/lib/spectrum/spectrum.js
View File

@ -524,8 +524,8 @@
function onMousedown (e) {
var target = $(e.target);
var parents = target.parents();
var isClickOutsideWidget = !parents.is(container) && !target.is(container);
var parents = target.closest();
var isClickOutsideWidget = !parents.is(container);
if (isClickOutsideWidget) {
hide(e);

7
templates/drawing-tools.html
View File

@ -5,13 +5,10 @@
<div class="palette-wrapper">
<div class="tool-icon tool-color-picker">
<input id="color-picker" class="color" type="text"/>
</div>
<div class="tool-icon tool-color-picker">
<input id="secondary-color-picker" class="secondary-color-picker color" type="text" />
</div>
<div class="tool-icon tool-palette">
<div>
<span class="tool-icon palette-color" data-color="TRANSPARENT" title="Transparent"></span>
</div>
</div>
</div>
</div>
</div>