mirror of
				https://github.com/Frooodle/Stirling-PDF.git
				synced 2025-10-25 11:17:28 +02:00 
			
		
		
		
	Merge pull request #424 from DimK10/Bug-Multitool-Filename
Bug multitool filename
This commit is contained in:
		
						commit
						3be12c8988
					
				
							
								
								
									
										8
									
								
								.idea/.gitignore
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										8
									
								
								.idea/.gitignore
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,8 @@ | ||||
| # Default ignored files | ||||
| /shelf/ | ||||
| /workspace.xml | ||||
| # Editor-based HTTP Client requests | ||||
| /httpRequests/ | ||||
| # Datasource local storage ignored files | ||||
| /dataSources/ | ||||
| /dataSources.local.xml | ||||
| @ -91,3 +91,26 @@ hr { | ||||
|     border-color: rgba(255, 255, 255, 0.6); /* semi-transparent white */ | ||||
|     background-color: rgba(255, 255, 255, 0.6); /* for some browsers that might use background instead of border for <hr> */ | ||||
| } | ||||
| 
 | ||||
| #global-buttons-container input { | ||||
|     background-color: #323948; | ||||
|     caret-color: #ffffff; | ||||
|     color: #ffffff; | ||||
| } | ||||
| #global-buttons-container input::placeholder { | ||||
|     color: #ffffff; | ||||
| } | ||||
| 
 | ||||
| #global-buttons-container input:disabled::-webkit-input-placeholder { /* WebKit browsers */ | ||||
|     color:    #6E6865; | ||||
| } | ||||
| #global-buttons-container input:disabled:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ | ||||
|     color:    #6E6865; | ||||
| } | ||||
| #global-buttons-container input:disabled::-moz-placeholder { /* Mozilla Firefox 19+ */ | ||||
|     color:    #6E6865; | ||||
| } | ||||
| #global-buttons-container input:disabled:-ms-input-placeholder { /* Internet Explorer 10+ */ | ||||
|     color:    #6E6865; | ||||
| } | ||||
| 
 | ||||
