mcs-ng-material/resources/lib/TITLEBAR.js

MCS NG-Meterial is based on mcs-web.

define(['app','lib/ELEMENT','lib/BUTTON'],function(app, ELEMENT){
	return app.extend("TITLEBAR",ELEMENT,{
		template: function(){
			var cfg=this.config,cls=`x-titlebar ${cfg.cls||''}`,
				menus=this.filterItems({attr:'menus',isNotNull:true},cfg.leftButtons,cfg.rightButtons);
				lbtns=this.genTemplateList(cfg.leftButtons,{defCls:'BUTTON',tag:'LeftBtn',dock:cfg.dock}),
				rbtns=this.genTemplateList(cfg.rightButtons,{defCls:'BUTTON',tag:'RightBtn',dock:cfg.dock})
			if (cfg.dock=='left'||cfg.dock=='right'){
				ret=
				`<div layout="column" style="width:50px">
					<md-whiteframe class="md-whiteframe-8dp x-toolbar-vertical" layout="column" layout-align="start center" flex>
						${lbtns}
						<md-truncate class="md-title">${cfg.title}</md-truncate>
						<span flex></span>
						${rbtns}
					</md-whiteframe>
				</div>`;
			}
			else{
				var tag='md-toolbar';
				ret=
				`<${tag} class="${cls}" style="overflow-x: auto;overflow-y:hidden;">
					<div class="md-toolbar-tools">
						${lbtns}
						<md-truncate class="md-title">${cfg.title}</md-truncate>
						<span flex></span>
						${rbtns}
					</div>
				</${tag}>`;
			}
			return ret;
		}
	});
})