2016-08-13 20:05:01 +02:00
|
|
|
<div class="container-fluid">
|
2016-09-03 15:54:33 +02:00
|
|
|
<div class="row">
|
|
|
|
<div class="col-lg-12">
|
|
|
|
<h1 class="page-header" lang="en" data-lang-token="main_menu_colors_token">Colors</h1>
|
2016-08-13 20:05:01 +02:00
|
|
|
<div class="col-lg-1">
|
2016-08-16 00:20:31 +02:00
|
|
|
<span lang="en" data-lang-token="remote_colors_label_color">Set color: </span>
|
2016-08-13 20:05:01 +02:00
|
|
|
</div>
|
|
|
|
<div class="col-lg-3">
|
|
|
|
<div id="cp2" class="input-group colorpicker-component">
|
|
|
|
<input type="text" value="#00AABB" class="form-control" />
|
|
|
|
<span class="input-group-addon"><i></i></span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="col-lg-8">
|
2016-08-16 00:20:31 +02:00
|
|
|
<button lang="en" data-lang-token="remote_colors_button_reset" type="button" class="btn btn-warning" id="reset_color">Reset Color</button>
|
2016-08-13 20:05:01 +02:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
$(function() {
|
|
|
|
$('#cp2').colorpicker({
|
|
|
|
format: 'rgb',
|
2016-08-15 13:51:41 +02:00
|
|
|
|
2016-09-03 15:54:33 +02:00
|
|
|
colorSelectors: {
|
|
|
|
'default': '#777777',
|
2016-08-13 22:01:07 +02:00
|
|
|
'primary': '#337ab7',
|
|
|
|
'success': '#5cb85c',
|
2016-09-03 15:54:33 +02:00
|
|
|
'info' : '#5bc0de',
|
2016-08-13 22:01:07 +02:00
|
|
|
'warning': '#f0ad4e',
|
2016-09-03 15:54:33 +02:00
|
|
|
'danger' : '#d9534f'
|
2016-08-13 22:01:07 +02:00
|
|
|
},
|
|
|
|
customClass: 'colorpicker-2x',
|
|
|
|
sliders: {
|
|
|
|
saturation: {
|
|
|
|
maxLeft: 200,
|
|
|
|
maxTop: 200
|
|
|
|
},
|
|
|
|
hue: {
|
|
|
|
maxTop: 200
|
|
|
|
},
|
|
|
|
alpha: {
|
|
|
|
maxTop: 200
|
2016-08-15 13:51:41 +02:00
|
|
|
},
|
|
|
|
}
|
2016-08-13 20:05:01 +02:00
|
|
|
});
|
2016-08-15 13:51:41 +02:00
|
|
|
|
2016-08-13 20:05:01 +02:00
|
|
|
$('#cp2').colorpicker().on('changeColor', function(e) {
|
2016-09-03 15:54:33 +02:00
|
|
|
color = e.color.toRGB();
|
|
|
|
requestSetColor(color.r, color.g, color.b);
|
2016-08-13 20:05:01 +02:00
|
|
|
});
|
|
|
|
});
|
2016-08-15 13:51:41 +02:00
|
|
|
|
2016-09-03 15:54:33 +02:00
|
|
|
$("#reset_color").on("click", requestPriorityClear);
|
2016-08-15 13:51:41 +02:00
|
|
|
</script>
|