integrate @lukevers improvements and clean up js a bit
parent
bd2034c47b
commit
ef821c3e7e
|
@ -30,7 +30,7 @@
|
|||
display: flex;
|
||||
}
|
||||
.canvas-container {
|
||||
border: 5px solid black;
|
||||
border: 1px solid black;
|
||||
margin: auto;
|
||||
background: white;
|
||||
}
|
||||
|
@ -40,10 +40,9 @@
|
|||
}
|
||||
#colors {
|
||||
z-index: 100;
|
||||
border: 3px solid black;
|
||||
padding: 5px;
|
||||
vertical-align: top;
|
||||
background: white;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.selected {
|
||||
margin-left: 20px;
|
||||
|
@ -61,13 +60,13 @@
|
|||
width: 4vw;
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
border: 2px solid black;
|
||||
border: 1px solid black;
|
||||
vertical-align: top;
|
||||
}
|
||||
#controls {
|
||||
display: block;
|
||||
position: relative;
|
||||
border: 3px solid black;
|
||||
border-top: 1px solid black;
|
||||
background: white;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
|
@ -86,6 +85,9 @@
|
|||
height: 0;
|
||||
z-index: -5;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -226,6 +226,7 @@ define([
|
|||
};
|
||||
|
||||
var addColorToPalette = function (color, i) {
|
||||
if (readOnly) { return; }
|
||||
var $color = $('<span>', {
|
||||
'class': 'palette-color',
|
||||
})
|
||||
|
@ -236,7 +237,6 @@ define([
|
|||
var c = rgb2hex($color.css('background-color'));
|
||||
setColor(c);
|
||||
})
|
||||
// FIXME double click doesn't seem to work in chromium currently
|
||||
.on('dblclick', function (e) {
|
||||
e.preventDefault();
|
||||
pickColor(rgb2hex($color.css('background-color')), function (c) {
|
||||
|
@ -247,17 +247,14 @@ define([
|
|||
config.onLocal();
|
||||
setColor(c);
|
||||
});
|
||||
// TODO commit chosen color to pad metadata:
|
||||
// json.metadata.palette[i]
|
||||
});
|
||||
|
||||
$colors.append($color);
|
||||
};
|
||||
palette.forEach(addColorToPalette);
|
||||
|
||||
var updatePalette = function (newPalette) {
|
||||
palette = newPalette;
|
||||
$colors.html(' ');
|
||||
$colors.html('<div class="hidden"> </div>');
|
||||
palette.forEach(addColorToPalette);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue