use html5 color input

This commit is contained in:
Milan
2019-04-22 00:51:12 +02:00
parent aaa3f01a98
commit 667d6c715f

View File

@@ -6,61 +6,8 @@
selectedId = ($(this).attr('id'));
showColors();
});
//$("#content").append(getColor(8));
});
/*
function getColor(noOfColors) {
var html = "";
var frequency = 5 / noOfColors;
for (var i = 0; i < noOfColors;++i) {
r = Math.sin(frequency * i + 0) * (127) + 128;
g = Math.sin(frequency * i + 1) * (127) + 128;
b = Math.sin(frequency * i + 3) * (127) + 128;
li = '<li class="color" style="background-color:rgb({r},{g},{b});"> </li>';
li = li.replace("{r}", Math.floor(r));
li = li.replace("{g}", Math.floor(g));
li = li.replace("{b}", Math.floor(b));
html = html + li;
}
return html;
}
function showColors(){
var colors=['00','22','44','66','88','aa','cc','ee','ff'];
var content='';
for (var i in colors){
for (var j in colors){
var r=colors[i];
var g=colors[colors.length-j-1];
var b =Math.round((i-j))% colors.length;
if(b<0)b=Math.round((j-i))% colors.length;
b=colors[b]
var value='#'+r+g+b;
content+='<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
}
content+='<br style="clear:both">'
}
for (var i in colors){
var gray=colors[colors.length-i-1];
var value='#'+gray+gray+gray;
content+='<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
}
content+='<br style="clear:both">'
$("#colors").html(content);
$("#colors div.col").click(
function(){
var color=$(this).attr("value");
$('#'+selectedId).css('background',color);
$('#'+selectedId).attr('value',color);
}
);
}
*/
function showColors() {
var colors = [ '#ef9a9a', '#f48fb1', '#ce93d8', '#b39ddb', '#9fa8da',
'#90caf9', '#81d4fa', '#80deea', '#80cbc4', '#a5d6a7',
@@ -87,8 +34,8 @@
<style>
div.col {
float: left;
width: 10px;
height: 10px;
width: 2rem;
height: 2rem;
}
</style>
@@ -142,9 +89,12 @@ div.col {
<td><TMPL_VAR .loc.label_color>: <TMPL_VAR
title></td>
<td><input id="<TMPL_VAR name>"
style="background: &lt;TMPL_VAR value&gt;"
name="<TMPL_VAR name>" class="color"
value="<TMPL_VAR value>"></td>
style="padding:0;background: &lt;TMPL_VAR value&gt;"
name="<TMPL_VAR name>"
class="color"
value="<TMPL_VAR value>"
type="color"
></td>
</tr>
</TMPL_LOOP>
</table>
@@ -153,10 +103,11 @@ div.col {
</form>
<form method="post" style="margin-top: 2px;float:left">
<form method="post" style="margin-top: 2px; float: left">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="updateDefaultProjectStudio">
<input type="hidden" name="action"
value="updateDefaultProjectStudio">
<button onclick="$(this).submit()">
<TMPL_VAR loc.setDefaultProjectStudio>
</button>