|
10 | 10 | *
|
11 | 11 | * @website http://formvalidator.net/#file-validators
|
12 | 12 | * @license Dual licensed under the MIT or GPL Version 2 licenses
|
13 |
| - * @version 2.2.24 |
| 13 | + * @version 2.2.34 |
14 | 14 | */
|
15 | 15 | (function($, window) {
|
16 | 16 |
|
|
66 | 66 | reader.onload = function(fileObj) {
|
67 | 67 |
|
68 | 68 | image.onload = function() {
|
| 69 | + $(window).trigger('imageValidation', [this]); |
69 | 70 | successCallback(this);
|
70 | 71 | };
|
71 | 72 |
|
|
203 | 204 | return false;
|
204 | 205 | };
|
205 | 206 |
|
| 207 | + /** |
| 208 | + * Attach dimension check onto formUtils only for unit testing purpose |
| 209 | + * @param {HTMLImageElement} img |
| 210 | + * @param {String} dimDeclaration |
| 211 | + * @param {Boolean|String} Returns error message if image was invalid, false otherwise |
| 212 | + */ |
| 213 | + $.formUtils.checkImageDimension = function(img, dimDeclaration, language) { |
| 214 | + var error = false, |
| 215 | + restrictedDim = {width:0, height:0}, |
| 216 | + getDimRestriction = function(dimDeclaration) { |
| 217 | + dimDeclaration = dimDeclaration.replace('min', '').replace('max', ''); |
| 218 | + var chunks = dimDeclaration.split('x'); |
| 219 | + restrictedDim.width = chunks[0]; |
| 220 | + restrictedDim.height = chunks[1] ? chunks[1] : chunks[0]; |
| 221 | + }, |
| 222 | + minDeclaration = false, |
| 223 | + maxDeclaration = false, |
| 224 | + declarationParts = dimDeclaration.split('-'); |
| 225 | + |
| 226 | + if( declarationParts.length == 1 ) { |
| 227 | + if( declarationParts[0].indexOf('min') === 0 ) { |
| 228 | + minDeclaration = declarationParts[0]; |
| 229 | + } else { |
| 230 | + maxDeclaration = declarationParts[0]; |
| 231 | + } |
| 232 | + } else { |
| 233 | + minDeclaration = declarationParts[0]; |
| 234 | + maxDeclaration = declarationParts[1]; |
| 235 | + } |
| 236 | + |
| 237 | + if( minDeclaration ) { |
| 238 | + // check min |
| 239 | + getDimRestriction(minDeclaration); |
| 240 | + if( img.width < restrictedDim.width || img.height < restrictedDim.height ) { |
| 241 | + error = language.imageTooSmall + ' ('+language.min+' '+restrictedDim.width+'x'+restrictedDim.height+'px)'; |
| 242 | + } |
| 243 | + } |
| 244 | + |
| 245 | + if( !error && maxDeclaration ) { |
| 246 | + // Check max |
| 247 | + getDimRestriction(maxDeclaration); |
| 248 | + if( img.width > restrictedDim.width || img.height > restrictedDim.height ) { |
| 249 | + if( img.width > restrictedDim.width ) { |
| 250 | + error = language.imageTooWide +' '+restrictedDim.width+'px'; |
| 251 | + } else { |
| 252 | + error = language.imageTooTall +' '+restrictedDim.height+'px'; |
| 253 | + } |
| 254 | + error += ' ('+language.max+' '+restrictedDim.width+'x'+restrictedDim.height+'px)'; |
| 255 | + } |
| 256 | + } |
| 257 | + |
| 258 | + return error; |
| 259 | + }; |
| 260 | + |
| 261 | + /** |
| 262 | + * Attach ratio validation onto formUtils only for unit testing purpose |
| 263 | + * @param {HTMLImageElement} img |
| 264 | + * @param {String} dimDeclaration |
| 265 | + * @param {Boolean|String} Returns error message if image was invalid, false otherwise |
| 266 | + */ |
| 267 | + $.formUtils.checkImageRatio = function(img, ratioDeclaration, language) { |
| 268 | + var ratio = img.width / img.height, |
| 269 | + minRatio = false, |
| 270 | + maxRatio = false, |
| 271 | + calculateRatio = function(declaration) { |
| 272 | + var dims = declaration.replace('max', '').replace('min', '').split(':'); |
| 273 | + return dims[0] / dims[1]; |
| 274 | + }, |
| 275 | + declarationParts = ratioDeclaration.split('-'), |
| 276 | + isWithin = function(val, min, max) { |
| 277 | + console.log(val+ '>='+min +' && '+val+' <= '+max); |
| 278 | + return val >= min && val <= max; |
| 279 | + }; |
| 280 | + |
| 281 | + if( declarationParts.length == 1 ) { |
| 282 | + if( ratio !== calculateRatio(declarationParts[0]) ) |
| 283 | + return language.imageRatioNotAccepted; |
| 284 | + } |
| 285 | + else if( declarationParts.length == 2 && !isWithin(ratio, calculateRatio(declarationParts[0]), calculateRatio(declarationParts[1])) ) { |
| 286 | + return language.imageRatioNotAccepted; |
| 287 | + } |
| 288 | + |
| 289 | + return false; |
| 290 | + }; |
| 291 | + |
206 | 292 | /**
|
207 | 293 | * Validate image dimension
|
208 | 294 | */
|
|
247 | 333 | }
|
248 | 334 |
|
249 | 335 | _loadImage(file[0], function(img) {
|
250 |
| - var error = false, |
251 |
| - restrictedDim = {width:0, height:0}, |
252 |
| - getDimRestriction = function(attrVal) { |
253 |
| - var chunks = attrVal.split('x'); |
254 |
| - restrictedDim.width = chunks[0]; |
255 |
| - restrictedDim.height = chunks[1] ? chunks[1] : chunks[0]; |
256 |
| - }, |
257 |
| - minDeclaration = ($input.valAttr('min-dimension') || '').replace('px', ''), |
258 |
| - maxDeclaration = ($input.valAttr('max-dimension') || '').replace('px', ''); |
259 |
| - |
260 |
| - if( minDeclaration ) { |
261 |
| - // check min |
262 |
| - getDimRestriction(minDeclaration); |
263 |
| - if( img.width < restrictedDim.width || img.height < restrictedDim.height ) { |
264 |
| - error = language.imageTooSmall + ' ('+language.min+' '+restrictedDim.width+'x'+restrictedDim.height+'px)'; |
265 |
| - } |
266 |
| - } |
| 336 | + var error = false; |
267 | 337 |
|
268 |
| - if( !error && maxDeclaration ) { |
269 |
| - // Check max |
270 |
| - getDimRestriction(maxDeclaration); |
271 |
| - if( img.width > restrictedDim.width || img.height > restrictedDim.height ) { |
272 |
| - if( img.width > restrictedDim.width ) { |
273 |
| - error = language.imageTooWide +' '+restrictedDim.width+'px'; |
274 |
| - } else { |
275 |
| - error = language.imageTooTall +' '+restrictedDim.height+'px'; |
276 |
| - } |
277 |
| - error += ' ('+language.max+' '+restrictedDim.width+'x'+restrictedDim.height+'px)'; |
278 |
| - } |
279 |
| - } |
| 338 | + if( $input.valAttr('dimension') ) |
| 339 | + error = $.formUtils.checkImageDimension(img, $input.valAttr('dimension'), language); |
| 340 | + |
| 341 | + if( !error && $input.valAttr('ratio') ) |
| 342 | + error = $.formUtils.checkImageRatio(img, $input.valAttr('ratio'), language); |
280 | 343 |
|
281 | 344 | // Set validation result flag on input
|
282 | 345 | if( error ) {
|
|
0 commit comments