Ext.lingo.GlossyPanel.js 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. Ext.namespace("Ext.lingo");
  2. Ext.lingo.GlossyPanel = Ext.extend(Ext.Panel, {
  3. collapsed: true,
  4. setupGlossy: function() {
  5. for (var i = 0; i < this.glossy.length; i++) {
  6. var item = this.glossy[i];
  7. var id = item.id;
  8. var el = Ext.get(id);
  9. cvi_glossy.add(el.dom, {color:'#4682B4', noshadow: true});
  10. el = Ext.get(id);
  11. el.hover(
  12. function(){
  13. cvi_glossy.modify(this, {highlight: true})
  14. },
  15. function(){
  16. cvi_glossy.modify(this, {highlight: false});
  17. },
  18. el.dom
  19. );
  20. el.on('mousedown', function(){
  21. cvi_glossy.modify(this, {pressed: true});
  22. }, el.dom);
  23. var fn = this.domMouseUp.createDelegate(this, [el.dom]);
  24. el.on('mouseup', fn);
  25. Ext.get('a_' + id).on('click', fn);
  26. }
  27. },
  28. domMouseUp: function(dom) {
  29. cvi_glossy.modify(dom, {pressed: false});
  30. var id = dom.id;
  31. for (var i = 0; i < this.glossy.length; i++) {
  32. var item = this.glossy[i];
  33. if (item.id == id) {
  34. App.addContent(item.name, item.title, item.url);
  35. break;
  36. }
  37. }
  38. },
  39. initComponent: function() {
  40. if (this.glossy) {
  41. var html = "";
  42. for (var i = 0; i < this.glossy.length; i++) {
  43. var item = this.glossy[i];
  44. html += '<img id="' + item.id + '" src="' + item.img + '" class="glossy" height="52" width="52" style="cursor:pointer"/><br />' +
  45. '<span id="a_' + item.id + '" style="font-weight:bold;cursor:pointer;">' +
  46. item.title + '</span><br /><br />';
  47. }
  48. this.html = html;
  49. this.on('expand', this.setupGlossy, this);
  50. }
  51. Ext.lingo.GlossyPanel.superclass.initComponent.call(this);
  52. }
  53. });