bugfix
This commit is contained in:
parent
76995ad1e0
commit
3b1ed752ed
@ -560,6 +560,34 @@ bricks.App = class extends bricks.Layout {
|
||||
this.bind('orient_changed', this.screen_orient);
|
||||
});
|
||||
}
|
||||
get_color(){
|
||||
return getComputedStyle(this.dom_element).color;
|
||||
return parseRGB(colorStr);
|
||||
}
|
||||
get_bgcolor(){
|
||||
return getComputedStyle(this.dom_element).backgroundColor;
|
||||
return parseRGB(colorStr);
|
||||
}
|
||||
|
||||
get_blinkcolor(){
|
||||
var color, bgcolor, blinkcolor;
|
||||
color = parseRGB(this.get_color());
|
||||
bgcolor = parseRGB(this.get_bgcolor());
|
||||
console.log('color=', color, 'bgcolor=', bgcolor);
|
||||
function short1of3(x, y){
|
||||
if (x < y) {
|
||||
return x + (y - x) / 3;
|
||||
} else {
|
||||
return x - (x - y) / 3;
|
||||
}
|
||||
}
|
||||
var r = short1of3(color.r, bgcolor.r);
|
||||
var g = short1of3(color.g, bgcolor.g);
|
||||
var b = short1of3(color.b, bgcolor.b);
|
||||
var bc = bricks.obj_fmtstr({r:r, g:g, b:b}, "rgb(${r}, ${g}, ${b})");
|
||||
console.log('color=', color, 'bgcolor=', bgcolor, 'bc=', bc);
|
||||
return bc;
|
||||
}
|
||||
async getCameras() {
|
||||
try {
|
||||
const devices = await navigator.mediaDevices.enumerateDevices();
|
||||
|
@ -3,6 +3,8 @@ body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
color: #8a8a8a;
|
||||
background-color: #fafafa;
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
}
|
||||
|
1
bricks/imgs/node-collapse.svg
Normal file
1
bricks/imgs/node-collapse.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg t="1748923025889" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="130072" width="100%" height="100%"><path d="M310.784 132.8c38.144 21.056 412.864 323.264 445.12 342.144 28.864 16.896 29.376 57.216 0 74.112-44.736 25.728-417.536 326.464-443.712 341.312-32.768 18.624-65.856-5.056-65.856-36.864 0-24.512 0-648.448 0-683.968C246.272 134.4 282.88 117.376 310.784 132.8z" p-id="130073" fill="${color}"></path></svg>
|
After Width: | Height: | Size: 461 B |
1
bricks/imgs/node-expand.svg
Normal file
1
bricks/imgs/node-expand.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg t="1748922878918" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="126615" width="100%" height="100%"><path d="M511.999488 819.413462 72.8374 204.586538 951.1626 204.586538Z" fill="${color}" p-id="126616"></path></svg>
|
After Width: | Height: | Size: 267 B |
@ -4,6 +4,7 @@ bricks.Svg = class extends bricks.VBox {
|
||||
options:{
|
||||
rate:
|
||||
url:
|
||||
blink:false
|
||||
color:*
|
||||
blinkcolor:*
|
||||
blinktime:*
|
||||
@ -11,11 +12,17 @@ bricks.Svg = class extends bricks.VBox {
|
||||
*/
|
||||
constructor(opts){
|
||||
opts.rate = opts.rate || 1;
|
||||
opts.cwidth = opts.cwidth || 1;
|
||||
opts.cheight = opts.cheight || 1;
|
||||
opts.cwidth = opts.rate;
|
||||
opts.cheight = opts.rate;
|
||||
opts.blinktime = opts.blinktime || 0.5;
|
||||
opts.dynsize = true;
|
||||
super(opts);
|
||||
if (! this.color) {
|
||||
this.color = bricks.app.get_color();
|
||||
}
|
||||
if (!this.blinkcolor){
|
||||
this.blinkcolor = bricks.app.get_blinkcolor()
|
||||
}
|
||||
if (opts.url){
|
||||
this.set_url(opts.url);
|
||||
}
|
||||
@ -26,7 +33,7 @@ bricks.Svg = class extends bricks.VBox {
|
||||
.then(svgText => {
|
||||
this.svgText = svgText;
|
||||
this.set_colored_svg(this.color);
|
||||
this.blink();
|
||||
if (this.blink) this.start_blink();
|
||||
});
|
||||
}
|
||||
set_ancent_color(e){
|
||||
@ -46,20 +53,20 @@ bricks.Svg = class extends bricks.VBox {
|
||||
var svgText = bricks.obj_fmtstr({color: color}, this.svgText);
|
||||
this.dom_element.innerHTML = svgText;
|
||||
}
|
||||
blink(){
|
||||
_blink(){
|
||||
if (this.blinktime && this.blinkcolor) {
|
||||
if (this.cur_color == this.color){
|
||||
this.set_colored_svg(this.blinkcolor);
|
||||
} else {
|
||||
this.set_colored_svg(this.color);
|
||||
}
|
||||
this.blink_task = schedule_once(this.blink.bind(this),
|
||||
this.blink_task = schedule_once(this._blink.bind(this),
|
||||
this.blinktime);
|
||||
}
|
||||
}
|
||||
start_blink(){
|
||||
if (!this.blink_task){
|
||||
blink();
|
||||
this._blink();
|
||||
}
|
||||
}
|
||||
end_blink(){
|
||||
@ -67,5 +74,27 @@ bricks.Svg = class extends bricks.VBox {
|
||||
}
|
||||
}
|
||||
|
||||
bricks.StatedSvg = class extends bricks.Svg {
|
||||
/* {
|
||||
states:[{state:aaa,url:} ,,],
|
||||
state:
|
||||
} */
|
||||
constructor(opts){
|
||||
super(opts);
|
||||
if (this.states){
|
||||
if (! this.state){
|
||||
this.state = this.states[0].state;
|
||||
}
|
||||
var url = this.set_state(this.state);
|
||||
this.set_url(url);
|
||||
}
|
||||
}
|
||||
set_state(state){
|
||||
this.states.forEach(s => {
|
||||
if (s.state == state) this.set_url(s.url);
|
||||
});
|
||||
}
|
||||
}
|
||||
bricks.Factory.register('Svg', bricks.Svg);
|
||||
bricks.Factory.register('StatedSvg', bricks.StatedSvg);
|
||||
|
||||
|
@ -12,8 +12,8 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
this.user_data = data;
|
||||
this.is_leaf = this.user_data.is_leaf;
|
||||
this.params = bricks.extend(this.tree.params, {id:this.user_data[this.tree.opts.idField]});
|
||||
if (this.tree.multitype_tree){
|
||||
this.params['type'] = this.user_data[this.tree.opts.typeField];
|
||||
if (this.tree.opts.typeField){
|
||||
this.params.type = this.user_data[this.tree.opts.typeField];
|
||||
}
|
||||
var n = new bricks.HBox({
|
||||
height:this.tree.row_height,
|
||||
@ -33,6 +33,7 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
}
|
||||
this.container.hide();
|
||||
}
|
||||
this.setup_icon_urls()
|
||||
}
|
||||
getValue(){
|
||||
var v = this.user_data;
|
||||
@ -63,7 +64,9 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
this.collapse()
|
||||
}
|
||||
}
|
||||
|
||||
async expand(){
|
||||
this.node_state = 'open';
|
||||
if (this.is_leaf){
|
||||
return;
|
||||
}
|
||||
@ -74,6 +77,7 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
this.container.show();
|
||||
}
|
||||
collapse(){
|
||||
this.node_state = 'close'
|
||||
if (this.is_leaf){
|
||||
return;
|
||||
}
|
||||
@ -86,13 +90,21 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
} else {
|
||||
var srcs = this.tree.opts.node_state_imgs || {};
|
||||
var sources = {};
|
||||
sources['open'] = objget(srcs, 'open', bricks_resource('imgs/down_arrow.png'));
|
||||
sources['close'] = objget(srcs, 'close', bricks_resource('imgs/right_arrow.png'));
|
||||
this.trigle = new bricks.MultipleStateIcon({
|
||||
sources['open'] = objget(srcs, 'open', bricks_resource('imgs/node-expand.svg'));
|
||||
sources['close'] = objget(srcs, 'close', bricks_resource('imgs/node-collapse.svg'));
|
||||
this.trigle = new bricks.StatedSvg({
|
||||
state:'close',
|
||||
urls:sources,
|
||||
height:img_size,
|
||||
width:img_size
|
||||
states:[
|
||||
{
|
||||
state: 'open',
|
||||
url: bricks_resource('imgs/node-expand.svg')
|
||||
},
|
||||
{
|
||||
state: 'close',
|
||||
url: bricks_resource('imgs/node-collapse.svg')
|
||||
}
|
||||
],
|
||||
rate: 1,
|
||||
});
|
||||
this.trigle.bind('state_changed', this.toggleExpandCollapse.bind(this));
|
||||
widget.add_widget(this.trigle);
|
||||
@ -103,15 +115,12 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
widget.add_widget(this.check_w);
|
||||
this.check_w.bind('changed', this.tree.node_checked.bind(this.tree, this))
|
||||
}
|
||||
var dtype = this.user_data[this.tree.opts.typeField];
|
||||
var icon = objget(TypeIcons, dtype);
|
||||
if (!icon && this.tree.opts.default_type){
|
||||
icon = objget(TypeIcons, his.tree.opts.default_type);
|
||||
}
|
||||
if (!icon){
|
||||
icon = bricks_resource('imgs/folder.png');
|
||||
}
|
||||
var img = new bricks.Icon({
|
||||
var icon_url = self.this.icons_urls.leaf;
|
||||
if (this.is_leaf) icon_url = this.icons_urls.leaf;
|
||||
else if this.node_state == 'expand') this.icon_url = this.icons_urls.open;
|
||||
else this.icon_url = this.icons_urls.close;
|
||||
var img = new bricks.Svg({
|
||||
rate:1,
|
||||
url:icon
|
||||
});
|
||||
widget.add_widget(img);
|
||||
@ -136,13 +145,34 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
}
|
||||
this.str_w.set_text(this.user_data[this.tree.opts.textField]);
|
||||
}
|
||||
setup_icon_urls(){
|
||||
|
||||
if (this.tree.opts.typeField){
|
||||
var ntype = this.user_data[this.opts.typeField];
|
||||
var icons = null;
|
||||
if (this.tree.node_state_icons){
|
||||
icons = this.tree.node_state_icons[ntype];
|
||||
var dt = this.tree.node_state_icons.default_type;
|
||||
if (dt){
|
||||
icon = this.tree.node_state_icons[dt];
|
||||
}
|
||||
}
|
||||
}
|
||||
if (! icons){
|
||||
icons = {
|
||||
open: bricks_resource('imgs/open_folders.svg'),
|
||||
close: bricks_resource('imgs/close_folder.svg'),
|
||||
leaf: bricks_resource('imgs/close_folder.svg')
|
||||
};
|
||||
}
|
||||
this.icons_urls = icons;
|
||||
}
|
||||
}
|
||||
|
||||
bricks.Tree = class extends bricks.VScrollPanel {
|
||||
/*
|
||||
{
|
||||
row_height:
|
||||
multitype_tree:false,
|
||||
idField:
|
||||
textField:
|
||||
type_icons:
|
||||
@ -150,9 +180,13 @@ bricks.Tree = class extends bricks.VScrollPanel {
|
||||
default_type:
|
||||
data:
|
||||
dataurl:
|
||||
node_state_imgs:{
|
||||
open:url,
|
||||
close:url
|
||||
node_state_icon:{
|
||||
nodetype:{
|
||||
open:url,
|
||||
close:url,
|
||||
leaf:url
|
||||
}
|
||||
default_type:
|
||||
},
|
||||
admin:{
|
||||
{
|
||||
|
@ -1,6 +1,20 @@
|
||||
var bricks = window.bricks || {};
|
||||
bricks.bug = false;
|
||||
|
||||
function parseRGB(colorStr) {
|
||||
const match = colorStr.match(/^rgb\s*\(\s*(\d+),\s*(\d+),\s*(\d+)\s*\)$/);
|
||||
if (!match) return null;
|
||||
const [, r, g, b] = match.map(Number);
|
||||
return { r, g, b };
|
||||
}
|
||||
|
||||
function parseRGBA(colorStr) {
|
||||
const match = colorStr.match(/^rgba?\s*\(\s*(\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\s*\)$/);
|
||||
if (!match) return null;
|
||||
const [, r, g, b, a] = match;
|
||||
return { r: +r, g: +g, b: +b, a: a !== undefined ? +a : 1 };
|
||||
}
|
||||
|
||||
async function streamResponseJson(response, onJson) {
|
||||
const reader = response.body.getReader();
|
||||
const decoder = new TextDecoder("utf-8");
|
||||
|
Loading…
Reference in New Issue
Block a user