bricks/bricks/button.js
2024-03-08 10:54:16 +08:00

93 lines
1.8 KiB
JavaScript

bricks.Button = class extends bricks.Layout {
/*
orientation:
height:100%,
width:100%,
item_rate:
tooltip:
color:
nonepack:
name:
icon:
label:
css:
action:{
target:
datawidget:
datamethod:
datascript:
dataparams:
rtdata:
actiontype:
...
}
*/
constructor(opts){
super(opts);
var style = {
display:"flex",
justifyContent:"center",
textAlign:"center",
alignItem:"center",
width:"auto",
height:"auto",
};
if (opts.nonepack){
style.padding = '0px';
style.border = '0';
} else {
style.padding = '0.5rem';
}
if (this.opts.orientation == 'horizontal'){
style.flexDirection = 'rows';
this.orient = 'h';
} else {
style.flexDirection = 'column';
this.orient = 'v';
}
this.item_rate = opts.item_rate || 1;
this.set_id(this.opts.name);
this.opts_setup();
bricks.extend(this.dom_element.style, style);
}
create(){
this.dom_element = document.createElement('button');
}
opts_setup(){
var item_size = this.opts.item_size || bricks.app.charsize;
if (this.opts.icon){
var icon = new bricks.Icon({
rate:this.item_rate,
url:this.opts.icon
})
this.add_widget(icon);
icon.bind('click', this.target_clicked.bind(this));
}
if (this.opts.label){
var opts = {
rate:this.item_rate,
color:this.opts.color,
bgcolor:this.opts.bgcolor,
otext:this.opts.label,
i18n:true};
var txt = new bricks.Text(opts);
this.add_widget(txt);
txt.bind('click', this.target_clicked.bind(this));
}
}
target_clicked(event){
bricks.debug('target_clicked() .... called ');
event.stopPropagation();
this.dispatch('click', this.opts);
if (this.opts.action){
if (this.opts.debug){
bricks.debug('debug:opts=', this.opts);
}
}
}
}
bricks.Factory.register('Button', bricks.Button);