[631] | 1 | /*! |
---|
| 2 | * Ext JS Library 3.0.0 |
---|
| 3 | * Copyright(c) 2006-2009 Ext JS, LLC |
---|
| 4 | * licensing@extjs.com |
---|
| 5 | * http://www.extjs.com/license |
---|
| 6 | */ |
---|
| 7 | /** |
---|
| 8 | * @class Ext.ux.ProgressBarPager |
---|
| 9 | * @extends Object |
---|
| 10 | * Plugin (ptype = 'tabclosemenu') for displaying a progressbar inside of a paging toolbar instead of plain text |
---|
| 11 | * |
---|
| 12 | * @ptype progressbarpager |
---|
| 13 | * @constructor |
---|
| 14 | * Create a new ItemSelector |
---|
| 15 | * @param {Object} config Configuration options |
---|
| 16 | * @xtype itemselector |
---|
| 17 | */ |
---|
| 18 | Ext.ux.ProgressBarPager = Ext.extend(Object, { |
---|
| 19 | /** |
---|
| 20 | * @cfg {Integer} progBarWidth |
---|
| 21 | * <p>The default progress bar width. Default is 225.</p> |
---|
| 22 | */ |
---|
| 23 | progBarWidth : 225, |
---|
| 24 | /** |
---|
| 25 | * @cfg {String} defaultText |
---|
| 26 | * <p>The text to display while the store is loading. Default is 'Loading...'</p> |
---|
| 27 | */ |
---|
| 28 | defaultText : 'Loading...', |
---|
| 29 | /** |
---|
| 30 | * @cfg {Object} defaultAnimCfg |
---|
| 31 | * <p>A {@link Ext.Fx Ext.Fx} configuration object. Default is { duration : 1, easing : 'bounceOut' }.</p> |
---|
| 32 | */ |
---|
| 33 | defaultAnimCfg : { |
---|
| 34 | duration : 1, |
---|
| 35 | easing : 'bounceOut' |
---|
| 36 | }, |
---|
| 37 | constructor : function(config) { |
---|
| 38 | if (config) { |
---|
| 39 | Ext.apply(this, config); |
---|
| 40 | } |
---|
| 41 | }, |
---|
| 42 | //public |
---|
| 43 | init : function (parent) { |
---|
| 44 | |
---|
| 45 | if(parent.displayInfo){ |
---|
| 46 | this.parent = parent; |
---|
| 47 | var ind = parent.items.indexOf(parent.displayItem); |
---|
| 48 | parent.remove(parent.displayItem, true); |
---|
| 49 | this.progressBar = new Ext.ProgressBar({ |
---|
| 50 | text : this.defaultText, |
---|
| 51 | width : this.progBarWidth, |
---|
| 52 | animate : this.defaultAnimCfg |
---|
| 53 | }); |
---|
| 54 | |
---|
| 55 | parent.displayItem = this.progressBar; |
---|
| 56 | |
---|
| 57 | parent.add(parent.displayItem); |
---|
| 58 | parent.doLayout(); |
---|
| 59 | Ext.apply(parent, this.parentOverrides); |
---|
| 60 | |
---|
| 61 | this.progressBar.on('render', function(pb) { |
---|
| 62 | pb.el.applyStyles('cursor:pointer'); |
---|
| 63 | |
---|
| 64 | pb.el.on('click', this.handleProgressBarClick, this); |
---|
| 65 | }, this); |
---|
| 66 | |
---|
| 67 | |
---|
| 68 | // Remove the click handler from the |
---|
| 69 | this.progressBar.on({ |
---|
| 70 | scope : this, |
---|
| 71 | beforeDestroy : function() { |
---|
| 72 | this.progressBar.el.un('click', this.handleProgressBarClick, this); |
---|
| 73 | } |
---|
| 74 | }); |
---|
| 75 | |
---|
| 76 | } |
---|
| 77 | |
---|
| 78 | }, |
---|
| 79 | // private |
---|
| 80 | // This method handles the click for the progress bar |
---|
| 81 | handleProgressBarClick : function(e){ |
---|
| 82 | var parent = this.parent; |
---|
| 83 | var displayItem = parent.displayItem; |
---|
| 84 | |
---|
| 85 | var box = this.progressBar.getBox(); |
---|
| 86 | var xy = e.getXY(); |
---|
| 87 | var position = xy[0]-box.x; |
---|
| 88 | var pages = Math.ceil(parent.store.getTotalCount()/parent.pageSize); |
---|
| 89 | |
---|
| 90 | var newpage = Math.ceil(position/(displayItem.width/pages)); |
---|
| 91 | parent.changePage(newpage); |
---|
| 92 | }, |
---|
| 93 | |
---|
| 94 | // private, overriddes |
---|
| 95 | parentOverrides : { |
---|
| 96 | // private |
---|
| 97 | // This method updates the information via the progress bar. |
---|
| 98 | updateInfo : function(){ |
---|
| 99 | if(this.displayItem){ |
---|
| 100 | var count = this.store.getCount(); |
---|
| 101 | var pgData = this.getPageData(); |
---|
| 102 | var pageNum = this.readPage(pgData); |
---|
| 103 | |
---|
| 104 | var msg = count == 0 ? |
---|
| 105 | this.emptyMsg : |
---|
| 106 | String.format( |
---|
| 107 | this.displayMsg, |
---|
| 108 | this.cursor+1, this.cursor+count, this.store.getTotalCount() |
---|
| 109 | ); |
---|
| 110 | |
---|
| 111 | pageNum = pgData.activePage; ; |
---|
| 112 | |
---|
| 113 | var pct = pageNum / pgData.pages; |
---|
| 114 | |
---|
| 115 | this.displayItem.updateProgress(pct, msg, this.animate || this.defaultAnimConfig); |
---|
| 116 | } |
---|
| 117 | } |
---|
| 118 | } |
---|
| 119 | }); |
---|
| 120 | Ext.preg('progressbarpager', Ext.ux.ProgressBarPager); |
---|
| 121 | |
---|