bugfix

bricks/accordion.js

@@ -32,12 +32,12 @@ bricks.Accordion = class oops extends bricks.VBox {
 				height:'auto',
 				orientation:'horizontal'
 			}
-			var b = new Button(opts);
+			var b = new bricks.Button(opts);
 			b.bind('click', this.change_content.bind(this));
 			this.items.push(b);
 			this.add_widget(b);
 		}
-		this.content = new VBox({});
+		this.content = new bricks.VBox({});
 	}
 	async change_content(evnet){
 		var b = event.target.bricks_widget;

bricks/audio.js

@@ -59,7 +59,7 @@ bricks.AudioRecorder = class oops extends bricks.HBox {
 		this.start_icon = opts.start_icon || bricks_resource('imgs/start_recording.png');
 		this.stop_icon = opts.stop_icon || bricks_resource('imgs/stop_recording.png');
 		this.rec_btn = new bricks.Icon({url:this.start_icon });
-		this.player = new bricks.AudioPlayer({url:"",width:'40px'});
+		this.player = new bricks.AudioPlayer({url:"",width:'80px'});
 		this.rec_time = new bricks.Text({text:"", i18n:false, width:'120px'});
 		this.rec_btn.bind('click', this.rec_btn_pressed.bind(this))
 		this.URL = window.URL||webkitURL;
@@ -88,8 +88,8 @@ bricks.AudioRecorder = class oops extends bricks.HBox {
 		// document.querySelector(".recpowerx").style.width=powerLevel+"%";
 		//可视化图形绘制
 		// wave.input(buffers[buffers.length-1],powerLevel,bufferSampleRate);
-		this.rec_time.otext = formatMs(bufferDuration,1);
+		this.rec_time.text = formatMs(bufferDuration,1);
-		console.log(this.rec_time.otext);
+		console.log(this.rec_time.text);
 		
 	}
 	recOpen(){

bricks/bricks.js

@@ -80,6 +80,7 @@ bricks.widgetBuild = async function(desc, widget){
 		base_url = url;
 		let method = desc.options.method || 'GET';
 		let opts = desc.options.params || {};
+		var jcall = bricks.jcall;
 		desc = await jcall(url, { "method":method, "params":opts});
 	} else {
 		base_url = widget.baseURI;
@@ -375,7 +376,7 @@ bricks.App = class {
 			this.lang = navigator.language;
 		}
 		this.textList = [];
-		this.i18n = new I18n(objget(opts, 'i18n', {}));
+		this.i18n = new bricks.I18n(objget(opts, 'i18n', {}));
 		this.session_id = null;
 		bricks.createTooltip();
 	}
@@ -412,6 +413,7 @@ bricks.App = class {
 	}
 	async setup_i18n(){
 		let params = {'lang':this.lang};
+		var jcall = bricks.jcall;
 		d = await jcall(desc.url, {
 					"method":desc.method||'GET', params:params});
 		this.i18n.setup_dict(d);

bricks/button.js

@@ -58,7 +58,7 @@ bricks.Button = class extends bricks.Layout {
 	opts_setup(){
 		var item_size = this.opts.item_size || bricks.app.charsize;
 		if (this.opts.icon){
-			var icon = new Icon({
+			var icon = new bricks.Icon({
 				rate:this.item_rate,
 				url:this.opts.icon
 			})
@@ -72,7 +72,7 @@ bricks.Button = class extends bricks.Layout {
 						bgcolor:this.opts.bgcolor,
 						otext:this.opts.label, 
 						i18n:true};
-			var txt = new Text(opts);
+			var txt = new bricks.Text(opts);
 			this.add_widget(txt);
 			txt.bind('click', this.target_clicked.bind(this));
 		}

bricks/datagrid.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.Row = class {
 	constructor(dg, rec) {
 		this.dg = dg;
@@ -37,10 +37,10 @@ bricks.Row = class {
 				opts.action = f.action;
 				opts.action.params = objcopy(this.data);
 				opts.action.params.row = this;
-				w = new Button(opts);
+				w = new bricks.Button(opts);
 				w.bind('click', this.button_click.bind(w))
 			} else {
-				w = viewFactory(opts, this.data);
+				w = bricks.viewFactory(opts, this.data);
 				w.bind('click', this.click_handler);
 			}
 			w.desc_dic = opts;
@@ -51,7 +51,7 @@ bricks.Row = class {
 			this.name_widgets[f.name] = w;
 		}
 		if (cols.length > 0) {
-			var row = new HBox({ height: 'auto' })
+			var row = new bricks.HBox({ height: 'auto' })
 			for (var i = 0; i < cols.length; i++) {
 				row.add_widget(cols[i]);
 			}
@@ -138,39 +138,39 @@ bricks.DataGrid = class extends bricks.VBox {
 		this.header_css = opts.header_css || 'grid_header';
 		this.body_css = opts.body_css || 'grid_body';
 		if (this.title) {
-			this.title_bar = new HBox({ height: 'auto' });
+			this.title_bar = new bricks.HBox({ height: 'auto' });
 			this.add_widget(this.title_bar);
-			var tw = new Title1({ otext: this.title, i18n: true });
+			var tw = new bricks.Title1({ otext: this.title, i18n: true });
 			this.title_bar.add_widget(tw);
 		}
 		if (this.description) {
-			this.descbar = new HBox({ height: 'auto' });
+			this.descbar = new bricks.HBox({ height: 'auto' });
 			this.add_widget(this.descbar);
-			var dw = new Text({ otext: this.description, i18n: true });
+			var dw = new bricks.Text({ otext: this.description, i18n: true });
 			this.descbar.add_widget(dw);
 		}
 		
 		if (this.opts.miniform || this.opts.toolbar){
-			this.admin_bar = new HBox({height:'auto'});
+			this.admin_bar = new bricks.HBox({height:'auto'});
 		}
 		if (this.opts.miniform){
-			this.miniform = new MiniForm(this.opts.miniform);
+			this.miniform = new bricks.MiniForm(this.opts.miniform);
 			this.miniform.bind('input', this.miniform_input.bind(this));
 			this.admin_bar.add_widget(this.miniform);
 		}
 		if (this.opts.toolbar) {
-			this.admin_bar.add_widget(new HFiller({}));
+			this.admin_bar.add_widget(new bricks.HFiller({}));
-			self.toolbar = new Toolbar(this.opts.toolbar);
+			self.toolbar = new bricks.Toolbar(this.opts.toolbar);
 			self.toolbar.bind('command', this.command_handle.bind(this));
 			this.admin_bar.add_widget(this.toolbar);
 		}
 		this.create_parts();
 		if (this.show_info) {
-			this.infow = new HBox({ height: '40px' });
+			this.infow = new bricks.HBox({ height: '40px' });
 			this.add_widget(this.infow);
 		}
 		if (this.dataurl) {
-			this.loader = new BufferedDataLoader(this, {
+			this.loader = new bricks.BufferedDataLoader(this, {
 				pagerows: 80,
 				buffer_pages: 5,
 				url: absurl(this.dataurl, this),
@@ -258,7 +258,7 @@ bricks.DataGrid = class extends bricks.VBox {
 	create_parts() {
 		this.freeze_width = 0;
 		this.normal_width = 0;
-		var hbox = new HBox({});
+		var hbox = new bricks.HBox({});
 		hbox.set_css('datagrid-grid');
 		this.add_widget(hbox);
 		this.freeze_fields = [];
@@ -285,25 +285,25 @@ bricks.DataGrid = class extends bricks.VBox {
 		this.normal_part = null;
 		console.log('width=', this.freeze_width, '-', this.normal_width, '...');
 		if (this.freeze_fields.length > 0) {
-			this.freeze_part = new VBox({});
+			this.freeze_part = new bricks.VBox({});
 			this.freeze_part.set_css('datagrid-left');
 			this.freeze_part.set_style('width', this.freeze_width + 'px');
-			this.freeze_header = new HBox({ height: this.row_height + 'px', width: this.freeze_width + 'px'});
+			this.freeze_header = new bricks.HBox({ height: this.row_height + 'px', width: this.freeze_width + 'px'});
-			this.freeze_body = new VScrollPanel({ height: "100%", 
+			this.freeze_body = new bricks.VScrollPanel({ height: "100%", 
 									width: this.freeze_width + 'px' })
 			this.freeze_body.set_css('datagrid-body');
 			this.freeze_body.bind('scroll', this.coscroll.bind(this));
 		}
 		if (this.normal_fields.length > 0) {
-			this.normal_part = new VBox({ 
+			this.normal_part = new bricks.VBox({ 
 				width: this.normal_width + 'px',
 				height:'100%',
 				csses:"hscroll"
 			});
 			this.normal_part.set_css('datagrid-right');
-			this.normal_header = new HBox({ height: this.row_height + 'px', width: this.normal_width + 'px'});
+			this.normal_header = new bricks.HBox({ height: this.row_height + 'px', width: this.normal_width + 'px'});
 			// this.normal_header.set_css('datagrid-row');
-			this.normal_body = new VScrollPanel({ 
+			this.normal_body = new bricks.VScrollPanel({ 
 				height:"100%",
 				width: this.normal_width + 'px' 
 			});
@@ -344,7 +344,7 @@ bricks.DataGrid = class extends bricks.VBox {
 	create_header() {
 		for (var i = 0; i < this.freeze_fields.length; i++) {
 			var f = this.freeze_fields[i];
-			var t = new Text({
+			var t = new bricks.Text({
 				otext: f.label || f.name,
 				i18n: true,
 			});
@@ -358,7 +358,7 @@ bricks.DataGrid = class extends bricks.VBox {
 		}
 		for (var i = 0; i < this.normal_fields.length; i++) {
 			var f = this.normal_fields[i];
-			var t = new Text({
+			var t = new bricks.Text({
 				otext: f.label || f.name,
 				i18n: true,
 			});

bricks/dataviewer.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 
 bricks.DataViewer = class extends bricks.VScrollPanel {
 	/*
@@ -14,7 +14,7 @@ bricks.DataViewer = class extends bricks.VScrollPanel {
 	constructor(opts){
 		opts.width = '100%';
 		super(opts);
-		this.loader = new BufferedDataLoader(this, {
+		this.loader = new bricks.BufferedDataLoader(this, {
 				pagerows: opts.pagerows || 80,
 				buffer_pages: opts.buffer_pages || 5,
 				url: opts.dataurl,

bricks/factory.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 class Factory_ {
 	constructor(){
 		this.widgets_kv = new Object();

bricks/form.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 
 bricks.FormBody = class extends bricks.VBox {
 	/*
@@ -23,20 +23,20 @@ bricks.FormBody = class extends bricks.VBox {
 		super(opts);
 		this.name_inputs = {};
 		if (this.opts.title){
-			var t = new Title2({
+			var t = new bricks.Title2({
 					otext:this.opts.title,
 					height:'auto',
 					i18n:true});
 			this.add_widget(t);
 		}
 		if (this.opts.description){
-			var d = new Text({
+			var d = new bricks.Text({
 					otext:this.opts.description,
 					height:'auto',
 					i18n:true});
 			this.add_widget(d);
 		}
-		this.form_body = new Layout({width:'100%',
+		this.form_body = new bricks.Layout({width:'100%',
 							overflow:'auto' 
 							});
 		this.add_widget(this.form_body);
@@ -73,6 +73,7 @@ bricks.FormBody = class extends bricks.VBox {
 	async validation(){
 		var data = this.getValue();
 		if (this.submit_url){
+			var jcall = bricks.jcall;
 			var rzt = await jcall(this.submit_url,
 						{
 							params:data
@@ -84,10 +85,10 @@ bricks.FormBody = class extends bricks.VBox {
 	build_fields(){
 		var fields = this.opts.fields;
 		for (var i=0; i<fields.length; i++){
-			var box = new VBox({height:'auto',overflow:'none'});
+			var box = new bricks.VBox({height:'auto',overflow:'none'});
 			box.set_css('inputbox');
 			this.form_body.add_widget(box);
-			var txt = new Text({
+			var txt = new bricks.Text({
 					otext:fields[i].label||fields[i].name, 
 					height:'auto',
 					i18n:true});
@@ -118,13 +119,13 @@ bricks.Form = class extends bricks.VBox {
 	*/
 	constructor(opts){
 		super(opts);
-		this.body = new FormBody(opts);
+		this.body = new bricks.FormBody(opts);
 		this.add_widget(this.body);
 		if (! opts.notoolbar)
 			this.build_toolbar(this);
 	}
 	build_toolbar(widget){
-		var box = new HBox({height:'auto', width:'100%'});
+		var box = new bricks.HBox({height:'auto', width:'100%'});
 		widget.add_widget(box);
 		var tb_desc = this.opts.toolbar || {
 			width:"auto",
@@ -141,11 +142,11 @@ bricks.Form = class extends bricks.VBox {
 				}
 			]
 		};
-		var tbw = new Toolbar(tb_desc);
+		var tbw = new bricks.Toolbar(tb_desc);
 		tbw.bind('command', this.command_handle.bind(this));
-		box.add_widget(new HFiller());
+		box.add_widget(new bricks.HFiller());
 		box.add_widget(tbw);
-		box.add_widget(new HFiller());
+		box.add_widget(new bricks.HFiller());
 	}
 	command_handle(event){
 		var params = event.params;

bricks/i18n.js

@@ -1,4 +1,6 @@
-class I18n {
+var bricks = window.bricks || {};
+
+bricks.I18n = class {
 	constructor(url, default_lang){
 		/*
 		{
@@ -40,6 +42,7 @@ class I18n {
 		if (! this.url) return;
 
 		let params = {'lang':lang};
+		var jcall = bricks.jcall;
 		d = await jcall(desc.url, {
 					"method":this.method || 'GET', 
 					params:params

bricks/input.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.UiType =class extends bricks.Layout {
 	constructor(opts){
 		super(opts);
@@ -285,7 +285,7 @@ bricks.UiCheck =class extends bricks.UiType {
 		if (opts.value){
 			state = 'checked';
 		}
-		this.ms_icon = new MultipleStateIcon({
+		this.ms_icon = new bricks.MultipleStateIcon({
 			state:state,
 			urls:{
 				checked:bricks_resource('imgs/checkbox-checked.png'),
@@ -369,15 +369,15 @@ bricks.UiCheckBox =class extends bricks.UiType {
 		var data = this.data;
 		this.input_boxs = [];
 		for (var i=0; i<data.length;i++){
-			var hbox = new HBox({height:"auto",width:"100%"});
+			var hbox = new bricks.HBox({height:"auto",width:"100%"});
 			var opts = {}
 			var value = data[i][this.valueField];
 			if (this.value == value){
 				opts.value = true;
 			}
-			var check = new UiCheck(opts);
+			var check = new bricks.UiCheck(opts);
 			var otext = data[i][this.textField];
-			var txt = new Text({
+			var txt = new bricks.Text({
 				otext:otext,
 				align:'left',
 				i18n:true});
@@ -390,6 +390,7 @@ bricks.UiCheckBox =class extends bricks.UiType {
 		}
 	}
 	async load_data_onfly(){
+		var jcall = bricks.jcall;
 		var data = await jcall(this.opts.dataurl, {
 					"method":this.opts.method||'GET',
 					"params":this.opts.params});
@@ -541,6 +542,7 @@ bricks.UiCode =class extends bricks.UiType {
 		if(event){
 			extend(params, event.params);
 		}
+		var jcall = bricks.jcall;
 		var d = await jcall(this.opts.dataurl,
 			{
 				method:this.opts.method || 'GET',
@@ -627,11 +629,11 @@ bricks.UiAudio =class extends bricks.UiStr {
 		super(opts);
 		this.autoplay = opts.autoplay;
 		this.readonly = opts.readonly;
-		this.icon = new Icon({
+		this.icon = new bricks.Icon({
 			url: bricks_resource('imgs/right_arrow.png')});
 		this.add_widget(this.icon);
 		this.icon.bind('click', this.play_audio.bind(this));
-		this.player = new Audio({
+		this.player = new bricks.Audio({
 			url:this.value
 			});
 		if (this.autoplay){
@@ -662,11 +664,11 @@ bricks.UiVideo =class extends bricks.UiStr {
 		super(opts);
 		this.autoplay = opts.autoplay;
 		this.readonly = opts.readonly;
-		this.icon = new Icon({
+		this.icon = new bricks.Icon({
 			url: bricks_resource('imgs/right_arrow.png')});
 		this.add_widget(this.icon);
 		this.icon.bind('click', this.play_audio.bind(this));
-		this.player = new VideoPlayer({
+		this.player = new bricks.VideoPlayer({
 			url:this.value
 			});
 		if (this.autoplay){

bricks/jsoncall.js

@@ -1,7 +1,8 @@
+var bricks = window.bricks || {};
 function url_params(data) {
   return Object.keys(data).map(key => `${key}=${encodeURIComponent(data[key])}`).join('&');
 }
-class HttpText {
+bricks.HttpText = class {
 	constructor(headers){
 		/*
 		var _headers = {
@@ -170,7 +171,7 @@ class HttpText {
 	}
 }
 
-class HttpJson extends HttpText {
+bricks.HttpJson = class extends bricks.HttpText {
 	constructor(headers){
 		if (!headers)
 			headers = {};
@@ -185,11 +186,11 @@ class HttpJson extends HttpText {
 	}
 }
 
-var hc = new HttpText();
+bricks.hc = new bricks.HttpText();
-var tget = hc.get.bind(hc);
+bricks.tget = bricks.hc.get.bind(bricks.hc);
-var tpost = hc.post.bind(hc);
+bricks.tpost = bricks.hc.post.bind(bricks.hc);
-jc = new HttpJson();
+bricks.jc = new bricks.HttpJson();
-var jcall = jc.httpcall.bind(jc);
+bricks.jcall = bricks.jc.httpcall.bind(bricks.jc);
-var jget = jc.get.bind(jc);
+bricks.jget = bricks.jc.get.bind(bricks.jc);
-var jpost = jc.post.bind(jc);
+bricks.jpost = bricks.jc.post.bind(bricks.jc);
 

bricks/markdown_viewer.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 /* 
 reply on "https://github.com/markedjs/marked"
 add following lines before 'bricks.js'
@@ -29,7 +29,7 @@ bricks.MdText = class extends bricks.JsWidget {
 		this._build(this.opts.md_url);
 	}
 	_build = async function(md_url){
-		var md_content = await tget(md_url);
+		var md_content = await (bricks.tget(md_url));
 		this.dom_element.innerHTML = marked.parse(md_content);
 		
 		/* change links in markdown to a bricks action */
@@ -59,7 +59,7 @@ bricks.MarkdownViewer = class extends bricks.VBox {
 		if (this.opts.navigator){
 			this.createBackButton();
 		}
-		this.mdtext = new MdText({
+		this.mdtext = new bricks.MdText({
 			md_url:this.md_url
 		});
 		this.add_widget(this.mdtext);
@@ -112,7 +112,7 @@ bricks.MarkdownViewer = class extends bricks.VBox {
 		this._build(this.opts.md_url);
 	}
 	_build = async function(md_url){
-		var md_content = await tget(md_url);
+		var md_content = await (bricks.tget(md_url));
 		this.md_el.innerHTML = marked.parse(md_content);
 		// this.md_el.baseURI = md_url;
 		

bricks/menu.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 /*
 */
 bricks.Menu = class extends bricks.VBox {

bricks/message.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.BPopup = class extends bricks.VBox {
 	/* 
 	{
@@ -23,11 +23,11 @@ bricks.BPopup = class extends bricks.VBox {
 	}
 
 	build(){
-		var tb = new HBox({height:'40px'});
+		var tb = new bricks.HBox({height:'40px'});
 		tb.set_css('title');
 		VBox.prototype.add_widget.bind(this)(tb);
-		var tit = new Text({otext:this.title, i18n:true});
+		var tit = new bricks.Text({otext:this.title, i18n:true});
-		this.content = new VBox({});
+		this.content = new bricks.VBox({});
 		VBox.prototype.add_widget.bind(this)(this.content);
 		tb.add_widget(tit);
 		this.holder = Body;
@@ -74,7 +74,7 @@ bricks.BMessage = class extends bricks.BPopup {
 	*/
 	constructor(opts){
 		super(opts);
-		var t = new Text({otext:this.opts.message,
+		var t = new bricks.Text({otext:this.opts.message,
 					i18n:true});
 		this.add_widget(t);
 	}
@@ -96,7 +96,7 @@ bricks.PopupForm = class extends bricks.BPopup {
 	*/
 	constructor(options){
 		super(options);
-		this.form = new Form(this.opts.form);
+		this.form = new bricks.Form(this.opts.form);
 		this.add_widget(this.form);
 		this.form.bind('submit', this.close_popup.bind(this));
 		this.form.bind('discard', this.close_popup.bind(this));

bricks/miniform.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.MiniForm = class extends bricks.HBox {
 	/*
 	{

bricks/modal.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.Modal = class extends bricks.Layout {
 	constructor(options){
 		/*
@@ -19,7 +19,7 @@ bricks.Modal = class extends bricks.Layout {
 		this.set_width('100%');
 		this.set_height('100%');
 		this.ancestor_add_widget = Layout.prototype.add_widget.bind(this);
-		this.panel = new VBox({});
+		this.panel = new bricks.VBox({});
 		this.ancestor_add_widget(this.panel);
 		this.panel.set_width(this.opts.width);
 		this.panel.dom_element.style.backgroundColor = this.opts.bgcolor|| '#e8e8e8';
@@ -27,15 +27,15 @@ bricks.Modal = class extends bricks.Layout {
 		this.panel.set_css('modal');
 		archorize(this.panel.dom_element, objget(this.opts, 'archor', 'cc'));
 		this.create_title();
-		this.content = new VBox({width:'100%'});
+		this.content = new bricks.VBox({width:'100%'});
 		this.panel.add_widget(this.content);
 	}
 	create_title(){
-		this.title_box = new HBox({width:'100%', height:'auto'});
+		this.title_box = new bricks.HBox({width:'100%', height:'auto'});
 		this.title_box.set_css('title');
 		this.panel.add_widget(this.title_box);
-		this.title = new HBox({height:'100%'});
+		this.title = new bricks.HBox({height:'100%'});
-		var icon = new Icon({url:bricks_resource('imgs/delete.png')});
+		var icon = new bricks.Icon({url:bricks_resource('imgs/delete.png')});
 		icon.bind('click', this.dismiss.bind(this));
 		this.title_box.add_widget(this.title);
 		this.title_box.add_widget(icon);
@@ -113,7 +113,7 @@ bricks.ModalForm = class extends bricks.Modal {
 			submit_url:this.opts.submit_url,
 			fields:this.opts.fields
 		}
-		this.form = new Form(opts);
+		this.form = new bricks.Form(opts);
 		this.form.bind('submit', this.dismiss.bind(this));
 	}
 }

bricks/multiple_state_image.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.MultipleStateImage = class extends bricks.Layout {
 	/* 
 	{
@@ -20,7 +20,7 @@ bricks.MultipleStateImage = class extends bricks.Layout {
 			width:this.opts.width,
 			height:this.opts.height
 		}
-		this.img = new Image(desc);
+		this.img = new bricks.Image(desc);
 		this.add_widget(this.img);
 		this.img.bind('click', this.change_state.bind(this));
 	}

bricks/paging.js

@@ -1,4 +1,5 @@
-class BufferedDataLoader {
+var bricks = window.bricks || {};
+bricks.BufferedDataLoader = class {
 	/*
 	{
 		url:
@@ -54,6 +55,7 @@ class BufferedDataLoader {
 		var params = objcopy(this.cur_params);
 		params.page = this.cur_page;
 		params.rows = this.pagerows;
+		var jcall = bricks.jcall;
 		var d = await jcall(this.url, {
 					method:this.method,
 					params:params});

bricks/scroll.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 
 var low_handle = function(widget, dim, last_pos, cur_pos, maxlen, winsize){
 	var dir = cur_pos - last_pos;

bricks/tab.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.TabPanel = class extends bricks.Layout {
 	/*
 	options
@@ -30,16 +30,16 @@ bricks.TabPanel = class extends bricks.Layout {
 		super(options);
 		this.content_buffer = {};
 		this.cur_tab_name = '';
-		this.content_container = new VFiller({});
+		this.content_container = new bricks.VFiller({});
 		if (this.opts.tab_pos == 'top' ||  this.opts.tab_pos == 'bottom'){
 			this.set_css('vbox');
 			var height = this.opts.tab_wide || 'auto';
-			this.tab_container = new VBox({height:height});
+			this.tab_container = new bricks.VBox({height:height});
 			this.tab_container.dom_element.style.width = this.opts.tab_long || '100%';
 		} else {
 			this.set_css('hbox');
 			var width= this.opts.tab_wide || 'auto';
-			this.tab_container = new VBox({width:width});
+			this.tab_container = new bricks.VBox({width:width});
 			this.tab_container.dom_element.style.height = this.opts.tab_long || '100%';
 		}
 		if (this.opts.tab_pos == 'top' || this.opts.tab_pos == 'left'){
@@ -70,7 +70,7 @@ bricks.TabPanel = class extends bricks.Layout {
 			orient = 'vertical';
 		}
 		desc.orientation = orient;
-		this.toolbar = new Toolbar(desc);
+		this.toolbar = new bricks.Toolbar(desc);
 		this.toolbar.bind('command', this.show_tabcontent.bind(this));
 		this.toolbar.bind('remove', this.tab_removed.bind(this));
 		this.toolbar.bind('ready', this.show_first_tab.bind(this));

bricks/toolbar.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.Toolbar = class extends bricks.Layout {
 	/* toolbar options
 	{
@@ -26,10 +26,10 @@ bricks.Toolbar = class extends bricks.Layout {
 		super(options);
 		this.toolList = [];
 		if (this.opts.orientation == 'vertical'){
-			this.bar = new VBox(options);
+			this.bar = new bricks.VBox(options);
 			this.dom_element.classList.add('vtoolbar')
 		} else {
-			this.bar = new HBox(options);
+			this.bar = new bricks.HBox(options);
 			this.dom_element.classList.add('htoolbar')
 		}
 		this.add_widget(this.bar);
@@ -39,11 +39,11 @@ bricks.Toolbar = class extends bricks.Layout {
 	}
 	add_interval_box(){
 		if (this.opts.orientation == 'vertical'){
-			this.bar.add_widget(new JsWidget({
+			this.bar.add_widget(new bricks.JsWidget({
 						height:this.opts.interval || '10px'
 			}));
 		} else {
-			this.bar.add_widget(new JsWidget({
+			this.bar.add_widget(new bricks.JsWidget({
 						width:this.opts.interval || '10px'
 			}));
 		}
@@ -110,7 +110,7 @@ bricks.Toolbar = class extends bricks.Layout {
 	add_removable(item){
 		if (! item.tool_opts.removable) return;
 		var img_src = bricks_resource('imgs/delete.png');
-		var image = new Icon({url:img_src});
+		var image = new bricks.Icon({url:img_src});
 		if (image){
 			item.add_widget(image);
 			image.bind('click',this.remove_item.bind(this, item));

bricks/tree.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks. TreeNode = class extends bricks.VBox {
 	constructor(tree, parent, data){
 		var opts = {
@@ -16,7 +16,7 @@ bricks. TreeNode = class extends bricks.VBox {
 		if (this.tree.multitype_tree){
 			this.params['type'] = this.data[this.tree.opts.typeField];
 		}
-		var n = new HBox({
+		var n = new bricks.HBox({
 				height:'auto',
 				overflow:'hidden',
 				width:'100%'
@@ -27,7 +27,7 @@ bricks. TreeNode = class extends bricks.VBox {
 		this.node_widget = n;
 		this.create_node_content(n);
 		if (! this.data.is_leaf) {
-			this.container = new VBox({height:'auto', overflow:'hidden'});
+			this.container = new bricks.VBox({height:'auto', overflow:'hidden'});
 			this.add_widget(this.container);
 			this.container.dom_element.style.marginLeft = bricks.app.charsize + 'px';
 			if (this.data.children){
@@ -69,13 +69,13 @@ bricks. TreeNode = class extends bricks.VBox {
 	create_node_content(widget){
 		var img_size = bricks.app.charsize;
 		if (this.is_leaf){
-			widget.add_widget(new BlankIcon({}));
+			widget.add_widget(new bricks.BlankIcon({}));
 		} 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 MultipleStateIcon({
+			this.trigle = new bricks.MultipleStateIcon({
 				state:'close',
 				urls:sources,
 				height:img_size,
@@ -92,14 +92,14 @@ bricks. TreeNode = class extends bricks.VBox {
 		if (!icon){
 			icon = bricks_resource('imgs/folder.png');
 		}
-		var img = new Icon({
+		var img = new bricks.Icon({
 			url:icon
 		});
 		widget.add_widget(img);
 		var txt = this.data[this.tree.opts.textField];
 		widget.add_widget(
-		this.str_w = new Text({text:txt}));
+		this.str_w = new bricks.Text({text:txt}));
-		this.input = new UiStr({name:'text', value:txt});
+		this.input = new bricks.UiStr({name:'text', value:txt});
 		this.input.bind('blur', this.edit_handle.bind(this));
 		widget.add_widget(this.str_w);
 	}
@@ -114,7 +114,7 @@ bricks. TreeNode = class extends bricks.VBox {
 		var v = this.input.value;
 		r = await this.syncdata('edit');
 		this.data[this.tree.opts.textField] = v;
-		this.str_w = new Text({text:v});
+		this.str_w = new bricks.Text({text:v});
 		this.node_widget.remove_widget(this.input);
 		this.node_widget.add_widget(this.str_w);
 	}
@@ -156,7 +156,7 @@ bricks. Tree = class extends bricks.VBox {
 		this.multitype_tree = this.opts.multitype_tree||false;
 		this.selected_node = null;
 		this.create_toolbar();
-		this.container = new VScrollPanel({});
+		this.container = new bricks.VScrollPanel({});
 		this.add_widget(this.container);
 		this.data_id = null;
 		if (this.opts.dataurl){
@@ -167,6 +167,7 @@ bricks. Tree = class extends bricks.VBox {
 	create_toolbar(){
 	}
 	async get_children_data(node){
+		var jcall = bricks.jcall;
 		var d = await jcall(this.opts.dataurl,{
 				method : this.opts.method || 'GET',
 				params : node.params
@@ -179,7 +180,7 @@ bricks. Tree = class extends bricks.VBox {
 	}
 	create_node_children(node, data){
 		for (var i=0; i<data.length; i++){
-			var n = new TreeNode(this, node, data[i]);
+			var n = new bricks.TreeNode(this, node, data[i]);
 			node.container.add_widget(n);
 		}
 	}
@@ -252,7 +253,7 @@ bricks. EditableTree = class extends bricks.Tree {
 				}
 			]
 		}
-		this.toolbar = new Toolbar(desc);
+		this.toolbar = new bricks.Toolbar(desc);
 		this.toolbar.bind('command', this.command_handle.bind(this));
 		this.add_widget(this.toolbar, 0);
 	}
@@ -289,7 +290,7 @@ bricks. EditableTree = class extends bricks.Tree {
 		var data = { };
 		data[this.opts.idField] = 'undefined';
 		data[this.opts.textField] = 'new node';
-		var n = new TreeNode(this, node, data);
+		var n = new bricks.TreeNode(this, node, data);
 		node.container.add_widget(n);
 		n.edit();
 		console.log('add_node() finished ...');

bricks/uitypesdef.js

@@ -1,4 +1,5 @@
-class UiTypesDef {
+var bricks = window.bricks || {};
+bricks.UiTypesDef = class {
 	constructor(opts){
 		this.opts = opts;
 		this.uitypes = {
@@ -41,21 +42,21 @@ class UiTypesDef {
 	}
 }
 
-var uitypesdef = new UiTypesDef();
+bricks.uitypesdef = new bricks.UiTypesDef();
 
-var viewFactory = function(desc, rec){
+bricks.viewFactory = function(desc, rec){
 	var uitype = desc.uitype;
-	var builder = uitypesdef.getViewBuilder(uitype) || 
+	var builder = bricks.uitypesdef.getViewBuilder(uitype) || 
-					uitypesdef.getViewBuilder('str');
+					bricks.uitypesdef.getViewBuilder('str');
 	if (! builder) return Null;
 	var w = builder(desc, rec);
 	return w;
 }
 
-var intputFactory = function(desc, rec){
+bricks.inputFactory = function(desc, rec){
 	var uitype = desc.uitype;
-	var builder = uitypesdef.getInputBuilder(uitype) || 
+	var builder = bricks.uitypesdef.getInputBuilder(uitype) || 
-				uitypesdef.getInputBuilder('str');
+				bricks.uitypesdef.getInputBuilder('str');
 	if (! builder) return Null;
 	return builder(desc, rec);
 }
@@ -76,25 +77,25 @@ var strViewBuilder = function(desc, rec){
 	var v = rec[desc.name];
 	return buildText(v, 'left');
 }
-uitypesdef.setViewBuilder('str', strViewBuilder);
+bricks.uitypesdef.setViewBuilder('str', strViewBuilder);
 
 var strInputBuilder = function(desc, rec) {
 	var v = rec[desc.name];
 	desc[value] = v;
 	return new UiStr(desc);
 }
-uitypesdef.setInputBuilder('str', strInputBuilder);
+bricks.uitypesdef.setInputBuilder('str', strInputBuilder);
 
 var passwordViewBuilder = function(desc, rec){
 	return new buildText('******');
 }
-uitypesdef.setViewBuilder('password', passwordViewBuilder);
+bricks.uitypesdef.setViewBuilder('password', passwordViewBuilder);
 
 var intViewBuilder = function(desc, rec){
 	var v = rec[desc.name] + '';
 	return buildText(v, 'right');
 }
-uitypesdef.setViewBuilder('int', intViewBuilder);
+bricks.uitypesdef.setViewBuilder('int', intViewBuilder);
 
 var floatViewBuilder = function(desc, rec){
 	var v = rec[desc.name];
@@ -102,7 +103,7 @@ var floatViewBuilder = function(desc, rec){
 	v = v + '';
 	return buildText(v, 'right');
 }
-uitypesdef.setViewBuilder('float', floatViewBuilder);
+bricks.uitypesdef.setViewBuilder('float', floatViewBuilder);
 
 var codeViewBuilder = function(desc, rec){
 	var opts = objcopy(desc)
@@ -115,10 +116,9 @@ var codeViewBuilder = function(desc, rec){
 	}
 	return buildText(v, 'left')
 }
-uitypesdef.setViewBuilder('code', codeViewBuilder);
+bricks.uitypesdef.setViewBuilder('code', codeViewBuilder);
-
 
 var passwordInputBuilder = function(desc, rec){
 	return new UiPassword(desc);
 }
-uitypesdef.setInputBuilder('password', passwordInputBuilder);
+bricks.uitypesdef.setInputBuilder('password', passwordInputBuilder);

bricks/utils.js

@@ -1,3 +1,4 @@
+var bricks = window.bricks || {};
 class _TypeIcons {
 	constructor(){
 		this.kv = {}
@@ -85,7 +86,7 @@ var import_cache = new Map()
 
 var import_css = async function(url){
 	if (objget(import_cache, url)===1) return;
-	var result = await tget(url);
+	var result = await (bricks.tget(url));
 	debug('import_css():tget() return', result); 
 	var s = document.createElement('style');
 	s.setAttribute('type', 'text/javascript');
@@ -96,7 +97,7 @@ var import_css = async function(url){
 
 var import_js = async function(url){
 	if (objget(import_cache, url)===1) return;
-	// var result = await tget(url);
+	// var result = await (bricks.tget(url));
 	// debug('import_js():tget() return', url, result); 
 	var s = document.createElement('script');
 	s.setAttribute('type', 'text/javascript');

bricks/video.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 /*
 we use videojs for video play
 https://videojs.com

bricks/widget.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 bricks.JsWidget = class {
 	dom_element = null;
 	constructor(options){
@@ -226,7 +226,7 @@ bricks.TextBase = class extends bricks.JsWidget {
 		if (this.opts.hasOwnProperty('i18n')){
 			this.i18n = this.opts.i18n;
 		}
-		this._i18n = new I18n();
+		this._i18n = new bricks.I18n();
 		if (this.i18n && this.otext) {
 			this.text = this._i18n._(this.otext);
 		}

bricks/wterm.js

@@ -1,4 +1,4 @@
-bricks = window.bricks || {};
+var bricks = window.bricks || {};
 /*
 dependent on xterm.js
 */