Wallpaper.js 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. /*!
  2. * Ext JS Library 4.0
  3. * Copyright(c) 2006-2011 Sencha Inc.
  4. * licensing@sencha.com
  5. * http://www.sencha.com/license
  6. */
  7. /**
  8. * @class Ext.ux.desktop.Wallpaper
  9. * @extends Ext.Component
  10. * <p>This component renders an image that stretches to fill the component.</p>
  11. */
  12. Ext.define('Ext.ux.desktop.Wallpaper', {
  13. extend: 'Ext.Component',
  14. alias: 'widget.wallpaper',
  15. cls: 'ux-wallpaper',
  16. html: '<img src="'+Ext.BLANK_IMAGE_URL+'">',
  17. stretch: false,
  18. wallpaper: null,
  19. stateful : true,
  20. stateId : 'desk-wallpaper',
  21. afterRender: function () {
  22. var me = this;
  23. me.callParent();
  24. me.setWallpaper(me.wallpaper, me.stretch);
  25. },
  26. applyState: function () {
  27. var me = this, old = me.wallpaper;
  28. me.callParent(arguments);
  29. if (old != me.wallpaper) {
  30. me.setWallpaper(me.wallpaper);
  31. }
  32. },
  33. getState: function () {
  34. return this.wallpaper && { wallpaper: this.wallpaper };
  35. },
  36. setWallpaper: function (wallpaper, stretch) {
  37. var me = this, imgEl, bkgnd;
  38. me.stretch = (stretch !== false);
  39. me.wallpaper = wallpaper;
  40. if (me.rendered) {
  41. imgEl = me.el.dom.firstChild;
  42. if (!wallpaper || wallpaper == Ext.BLANK_IMAGE_URL) {
  43. Ext.fly(imgEl).hide();
  44. } else if (me.stretch) {
  45. imgEl.src = wallpaper;
  46. me.el.removeCls('ux-wallpaper-tiled');
  47. Ext.fly(imgEl).setStyle({
  48. width: '100%',
  49. height: '100%'
  50. }).show();
  51. } else {
  52. Ext.fly(imgEl).hide();
  53. bkgnd = 'url('+wallpaper+')';
  54. me.el.addCls('ux-wallpaper-tiled');
  55. }
  56. me.el.setStyle({
  57. backgroundImage: bkgnd || ''
  58. });
  59. if(me.stateful) {
  60. me.saveState();
  61. }
  62. }
  63. return me;
  64. }
  65. });