|  | ||||
| @ -2,4 +2,23 @@ | ||||
| body { | ||||
|     --body-background-color: 255, 255, 255; | ||||
|     --base-font-color: 33, 37, 41; | ||||
| } | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| #global-buttons-container input { | ||||
|     background-color: #ffffff; | ||||
|     /*caret-color: #ffffff;*/ | ||||
|     /*color: #ffffff;*/ | ||||
| } | ||||
| /*#global-buttons-container input:disabled::-webkit-input-placeholder { !* WebKit browsers *!*/ | ||||
| /*    color:    #98A0AB;*/ | ||||
| /*}*/ | ||||
| /*#global-buttons-container input:disabled:-moz-placeholder { !* Mozilla Firefox 4 to 18 *!*/ | ||||
| /*    color:    #98A0AB;*/ | ||||
| /*}*/ | ||||
| /*#global-buttons-container input:disabled::-moz-placeholder { !* Mozilla Firefox 19+ *!*/ | ||||
| /*    color:    #98A0AB;*/ | ||||
| /*}*/ | ||||
| /*#global-buttons-container input:disabled:-ms-input-placeholder { !* Internet Explorer 10+ *!*/ | ||||
| /*    color:    #98A0AB;*/ | ||||
| /*}*/ | ||||
|  | ||||
| @ -55,6 +55,17 @@ class PdfActionsManager { | ||||
|     deletePageButtonCallback(e) { | ||||
|         var imgContainer = this.getPageContainer(e.target); | ||||
|         this.pagesContainer.removeChild(imgContainer); | ||||
|         if (this.pagesContainer.childElementCount === 0) { | ||||
|             const filenameInput = document.getElementById('filename-input'); | ||||
|             const filenameParagraph = document.getElementById('filename'); | ||||
|             const downloadBtn = document.getElementById('export-button'); | ||||
| 
 | ||||
|             filenameInput.disabled = true; | ||||
|             filenameInput.value = ""; | ||||
|             filenameParagraph.innerText = ""; | ||||
| 
 | ||||
|             downloadBtn.disabled = true; | ||||
|         } | ||||
|     }; | ||||
| 
 | ||||
|     insertFileButtonCallback(e) { | ||||
|  | ||||
| @ -3,17 +3,21 @@ class PdfContainer { | ||||
|     pagesContainer; | ||||
|     pagesContainerWrapper; | ||||
|     pdfAdapters; | ||||
|     downloadLink; | ||||
| 
 | ||||
|     constructor(id, wrapperId, pdfAdapters) { | ||||
|         this.fileName = null; | ||||
|         this.pagesContainer = document.getElementById(id) | ||||
|         this.pagesContainerWrapper = document.getElementById(wrapperId); | ||||
|         this.downloadLink = null; | ||||
|         this.movePageTo = this.movePageTo.bind(this); | ||||
|         this.addPdfs = this.addPdfs.bind(this); | ||||
|         this.addPdfsFromFiles = this.addPdfsFromFiles.bind(this); | ||||
|         this.rotateElement = this.rotateElement.bind(this); | ||||
|         this.rotateAll = this.rotateAll.bind(this); | ||||
|         this.exportPdf = this.exportPdf.bind(this); | ||||
|         this.updateFilename = this.updateFilename.bind(this); | ||||
|         this.setDownloadAttribute = this.setDownloadAttribute.bind(this); | ||||
|         this.preventIllegalChars = this.preventIllegalChars.bind(this); | ||||
| 
 | ||||
|         this.pdfAdapters = pdfAdapters; | ||||
| 
 | ||||
| @ -28,6 +32,15 @@ class PdfContainer { | ||||
|         window.addPdfs = this.addPdfs; | ||||
|         window.exportPdf = this.exportPdf; | ||||
|         window.rotateAll = this.rotateAll; | ||||
| 
 | ||||
|         const filenameInput = document.getElementById('filename-input'); | ||||
|         const downloadBtn = document.getElementById('export-button'); | ||||
| 
 | ||||
|         filenameInput.onkeyup = this.updateFilename; | ||||
|         filenameInput.onkeydown = this.preventIllegalChars; | ||||
|         filenameInput.disabled = true; | ||||
|         filenameInput.innerText = ""; | ||||
|         downloadBtn.disabled = true; | ||||
|     } | ||||
| 
 | ||||
|     movePageTo(startElement, endElement, scrollTo = false) { | ||||
| @ -60,6 +73,29 @@ class PdfContainer { | ||||
|         input.setAttribute("accept", "application/pdf"); | ||||
|         input.onchange = async(e) => { | ||||
|             const files = e.target.files; | ||||
|             if (files.length > 0) { | ||||
|                 const filenameInput = document.getElementById('filename-input'); | ||||
|                 const pagesContainer = document.getElementById('pages-container'); | ||||
|                 const downloadBtn = document.getElementById('export-button'); | ||||
| 
 | ||||
|                 filenameInput.disabled = false; | ||||
| 
 | ||||
|                 if (pagesContainer.childElementCount === 0) { | ||||
|                     filenameInput.value = ""; | ||||
|                     this.filename = null; | ||||
|                     downloadBtn.disabled = true; | ||||
|                 } else { | ||||
|                     this.filename = filenameInput.value; | ||||
|                 } | ||||
| 
 | ||||
|                 if (this.filename === null || this.filename === undefined) { | ||||
|                     filenameInput.value = files[0].name; | ||||
|                 } else { | ||||
|                     filenameInput.value = this.filename; | ||||
|                 } | ||||
| 
 | ||||
|             } | ||||
| 
 | ||||
|             this.addPdfsFromFiles(files, nextSiblingElement); | ||||
|         } | ||||
| 
 | ||||
| @ -192,6 +228,27 @@ class PdfContainer { | ||||
|         const url = URL.createObjectURL(pdfBlob); | ||||
|         const downloadOption = localStorage.getItem('downloadOption'); | ||||
| 
 | ||||
|         const filenameInput = document.getElementById('filename-input'); | ||||
| 
 | ||||
|         let inputArr = filenameInput.value.split('.'); | ||||
| 
 | ||||
|         if (inputArr !== null && inputArr !== undefined && inputArr.length > 0) { | ||||
| 
 | ||||
|             inputArr = inputArr.filter(n => n); // remove all empty strings, nulls or undefined
 | ||||
| 
 | ||||
|             if (inputArr.length > 1) { | ||||
|                 inputArr.pop(); // remove right part after last dot
 | ||||
|             } | ||||
| 
 | ||||
|             filenameInput.value = inputArr.join(''); | ||||
|             this.filename = filenameInput.value; | ||||
|         } | ||||
| 
 | ||||
|         if (!filenameInput.value.includes('.pdf')) { | ||||
|             filenameInput.value = filenameInput.value + '.pdf'; | ||||
|             this.filename = filenameInput.value; | ||||
|         } | ||||
| 
 | ||||
|         if (downloadOption === 'sameWindow') { | ||||
|             // Open the file in the same window
 | ||||
|             window.location.href = url; | ||||
| @ -200,12 +257,45 @@ class PdfContainer { | ||||
|             window.open(url, '_blank'); | ||||
|         } else { | ||||
|             // Download the file
 | ||||
|             const downloadLink = document.createElement('a'); | ||||
|             downloadLink.href = url; | ||||
|             downloadLink.download = this.fileName ? this.fileName : 'managed.pdf'; | ||||
|             downloadLink.click(); | ||||
|             this.downloadLink = document.createElement('a'); | ||||
|             this.downloadLink.id = 'download-link'; | ||||
|             this.downloadLink.href = url; | ||||
|             // downloadLink.download = this.fileName ? this.fileName : 'managed.pdf';
 | ||||
|             // downloadLink.download = this.fileName;
 | ||||
|             this.downloadLink.setAttribute('download', this.filename ? this.fileName : 'managed.pdf'); | ||||
|             this.downloadLink.setAttribute('target', '_blank'); | ||||
|             this.downloadLink.onclick = this.setDownloadAttribute; | ||||
|             this.downloadLink.click(); | ||||
|         } | ||||
|     } | ||||
| 
 | ||||
|     setDownloadAttribute() { | ||||
|         this.downloadLink.setAttribute("download", this.filename ? this.filename : 'managed.pdf'); | ||||
|     } | ||||
| 
 | ||||
|     updateFilename() { | ||||
|        const filenameInput = document.getElementById('filename-input'); | ||||
|         const downloadBtn = document.getElementById('export-button'); | ||||
| 
 | ||||
|         if (filenameInput.value === "") { | ||||
|             downloadBtn.disabled = true; | ||||
|             return; | ||||
|         } | ||||
| 
 | ||||
|         downloadBtn.disabled = false; | ||||
|         this.filename = filenameInput.value; | ||||
|     } | ||||
| 
 | ||||
|     preventIllegalChars(e) { | ||||
|         // const filenameInput = document.getElementById('filename-input');
 | ||||
|         //
 | ||||
|         // filenameInput.value = filenameInput.value.replace('.pdf', '');
 | ||||
|         //
 | ||||
|         // // prevent .
 | ||||
|         // if (filenameInput.value.includes('.')) {
 | ||||
|         //     filenameInput.value.replace('.','');
 | ||||
|         // }
 | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| export default PdfContainer; | ||||
|  | ||||
| @ -20,15 +20,22 @@ | ||||
|             <div class="container"> | ||||
|                 <div class="row justify-content-center"> | ||||
|                     <div class="col-md-6" style="text-align: center"> | ||||
|                         <div id="global-buttons-container" class="d-flex align-content-center justify-content-center"> | ||||
|                             <div class="form-group"> | ||||
|                                 <label for="filename-input">Filename</label> | ||||
|                                 <input type="text" class="form-control" id="filename-input" placeholder="filename"> | ||||
|                             </div> | ||||
|                         </div> | ||||
|                         <div id="global-buttons-container"> | ||||
|                              | ||||
| 
 | ||||
|                             <button class="btn btn-primary" onclick="addPdfs()"> | ||||
|                                 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-plus" viewBox="0 0 16 16"> | ||||
|                                     <path d="M8 6.5a.5.5 0 0 1 .5.5v1.5H10a.5.5 0 0 1 0 1H8.5V11a.5.5 0 0 1-1 0V9.5H6a.5.5 0 0 1 0-1h1.5V7a.5.5 0 0 1 .5-.5z"/> | ||||
|                                     <path d="M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5L14 4.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5h-2z"/> | ||||
|                                 </svg> | ||||
|                             </button> | ||||
|                              | ||||
| 
 | ||||
| 
 | ||||
|                             <button class="btn btn-secondary enable-on-file" onclick="rotateAll(-90)" disabled> | ||||
|                                 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16"> | ||||
|                                     <path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z" /> | ||||
| @ -58,7 +65,7 @@ | ||||
|         <div th:insert="~{fragments/footer.html :: footer}"></div> | ||||
|     </div> | ||||
|     <div id="drag-container"></div> | ||||
|      | ||||
| 
 | ||||
|     <script type="module"> | ||||
|         import PdfContainer from './js/multitool/PdfContainer.js'; | ||||
|         import DragDropManager from "./js/multitool/DragDropManager.js"; | ||||
| @ -114,6 +121,7 @@ | ||||
|         #global-buttons-container > * { | ||||
|             padding: 0.6rem 0.75rem; | ||||
|         } | ||||
| 
 | ||||
|         #global-buttons-container svg { | ||||
|             width: 20px; | ||||
|             height: 20px; | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user