1// uCoz filepond initiate methods 2 3// init uploader 4function initFilepondUploader(files = [], params = {}) { 5 // update wrapper by form element 6 insertFileElement() 7 self.imageUploaderFields?.classList.remove('site-images-wrapper') 8 9 // prepare signs 10 let { 11 // plugin labels 12 131035:labelMaxFileSizeExceeded, 131036:labelMaxFileSize, 131037:labelFileTypeNotAllowed, 131038:fileValidateTypeLabelExpectedTypes, 13 // core labels 14 5291:labelFileLoading, 50169:labelFileLoadError, 131040:labelFileSizeNotAvailable, 15 5291:labelFileProcessing, 131039:labelFileProcessingComplete, 131034:labelFileProcessingError, 7262:labelTapToCancel, 50132:labelTapToRetry, 3278:labelTapToUndo, 16 } = uCoz.sign 17 18 // create uploader 19 self.pond = self.FilePond?.create(self.uImageUploader, { 20 name : 'images', 21 acceptedFileTypes : ( uCoz.onlyImages ? uCoz.allowedFilesExtension.map(type => `image/${ type }`) : [] ), 22 allowReorder : true, 23 itemInsertLocation : 'after', 24 credits : false, 25 imagePreviewMinHeight : 145, 26 27 ...params, // custom params 28 files, // already uploaded images 29 30 // plugin labels 31 labelMaxFileSizeExceeded, labelMaxFileSize, labelFileTypeNotAllowed, fileValidateTypeLabelExpectedTypes, 32 33 // core labels 34 labelIdle : [ 35 uCoz.sign[131008], 36 uCoz.sign['_131009'] 37 ? `<div class="fHelp">${ uCoz.sign['_131009'] }</div>`.render({ filesize:params.maxFileSizeRaw }) 38 : '', 39 ].join('') || 'Drag & Drop your files or <span class="filepond--label-action"> Browse </span>', 40 labelFileLoading, labelFileLoadError, labelFileSizeNotAvailable, labelFileProcessing, labelFileProcessingComplete, labelFileProcessingError, labelTapToCancel, labelTapToRetry, labelTapToUndo, 41 42 onreorderfiles : rebuildAttributes, 43 onremovefile : rebuildAttributes, 44 oninit : buildAttributesData, 45 }) 46} 47 48// insert image uploader form element 49function insertFileElement() { 50 let element = document.createElement('input') 51 52 Object.assign(element, { id:'uImageUploader', type:'file', className:'filepond', multiple:true, required:!!uCoz.addEdit.imageUploaderParams.imagesRequired }) 53 54 if (self.imageUploaderFields) self.imageUploaderFields.innerHTML = element.outerHTML 55} 56 57// image attributes builder 58function buildAttributesData() { 59 let attributesParams = {} 60 self.pond.getFiles().forEach((file, index) => attributesParams[ file.id ] = { ...getFilesOptions(index), num:index + 1 }) 61 self.pond.setOptions({ attributesParams, attributesDefaultSizes:uCoz.addEdit }) 62} 63 64// rebuild handler 65function rebuildAttributes(files, origin, target) { 66 if ( files === null ) files = self.pond.getFiles() // update files list on delete item mode 67 68 rebuildAttributesCodesFields(...arguments) 69 updateInsertImageButtonIndex(...arguments) 70} 71 72// image attributes rebuild fields 73function rebuildAttributesCodesFields(files, origin, target) { 74 files.forEach(function(file, index, array) { 75 let codesFieldsTemplate = self.pond.attributesCodesFieldsTemplate 76 let codesWrapperElement = document.querySelector(`#attributes_${ file.id } .filepond--image-codes-container`) 77 78 if (!codesWrapperElement) return 79 80 codesWrapperElement.innerHTML = codesFieldsTemplate.render({ num:index + 1 }) 81 }) 82} 83 84// update image number to insert image button 85function updateInsertImageButtonIndex(files, origin, target) { 86 // if ( files === null ) - delete item mode 87 // if ( files === Array ) - reorder items mode 88 89 files.forEach(function(file, index, array) { 90 let insertImageButtonElement = document.querySelector(`#attributes_${ file.id } .insert-image-button`) 91 92 if (insertImageButtonElement) insertImageButtonElement.dataset.num = index + 1 93 }) 94} 95 96// image options getter 97function getFilesOptions(index) { return ( uCoz.entryImages ? uCoz.entryImages[ index ] : {} )?.options || {} } 98 99// reinit exists uploader 100function reinitFilepondUploader(data) { 101 self.FilePond?.destroy(self.uImageUploader) 102 initFilepondUploader(data, uCoz.addEdit.imageUploaderParams) 103} 104 105// image uploader type switcer 106function switchImageUploader(switcher) { 107 let cookieName = `${ uCoz.site.id }ImUpSw` 108 let cookieValue = switcher.dataset.type 109 110 setImageUploaderCookieData(cookieName, uCoz.mod, cookieValue) 111 112 rebuildImageUploaderSwitcher(switcher.parentElement, +cookieValue) 113 114 if ( !!+cookieValue ) initMultipleImageUploader() 115 else initDefaultImageUploader() 116} 117 118/** 119 * Init image uploader type switcher (radio-based) 120 * Listens for change on #imageUploaderTypeSwitcher, saves selected type to cookie and inits the appropriate uploader.
121 * Cookie value: 0 = default uploader, 1 = multiple uploader (FilePond) 122 */ 123function initNewUploaderSwitcher() { 124 const container = document.getElementById('image_uploader_type_switcher'); 125 if (!container) return; 126 127 container.addEventListener('change', e => { 128 const cookieName = `${ uCoz.site.id }ImUpSw`; 129 const cookieValue = e.target.value; 130 131 setImageUploaderCookieData(cookieName, uCoz.mod, cookieValue); 132 133 if (cookieValue === '1') { 134 initMultipleImageUploader(); 135 } else { 136 initDefaultImageUploader(); 137 } 138 }); 139} 140 141// getting structured cookie data 142function getImageUploaderCookieData(cookieName) { 143 if (!cookieName) return 144 145 let cookieDataString = Cookies.get(cookieName) 146 147 if (!cookieDataString) return 148 149 let cookieData = {} 150 151 cookieDataString.split(/,/).map(string => string.split(/=/)).forEach(data => Object.assign(cookieData, { [ data[0] ]:+data[1] })) 152 153 return cookieData 154} 155 156// set structured cookie data 157function setImageUploaderCookieData(cookieName, key, value) { 158 if (!cookieName) return 159 160 let cookieData = getImageUploaderCookieData(cookieName) || {} 161 162 cookieData[ key ] = value 163 164 let cookieDataString = Object.entries(cookieData).map(array => array.join('=')).join(',') 165 166 Cookies.set(cookieName, cookieDataString, { path:'/', expires:365, samesite:'Lax' }) 167 168 return 169} 170 171// rebuild switcher items 172function rebuildImageUploaderSwitcher(wrapper, state = uCoz.addEdit.imageUploaderType) { 173 if (!wrapper) return 174 175 let switchers = [ 176 !!state ? `<a href="javascript:;" onclick="switchImageUploader(this)" data-type="0" >${ uCoz.sign[131042] }</a>` : `<b>${ uCoz.sign[131042] }</b>`, 177 !state ? `<a href="javascript:;" onclick="switchImageUploader(this)" data-type="1" >${ uCoz.sign[130061] }</a>` : `<b>${ uCoz.sign[130061] }</b>`, 178 ] 179 180 wrapper.innerHTML = switchers.join('|') 181} 182 183// init multiple image uploader - used FilePond lib 184function initMultipleImageUploader() { 185 initFilepondUploader(uCoz.entryImages, uCoz.addEdit.imageUploaderParams) 186 187 // hide image limit info 188 self.imageUploaderWrapper.closest('form').classList.remove('has-default-image-uploader') 189} 190 191// init default image uploader 192function initDefaultImageUploader() { 193 if (!self.imageUploaderFields) return 194 if (!self.imageFieldTemplate) return 195 196 let addButtonTemplate = `<button type="button" onclick="addImgF(this)" title="[[3185]]">+</button>` 197 let editButtonTemplate = `<span id="edtL{{num}}" class="editImgBlock">[ <a href="javascript:;" rel="nofollow" onclick="changeImage(this)">[[3078]]</a> ]</span>` 198 199 // create pseudo image element - for add form 200 if (!uCoz.imagesParams) uCoz.imagesParams = [{ num:1 }] 201 202 // already exists images 203 if (uCoz.imagesParams && isArray(uCoz.imagesParams) && uCoz.imagesParams.length) { 204 switch (uCoz.module) { 205 case 'index': 206 _initIndexDefaultImageUploader() 207 break; 208 209 case 'forum': 210 _initForumDefaultImageUploader( addButtonTemplate, editButtonTemplate ) 211 break; 212 213 default: 214 // all modules except index 215 _initModulesDefaultImageUploader( addButtonTemplate, editButtonTemplate ) 216 } 217 } 218 219 // show image limit info 220 self.imageUploaderWrapper.closest('form').classList.add('has-default-image-uploader') 221} 222 223// init modules image uploader 224function _initModulesDefaultImageUploader(addButtonTemplate, editButtonTemplate) { 225 let imagesFields = '' 226 227 uCoz.imagesParams.forEach(image => { 228 if (!!image.previewSrcFull) image.edit = editButtonTemplate.render({ ...image, sign:uCoz.sign }) 229 230 if (image.num == 1 && uCoz.addEdit.imageUploaderParams.maxFiles > uCoz.imagesParams.length) { 231 image.plusId = 'iplus' 232 image.button = addButtonTemplate.render({ sign:uCoz.sign }) 233 } 234 235 imagesFields += self.imageFieldTemplate.textContent.render(image) 236 }) 237 238 self.imageUploaderFields.innerHTML = imagesFields 239 240 buildImagesList() 241} 242 243// init index (site) image uploader 244function _initIndexDefaultImageUploader() { 245 self.imageUploaderFields?.classList.add('site-images-wrapper') 246 self.imageUploaderFields.innerHTML = '' 247 248 buildImagesList() 249} 250 251// init forum image uploader 252function _initForumDefaultImageUploader(addButtonTemplate, editButtonTemplate) { 253 let imagesFields = '' 254
255 uCoz.imagesParams.forEach(image => { 256 if (image.num == 1 && uCoz.addEdit.imageUploaderParams.maxFiles > uCoz.imagesParams.length) { 257 Object.assign(image, { plusId:'iplus', button:addButtonTemplate.render(uCoz) }) 258 } 259 260 if ( !!image.previewSrcFull ) { 261 let imageParams = { ...image, sign:uCoz.sign } 262 263 image.edit = editButtonTemplate.render(imageParams) 264 image.preview = self.imagePreviewTemplate.textContent.trim().render(imageParams) 265 } 266 267 imagesFields += self.imageFieldTemplate.textContent.trim().render(image) 268 }) 269 270 self.imageUploaderFields.innerHTML = imagesFields 271 272 buildImagesList() 273} 274 275// change image handler if image was uploaded 276function changeImage(button) { 277 let buttonWrapper = button.parentElement 278 buttonWrapper.classList.add('u-hidden') 279 280 let imageInput = buttonWrapper.nextElementSibling 281 282 let imagePreviewBlock = imageInput.nextElementSibling 283 imagePreviewBlock.classList.remove('added', 'openednow') 284 imagePreviewBlock.innerHTML = '' 285} 286 287// DOM Ready handler 288document.addEventListener('DOMContentLoaded', function(event) { 289 self.FilePond?.registerPlugin( 290 FilePondPluginImagePreview, 291 FilePondPluginImageExifOrientation, 292 FilePondPluginFileValidateSize, 293 FilePondPluginFileValidateType, 294 FilePondPluginImageAttributes, 295 ) 296 297 // new type switcher only for index module 298 if (uCoz.mod === 'si') { 299 initNewUploaderSwitcher(); 300 } 301})
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.