Author: andrei_exadel Date: 2008-02-20 09:20:04 -0500 (Wed, 20 Feb 2008) New Revision: 6207 Modified: trunk/sandbox/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js trunk/sandbox/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx Log: disable buttons refactoring Modified: trunk/sandbox/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js =================================================================== --- trunk/sandbox/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js 2008-02-20 14:15:27 UTC (rev 6206) +++ trunk/sandbox/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js 2008-02-20 14:20:04 UTC (rev 6207) @@ -304,6 +304,7 @@ this.iframe = $(this.id + "_iframe"); this.items = $(this.id + ":fileItems"); this.classes = classes; + this.currentInput = $(this.id + ":file"); this.options = options || {}; this.setupAutoUpload(); @@ -336,20 +337,20 @@ var newUpload = elt.cloneNode(true); newUpload.id = this.id + ":file" + (this.idCounter++); + this.currentInput = newUpload; $(this.id + ":add1").appendChild(newUpload); if (this.runUpload) { this.upload(); } - this.disableAddButton(this.entries.length > this.maxFileBatchSize); }, remove: function(entry) { entry.clear(); this.entries = this.entries.without(entry); - this.disableAddButton(this.entries.length > this.maxFileBatchSize); + //this.disableAddButton(this.entries.length > this.maxFileBatchSize); }, _selectEntryForUpload: function() { @@ -405,9 +406,56 @@ if (this.entries.length == 0) { this.setupAutoUpload(); } - + this.processButtons(); + }, + + processButtons: function () { this.disableAddButton(this.entries.length > this.maxFileBatchSize); + this.disableCleanButton(this.cleanAllDisabled()); + this.disableUploadButton(this.uploadAllDisabled()); + this.switchUploadButton(); }, + + cleanAllDisabled: function () { + var c = 0; + for (var i = 0; i < this.entries.length; i++) { + if (this.entries[i].state != FileUploadEntry.UPLOAD_IN_PROGRESS) { + c++; + } + } + return (c == 0); + }, + + uploadAllDisabled: function () { + if (this.runUpload) { + return false; + } else { + var c = 0; + for (var i = 0; i < this.entries.length; i++) { + var e = this.entries[i]; + if (e.state == FileUploadEntry.READY || e.state == FileUploadEntry.INITIALIZED) { + c++; + } + } + return (c == 0); + } + }, + + switchUploadButton: function () { + if (this.runUpload) { + var d = $(this.id + ":upload2"); + d.innerHTML = "<b>Cancel</b>"; + d.onclick = function () { + this.stop(); + }.bind(this); + }else { + var d = $(this.id + ":upload2"); + d.innerHTML = "<b>Upload</b>"; + d.onclick = function () { + this.upload(); + }.bind(this); + } + }, disableCleanButton: function(disabled) { if(disabled) { @@ -421,7 +469,7 @@ }, disableAddButton: function(disabled) { - $(this.id+":file").disabled = disabled; + this.currentInput.disabled = disabled; $(this.id+":add1").className = (disabled? this.classes.ADD.DISABLED : this.classes.ADD.ENABLED); $(this.id+":add2").className = (disabled? this.classes.ADD_CONTENT.DISABLED : this.classes.ADD_CONTENT.ENABLED); }, @@ -491,7 +539,7 @@ } this._updateEntriesState(); - this.disableUploadButton(false); + //this.disableUploadButton(false); } else if (newState == FileUploadEntry.UPLOAD_CANCELED || newState == FileUploadEntry.UPLOAD_TRANSFER_ERROR || @@ -504,7 +552,7 @@ this._updateEntriesState(); - this.disableUploadButton(false); + //this.disableUploadButton(false); } else if (newState == FileUploadEntry.UPLOAD_IN_PROGRESS) { @@ -514,8 +562,9 @@ this._updateEntriesState(); - this.disableUploadButton(true); + //this.disableUploadButton(true); } + this.processButtons(); }, submitForm: function(entry) { Modified: trunk/sandbox/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx =================================================================== --- trunk/sandbox/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx 2008-02-20 14:15:27 UTC (rev 6206) +++ trunk/sandbox/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx 2008-02-20 14:20:04 UTC (rev 6207) @@ -37,10 +37,10 @@ <tr> <td> <div class="upload_button_border" style=" float:left;"> - <div class="upload_button upload_font" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" onmouseout="this.className='upload_button upload_font'" + <div class="upload_button upload_font #{component.attributes['addStyle']}" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" onmouseout="this.className='upload_button upload_font'" style="position: relative; overflow: hidden; width:70px" id="#{clientId}:add1"> - <div class="upload_button_content upload_font upload_ico upload_ico_add" + <div class="upload_button_content upload_font upload_ico upload_ico_add #{component.attributes['addStyle']}" id="#{clientId}:add2" style="direction: rtl;">Add...</div> <input type="file" style="cursor: pointer; z-index: 3; right: -10px; top: -10px; font-size: 10em; position: absolute" class="hidden" @@ -50,14 +50,13 @@ </div> </div> <div class="upload_button_border" style=" float:left;"> - <div class="upload_button upload_font" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" + <div class="upload_button upload_font #{component.attributes['uploadStyleDisabled']}" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" onmouseout="this.className='upload_button upload_font'" id="#{clientId}:upload1" onclick="return $('#{clientId}').component.upload();"> <a href="#" class="upload_button_selection"> - <div class="upload_button_content upload_font upload_ico upload_ico_start" + <div class="upload_button_content upload_font upload_ico upload_ico_start_dis #{component.attributes['uploadStyleDisabled']}" id="#{clientId}:upload2"> - <b style="display: none;">Cancel</b> <b>Upload</b> </div> </a> @@ -66,29 +65,15 @@ <!-- todo review --> - <div class="upload_button_border" style=" float:left;"> - <div class="upload_button upload_font" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" - onmouseout="this.className='upload_button upload_font'" - id="#{clientId}:upload3" - onclick="return $('#{clientId}').component.stop();"> - <a href="#" class="upload_button_selection"> - <div class="upload_button_content upload_font upload_ico upload_ico_stop" - id="#{clientId}:upload4"> - <b>Stop</b> - </div> - </a> - </div> - </div> - <!-- --> <div class="upload_button_border" style=" float:right"> - <div class="upload_button upload_font" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" + <div class="upload_button_dis upload_font #{component.attributes['cleanStyleDisabled']}" onmouseover="this.className='upload_button_light upload_font'" onmousedown="this.className='upload_button_press upload_font'" onmouseup="this.className='upload_button upload_font'" onmouseout="this.className='upload_button upload_font'" onclick="return $('#{clientId}').component.clear();" id="#{clientId}:clean1"> <a href="#" class="upload_button_selection"> - <div class="upload_button_content upload_font upload_ico upload_ico_clear" + <div class="upload_button_content upload_font upload_ico upload_ico_clear_dis #{component.attributes['cleanStyleDisabled']}" id="#{clientId}:clean2">Clean All</div> </a> </div>