This commit is contained in:
yumoqing 2024-03-03 21:07:57 +08:00
parent a93a350e74
commit 8bb5c667b4
11 changed files with 105 additions and 182 deletions

View File

@ -96,7 +96,7 @@ bricks.widgetBuild = async function(desc, widget){
if (desc.id){
w.set_id(desc.id);
}
if (w.hasSubwidgets && desc.subwidgets){
if (w.is_container() && desc.subwidgets){
for (let i=0; i<desc.subwidgets.length; i++){
let sdesc = desc.subwidgets[i];
let sw = await (bricks.widgetBuild(sdesc, w));
@ -396,12 +396,14 @@ bricks.App = class extends bricks.Layout {
bricks.Body = this;
this.login_url = opts.login_url;
this.charsize = this.opts.charsize || 20;
this.char_size = this.observable('charsize', this.charsize);
if (this.opts.language){
this.lang = this.opts.language;
}
else {
this.lang = navigator.language;
}
this.lang_x = this.observable('lang', this.lang);
this.textList = [];
this.i18n = new bricks.I18n(objget(opts, 'i18n', {}));
this.session_id = null;
@ -417,31 +419,6 @@ bricks.App = class extends bricks.Layout {
get_session(){
return this.session_id;
}
get_textsize(ctype){
var tsize = this.charsize;
var stimes = {
"text":1.0,
"title1":1.96,
"title2":1.80,
"title3":1.64,
"title4":1.48,
"title5":1.32,
"title6":1.16
}
tsize = parseInt(stimes[ctype] * tsize);
return tsize + 'px';
}
text_ref(textWidget){
this.textList.push(new WeakRef(textWidget));
}
text_remove_dead(){
var tList = this.textList;
for (var i=0;i<tList.length;i++){
if (! tList[i].deref()){
this.textList.remove(tList[i]);
}
}
}
async setup_i18n(){
let params = {'lang':this.lang};
var jcall = bricks.jcall;
@ -469,11 +446,11 @@ bricks.App = class extends bricks.Layout {
}
textsize_bigger(){
this.charsize = this.charsize * 1.05;
this.text_resize();
this.char_size.set(this.charsize);
}
textsize_smaller(){
this.charsize = this.charsize * 0.95;
this.text_resize();
this.char_size.set(this.charsize);
}
text_resize = function(){
for (var i=0;i<this.textList.length;i++){
@ -487,13 +464,6 @@ bricks.App = class extends bricks.Layout {
change_language = async function(lang){
this.lang = lang;
await (this.i18n.change_lang(lang));
for (var i=0;i<this.textList.length;i++){
if(this.textList[i].deref()){
var w = this.textList[i].deref();
if (w.opts.i18n) {
w.set_i18n_text();
}
}
}
this.lang_x.set(this.lang);
}
}

View File

View File

@ -1 +0,0 @@
}

View File

@ -1,51 +0,0 @@
var bricks = window.bricks || {};
bricks.DataGridAccordion = class extends bricks.VBox {
/*
options:{
data_url:
title:
description:
footer:
header:
record:
detail_url:
}
*/
constructor(opts):
super(opts);
if (self.opts.title){
var t = new bricks.Title3(
otext=self.opts.title,
i18n=true
);
this.add_widget(t);
}
if (self.opts.description){
var d = new bricks.Text(
otext=self.opts.description,
i18n=true,
wrap=true,
halign='left'
);
this.add_widget(d);
}
if (this.opts.header){
var h = await bricks.widgetBuild(this.opts.header, this);
if (h){
this.add_widgettype(h);
}
}
var filler = new bricks.Filler();
var this.accordion = await this.buildAccordion();
filler.add_widget(this.accordion)
this.add_widget(filler);
if (this.opts.footer){
var f = await bricks.widgetBuild(this.opts.footer, this);
this.add_widget(f);
}
}
async buildAccordion(){
var p = bricks.VScrollPanel();
}
}

View File

@ -42,25 +42,10 @@ bricks.Icon = class oops extends bricks.Image {
opts.height = siz;
super(opts);
this.rate = rate;
this.ctype = 'text';
this.sizable();
this.set_fontsize();
}
change_fontsize(ts){
var siz = bricks.app.charsize * this.rate + 'px';
this.set_width(siz);
this.set_height(siz);
}
set_fontsize(){
var siz = bricks.app.charsize * this.rate + 'px';
this.set_width(siz);
this.set_height(siz);
}
set_width(siz){
this.dom_element.width = siz;
}
set_height(siz){
this.dom_element.height = siz;
this.cwidth = this.opts.cwidth || 1;
this.cheight = this.opts.cheight || 1;
this.dynsize = this.opts.dynsize || true;
this.charsize_sizing();
}
}
@ -68,27 +53,10 @@ bricks.BlankIcon = class oops extends bricks.JsWidget {
constructor(opts){
super(opts);
this.rate = opts.rate || 1;
this.ctype = 'text';
this.sizable();
this.set_fontsize();
}
change_fontsize(ts){
var siz = bricks.app.charsize * this.rate + 'px';
this.set_width(siz);
this.set_height(siz);
}
set_fontsize(){
var siz = bricks.app.charsize * this.rate + 'px';
this.set_width(siz);
this.set_height(siz);
}
set_width(siz){
this.dom_element.width = siz;
this.dom_element.style.width = siz;
}
set_height(siz){
this.dom_element.height = siz;
this.dom_element.style.height = siz;
this.cwidth = this.opts.cwidth || 1;
this.cheight = this.opts.cheight || 1;
this.dynsize = this.opts.dynsize || true;
this.charsize_sizing();
}
}

View File

@ -57,8 +57,9 @@ bricks.UiStr =class extends bricks.UiType {
*/
constructor(opts){
super(opts);
this.sizable();
this.set_fontsize();
this.rate = this.opts.rate || 1;
this.dynsize = this.opts.dynsize || true;
this.cfontsize = this.opts.cfontsize || 1;
if (opts.readonly) {
this.set_readonly("Y");
} else {
@ -67,6 +68,7 @@ bricks.UiStr =class extends bricks.UiType {
if (opts.width){
this.dom_element.style.width = opts.width;
}
this.charsize_sizing();
}
create(){
@ -364,7 +366,6 @@ bricks.UiCheckBox =class extends bricks.UiType {
if (! Array.isArray(this.value)){
this.value = [ this.value ];
}
this.set_fontsize();
this.el_legend = this._create('legend');
var label = this.opts.label||this.opts.name;
this.el_legend.innerText = bricks.app.i18n._(label);
@ -374,6 +375,9 @@ bricks.UiCheckBox =class extends bricks.UiType {
this.data = opts.data;
this.build_checkboxs();
}
this.sizable_elements = [];
this.sizable_elements.push(this.el_legend);
this.charsize_sizing();
}
create(){
this.dom_element = this._create('fieldset');
@ -480,10 +484,11 @@ bricks.UiText =class extends bricks.UiType {
}
*/
constructor(opts){
opts.dynsize = opts.dynsize || true;
opts.cfontsize = opts.cfontsize || 1;
super(opts);
this.build();
this.sizable();
this.set_fontsize();
this.charsize_sizing();
}
create(){
this.dom_element = this._create('textarea');
@ -493,7 +498,6 @@ bricks.UiText =class extends bricks.UiType {
e.id = e.name = this.opts.name;
e.rows = this.opts.rows || 5;
e.cols = this.opts.cols || 40;
// this.setValue(this.opts.value || this.opts.defaultvalue || '');
this.reset();
this.bind('input', this.set_value_from_input.bind(this))
}
@ -537,6 +541,8 @@ bricks.UiCode =class extends bricks.UiType {
*/
static uitype='code';
constructor(opts){
opts.cfontsize = opts.cfontsize||1;
opts.dynsize = opts.dynsize || true;
super(opts);
this.data = this.opts.data;
this.build();
@ -590,8 +596,7 @@ bricks.UiCode =class extends bricks.UiType {
this.sizable_elements.push(o);
}
this.bind('input', this.set_value_from_input.bind(this))
this.sizable();
this.set_fontsize();
this.charsize_sizing();
}
set_value_from_input(event){
this.value = this.dom_element.value;

View File

@ -2,7 +2,6 @@ var bricks = window.bricks || {};
bricks.Layout = class extends bricks.JsWidget {
constructor(options){
super(options);
this.hasSubwidgets = true;
this._container = true;
this.children = [];
}

View File

@ -322,3 +322,20 @@ bricks.widgetBuildWithData = async function(desc_tmpl, from_widget, data){
w.row_data = data;
return w;
}
bricks.Observable = class {
constructor(owner, name, v){
this.owner = owner;
this.name = name;
this.value = v;
}
set(v){
if (this.value != v){
this.owner.dispatch(this.name, v);
}
this.value = v;
}
get(){
return this.v;
}
}

View File

@ -5,7 +5,6 @@ bricks.JsWidget = class {
if (!options){
options = {}
}
this.hasSubwidgets = false;
this.baseURI = options.baseURI;
this.opts = options;
this.create();
@ -25,7 +24,13 @@ bricks.JsWidget = class {
}
}
create(){
this.dom_element = document.createElement('div');
this.dom_element = this._create('div')
}
_create(tagname){
return document.createElement(tagname);
}
observable(name, value){
return new bricks.Observable(this, name, value);
}
disabled(flag){
if(flag){
@ -37,6 +42,7 @@ bricks.JsWidget = class {
opts_set_style(){
var keys = [
"width",
"dynsize",
"x",
"y",
"height",
@ -48,7 +54,7 @@ bricks.JsWidget = class {
"overflowX",
"overflow",
"color"
]
];
var mapping_keys = {
"z-index":"zIndex",
"overflow-x":"overflowX",
@ -68,43 +74,40 @@ bricks.JsWidget = class {
}
this[okeys[k]] = this.opts[okeys[k]];
}
if (this.opts.cwidth){
this.width = bricks.app.charsize * this.opts.cwidth;
style.width = this.width;
}
if (this.opts.cheight){
this.height = bricks.app.charsize * this.opts.cheight;
style.height = this.height;
}
if (this.opts.dynsize){
bricks.app.bind('charsize', this.charsize_sizing.bind(this))
}
bricks.extend(this.dom_element.style, style);
if (this.opts.css){
this.set_css(this.opts.css);
}
}
sizable(){
bricks.app.text_ref(this);
charsize_sizing(){
var cs = bricks.app.charsize;
var r = this.rate || 1;
if (this.cwidth){
this.set_style('width', this.cwidth * cs * r + 'px');
}
change_fontsize(ts){
ts = convert2int(ts);
if (! this.specified_fontsize){
var rate = this.rate || 1;
ts = ts * rate;
ts = ts + 'px';
this.dom_element.style.fontSize = ts;
if (this.cheight){
this.set_style('height', this.cheight * cs * r + 'px');
}
if (this.cfontsize){
this.dom_element.style.fontSize = this.cfontsize * cs * r + 'px';
if (this.sizable_elements){
for (var i=0;i<this.sizable_elements.length;i++){
this.sizable_elements[i].style.fontSize = ts;
var e = this.sizable_elements[i];
e.style.fontSize = this.cfontsize * cs * r + 'px';
}
}
}
set_fontsize(){
var fontsize;
if (this.opts.fontsize){
this.specified_fontsize = true;
fontsize = this.opts.fontsize;
} else {
fontsize = bricks.app.get_textsize(this.ctype);
}
fontsize = convert2int(fontsize);
var rate = this.rate || 1;
fontsize = rate * fontsize;
fontsize = fontsize + 'px';
this.dom_element.style.fontSize = fontsize;
for(var i=0;i<this.sizable_elements.length;i++){
this.sizable_elements[i].style.fontSize = fontsize;
}
}
h_center(){
this.dom_element.style.marginLeft = 'auto';
@ -161,10 +164,8 @@ bricks.JsWidget = class {
is_container(){
return this._container;
}
_create(tagname){
return document.createElement(tagname);
}
set_id(id){
this.id = id;
this.dom_element.id = id;
}
set_baseURI(url){
@ -222,7 +223,9 @@ bricks.TextBase = class extends bricks.JsWidget {
this.specified_fontsize = false;
this.set_attrs();
this.dom_element.style.fontWeight = 'normal';
this.sizable();
if (self.i18n){
bricks.app.bind('lang', this.set_i18n_text.bind(this));
}
}
set_attrs(){
if (this.opts.hasOwnProperty('text')){
@ -259,8 +262,8 @@ bricks.TextBase = class extends bricks.JsWidget {
bricks.Text = class extends bricks.TextBase {
constructor(opts){
super(opts);
this.ctype = 'text';
this.set_fontsize();
this.cfontsize = 1;
this.charsize_sizing();
}
}
@ -268,8 +271,9 @@ bricks.Title1 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title1';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.96;
this.charsize_sizing();
}
}
@ -277,8 +281,9 @@ bricks.Title2 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title2';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.80;
this.charsize_sizing();
}
}
@ -286,8 +291,9 @@ bricks.Title3 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title3';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.64;
this.charsize_sizing();
}
}
@ -295,8 +301,9 @@ bricks.Title4 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title4';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.48;
this.charsize_sizing();
}
}
@ -304,8 +311,9 @@ bricks.Title5 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title5';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.32;
this.charsize_sizing();
}
}
@ -313,8 +321,9 @@ bricks.Title6 = class extends bricks.TextBase {
constructor(options){
super(options);
this.ctype = 'title6';
this.set_fontsize();
this.dom_element.style.fontWeight = 'bold';
this.cfontsize = 1.16;
this.charsize_sizing();
}
}

View File

@ -8,6 +8,7 @@
"widgettype":"Title1",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -15,6 +16,7 @@
"widgettype":"Title2",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -22,6 +24,7 @@
"widgettype":"Title3",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -29,6 +32,7 @@
"widgettype":"Title4",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -36,6 +40,7 @@
"widgettype":"Title5",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -43,6 +48,7 @@
"widgettype":"Title6",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},
@ -50,6 +56,7 @@
"widgettype":"Text",
"options":{
"text":"Pic Viewer",
"dynsize":true,
"i18n":true
}
},