This commit is contained in:
yumoqing 2024-11-26 22:45:20 +08:00
parent dc4f4e86c1
commit 28c940c0cf
2 changed files with 70 additions and 2 deletions

View File

@ -53,7 +53,34 @@ bricks.Popup = class extends bricks.VBox {
this.set_css('toppopup');
bricks.app.toppopup = this;
}
popup_from_widget(from_w){
var myrect = this.showRectage();
var rect = from_w.showRectage();
var x,y;
var ox, oy;
ox = (rect.right - rect.left) / 2 + rect.left;
oy = (rect.bottom - rect.top) / 2 + rect.top;
if (ox < bricks.app.screenWidth() / 2) {
x = rect.right + 3;
if (x + (myrect.right - myrect.left) > bricks.app.screenWidth()){
x = bricks.app.screenWidth() - (myrect.right - myrect.left);
}
} else {
x = rect.left - (myrect.right - myrect.left) - 3
if (x < 0) x = 0;
}
if (oy < bricks.app.screenHeight() / 2){
y = rect.bottom + 3;
if (y + (myrect.bottom - myrect.top) > bricks.app.screenHeight()){
y = bricks.app.screenHeight() - (myrect.bottom - myrect.top);
}
} else {
y = rect.bottom - (myrect.bottom - myrect.top) - 3
if (y < 0) y = 0;
}
this.set_style('top', y + 'px');
this.set_style('left', x + 'px');
}
setup_resizable(){
this.resizable_w = new bricks.Icon({rate:1.5, url:bricks_resource('imgs/right-bottom-triangle.png')});
super.add_widget(this.resizable_w);
@ -230,6 +257,12 @@ bricks.Popup = class extends bricks.VBox {
// console.log('auto_open is ', this.auto_open, ' so not auto open it', this.opts, w);
}
}
remove_widget(w){
this.content_box.remove_widget(w);
}
clear_widgets(){
this.content_box.clear_widgets();
}
open(){
var rect, w, h;
if (this.opened) {
@ -261,6 +294,7 @@ bricks.Popup = class extends bricks.VBox {
this.content_box.disabled(false);
}
dismiss(){
if (! this.opened) return;
if (this.opts.modal){
this.target_w.disabled(false);
}

View File

@ -15,6 +15,13 @@ bricks.resize_observer = new ResizeObserver(entries => {
});
bricks.JsWidget = class {
/*
popup:{
popup_event:
popup_desc:
popupwindow:false or true
}
*/
constructor(options){
if (!options){
options = {}
@ -38,9 +45,36 @@ bricks.JsWidget = class {
var w = bricks.app.tooltip;
this.bind('mousemove', w.show.bind(w, this.opts.tip));
this.bind('mouseout', w.hide.bind(w));
this.bind('click', w.hide.bind(w));
}
if (this.popup){
this.bind(this.popup.popup_event, this.popup_action.bind(this));
}
bricks.resize_observer.observe(this.dom_element);
}
destroy_popup(){
this.popup_widget.destroy();
this.popup_widget = null;
}
async popup_action(){
if (this.popup_widget){
this.popup_widget.destroy();
this.popup_widget = null;
} else {
if (this.popup.popupwindow){
this.popup_widget = new bricks.PopupWindow(this.popup.optiosn);
} else {
this.popup_widget = new bricks.Popup(this.popup.options);
}
this.popup_widget.bind('dismissed', this.destroy_popup.bind(this));
var w = await bricks.widgetBuild(this.popup.popup_desc, this, this.user_data);
if (w){
this.popup_widget.add_widget(w);
this.popup_widget.open();
this.popup_widget.popup_from_widget(this);
}
}
}
showRectage(){
return this.dom_element.getBoundingClientRect();
}
@ -500,7 +534,7 @@ bricks.Tooltip = class extends bricks.Text {
if (this.auto_task){
this.auto_task.cancel();
}
this.auto_task = schedule_once(this.hide.bind(this), 30);
this.auto_task = schedule_once(this.hide.bind(this), 6);
}
hide(){
if (this.auto_task){