Hi, Varela, could you share some code about using Ext.Template inside a window like appear in you app, or is there some example in ext2 where are using Ext.Template, maybe there is but I don't found it.
Frank
JS
// <-- Perl
// JS
var Ac={};
Ac.Win = desktop.getWindow('AcWin');
if(!Ac.Win){
Ac.Win = desktop.createWindow({
id: 'AcWin',
title:"Веб приложения",
iconCls: 'icon-accessories',
width:320,
height:210,
x:70,
y:10,
border:true,
autoScroll : true,
minimizable : true,
maximizable : true,
closable : true,
resizable : true,
shim : false,
constrainHeader : true,
layout: 'fit',
html: '<div id="CPanel"></div>'
});
var myData = [ // this variables insert from Perl ($array)
['publisher','Менеджер публикаций','locked'],
['guestbook','Гостевая книга','unlocked'],
['quote','Цитаты','locked'],
['messenger','Системные сообщения','unlocked']
];
Ac.ds = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(myData),
reader: new Ext.data.ArrayReader({}, [
{name: 'id'},
{name: 'title'},
{name: 'cls'}
])
});
Ac.ds.load();
Ac.resultTpl = new Ext.Template(
'<div class="{cls}" d="{cls}" id="x-{id}"><div id="lock"> </div><img src="/_res/modules/{id}/{id}.png"><br><span>{title}</span></div>'
);
var view = new Ext.View('CPanel', Ac.resultTpl, {store: Ac.ds});
view.on("click", function(vw, index, node, e){
var cls =node.getAttribute('d');
if(cls == 'unlocked') {
alert('Прога ' + node.id + ' сработала.');
// ..... function }
else {
alert('Прога ' + node.id+ ' : '+ cls +' недоступна' );
}
});
Ac.Win.setAnimateTarget(false);
Ac.Win.show();
}
else{ Ac.Win.show() }
// end js
// -> Perl
css
.icon-accessories { background-image: url( /_res/_images/shared/silk/application_view_tile.png ) !important; }
#CPanel div { width:90px; height:65px; margin: 6px 0 0 0; float:left; text-align:center; cursor:pointer !important; }
#CPanel img{ width:32px; height:32px; }
#CPanel span{ color:#15428b; }
#CPanel #lock { position: absolute; width:13px; height:13px; margin-left:55px; margin-top:20px; background: url( /_res/_images/shared/main/disabled.gif ) 0 0 no-repeat; cursor:default !important; }
* html #CPanel #lock { margin-left:27px; }
#CPanel .unlocked #lock { display:none; }
#CPanel .locked #lock { display:block; }
#CPanel .locked img { filter:Alpha(Opacity=40); -moz-opacity:0.4; opacity:0.4; }
#CPanel .locked span { color:#AEAEAE; }
#CPanel .locked { cursor:default !important; }