From d2403cdadb0beddadde7c3012c8e6df0e352aa29 Mon Sep 17 00:00:00 2001 From: snipe Date: Sat, 17 Feb 2018 00:51:22 -0800 Subject: [PATCH] Added image preview for uploads --- public/css/build/all.css | Bin 239859 -> 239896 bytes public/css/dist/all.css | Bin 239859 -> 239896 bytes public/css/overrides.css | Bin 5335 -> 5372 bytes public/js/build/all.js | Bin 809474 -> 809936 bytes public/js/dist/all.js | Bin 809474 -> 809936 bytes public/mix-manifest.json | 10 +++--- resources/assets/js/snipeit.js | 30 +++++++++++++++++- resources/assets/less/overrides.less | 6 ++++ .../forms/edit/image-upload.blade.php | 5 ++- 9 files changed, 44 insertions(+), 7 deletions(-) diff --git a/public/css/build/all.css b/public/css/build/all.css index eeea15c3a441ce0f40c6d20528117bced7fc79a0..42a3afede73d45613ad4f24e5dff2b2eb31964c4 100644 GIT binary patch delta 53 zcmex-k#EK&zJ?aY7N#xCpI4|VmlovYC#D1xrIux;mRBd`7p0^YSs4~oC=}=CWTq&j J7o}F#0svzc6|w*T delta 15 XcmbPniSP48zJ?aY7N#xCpH~0?J46R4 diff --git a/public/css/dist/all.css b/public/css/dist/all.css index eeea15c3a441ce0f40c6d20528117bced7fc79a0..42a3afede73d45613ad4f24e5dff2b2eb31964c4 100644 GIT binary patch delta 53 zcmex-k#EK&zJ?aY7N#xCpI4|VmlovYC#D1xrIux;mRBd`7p0^YSs4~oC=}=CWTq&j J7o}F#0svzc6|w*T delta 15 XcmbPniSP48zJ?aY7N#xCpH~0?J46R4 diff --git a/public/css/overrides.css b/public/css/overrides.css index 50197fbc979b0e175566576bae96508b0f959371..d214b969567583e498a5fb93a47f07c3326de1f2 100644 GIT binary patch delta 48 zcmcbv`A2iZIuRA+(t@1)#FT)d)UwRf^6I4gqLkDkE5m{ch2s32%oK(6qSVUCYelpG D=rI!_ delta 11 ScmeyPd0lhEI+4kjMKl2;t_3>) diff --git a/public/js/build/all.js b/public/js/build/all.js index 5d09311b2e5b3fa485c03aed964791fdcd856729..0df3599e62299eb6f2609c72d265e7ecc40b0585 100644 GIT binary patch delta 563 zcmZ9J&r2IY6vtVs)wToml+r@WGPXKX!^CLXh~@_dQTzp(jVCE($iC=6x*K+$#vh2K z%&q8k{}Ex&J@(d~dg&h_^dIPKVoJ&BJ?4Gh_sx6XFSq$0N&d5O%!qklM$MRcXvWQi zd1M}&C%5Eg^Qv_mG*N|ts~GYN)nX`GsttO2`aU_B`@k%@SX>4V4TQFTNb7^{)EmaJD0Xmm4RSYPXZBz^wmv2=JAeT;7 L3?8?URt!G{Ie9Zo diff --git a/public/js/dist/all.js b/public/js/dist/all.js index 5d09311b2e5b3fa485c03aed964791fdcd856729..0df3599e62299eb6f2609c72d265e7ecc40b0585 100644 GIT binary patch delta 563 zcmZ9J&r2IY6vtVs)wToml+r@WGPXKX!^CLXh~@_dQTzp(jVCE($iC=6x*K+$#vh2K z%&q8k{}Ex&J@(d~dg&h_^dIPKVoJ&BJ?4Gh_sx6XFSq$0N&d5O%!qklM$MRcXvWQi zd1M}&C%5Eg^Qv_mG*N|ts~GYN)nX`GsttO2`aU_B`@k%@SX>4V4TQFTNb7^{)EmaJD0Xmm4RSYPXZBz^wmv2=JAeT;7 L3?8?URt!G{Ie9Zo diff --git a/public/mix-manifest.json b/public/mix-manifest.json index 5b909a6732..16c13683d9 100644 --- a/public/mix-manifest.json +++ b/public/mix-manifest.json @@ -2,13 +2,13 @@ "/js/build/vue.js": "/js/build/vue.js?id=25049a0c0eb736e1c883", "/css/AdminLTE.css": "/css/AdminLTE.css?id=b8be19a285eaf44eec37", "/css/app.css": "/css/app.css?id=407edb63cc6b6dc62405", - "/css/overrides.css": "/css/overrides.css?id=33d8f8fea649acea5f9c", + "/css/overrides.css": "/css/overrides.css?id=c289c71c08df753ebc45", "/js/build/vue.js.map": "/js/build/vue.js.map?id=6b79d08f1decca72957c", "/css/AdminLTE.css.map": "/css/AdminLTE.css.map?id=99f5a5a03c4155cf69f6", "/css/app.css.map": "/css/app.css.map?id=bdbe05e6ecd70ccfac72", "/css/overrides.css.map": "/css/overrides.css.map?id=898c91d4a425b01b589b", - "/css/dist/all.css": "/css/dist/all.css?id=dc1449877e0f8abedc47", - "/js/dist/all.js": "/js/dist/all.js?id=d3af8331997bd82e4ec4", - "/css/build/all.css": "/css/build/all.css?id=dc1449877e0f8abedc47", - "/js/build/all.js": "/js/build/all.js?id=d3af8331997bd82e4ec4" + "/css/dist/all.css": "/css/dist/all.css?id=5fdad90c2d445e4a1a2c", + "/js/dist/all.js": "/js/dist/all.js?id=6e959b16034ab00e3007", + "/css/build/all.css": "/css/build/all.css?id=5fdad90c2d445e4a1a2c", + "/js/build/all.js": "/js/build/all.js?id=6e959b16034ab00e3007" } \ No newline at end of file diff --git a/resources/assets/js/snipeit.js b/resources/assets/js/snipeit.js index 4f4ff0938e..855167edd6 100755 --- a/resources/assets/js/snipeit.js +++ b/resources/assets/js/snipeit.js @@ -322,19 +322,42 @@ $(document).ready(function () { // ------------------------------------------------ + + // Image preview + function readURL(input) { + if (input.files && input.files[0]) { + var reader = new FileReader(); + reader.onload = function(e) { + $('#imagePreview').attr('src', e.target.result); + } + reader.readAsDataURL(input.files[0]); + } + } + + function formatBytes(bytes) { + if(bytes < 1024) return bytes + " Bytes"; + else if(bytes < 1048576) return(bytes / 1024).toFixed(3) + " KB"; + else if(bytes < 1073741824) return(bytes / 1048576).toFixed(3) + " MB"; + else return(bytes / 1073741824).toFixed(3) + " GB"; + }; + // File size validation $('#uploadFile').bind('change', function() { $('#upload-file-status').removeClass('text-success').removeClass('text-danger'); $('.goodfile').remove(); $('.badfile').remove(); + $('.badfile').remove(); + $('.previewSize').hide(); var max_size = $('#uploadFile').data('maxsize'); var actual_size = this.files[0].size; if (actual_size > max_size) { - $('#upload-file-status').addClass('text-danger').removeClass('help-block').prepend(' '); + $('#upload-file-status').addClass('text-danger').removeClass('help-block').prepend(' ').append('This file is ' + formatBytes(actual_size) + '.'); } else { $('#upload-file-status').addClass('text-success').removeClass('help-block').prepend(' '); + readURL(this); + $('#imagePreview').fadeIn(); } $('#upload-file-info').html(this.files[0].name); @@ -344,4 +367,9 @@ $(document).ready(function () { + + + + + }); diff --git a/resources/assets/less/overrides.less b/resources/assets/less/overrides.less index 7a7a2aa23b..f6ad98b737 100644 --- a/resources/assets/less/overrides.less +++ b/resources/assets/less/overrides.less @@ -330,3 +330,9 @@ img.navbar-brand-img, .navbar-brand>img { #toolbar { margin-top: 10px; } + +#uploadPreview { + border-color: grey; + border-width: 1px; + border-style: solid +} diff --git a/resources/views/partials/forms/edit/image-upload.blade.php b/resources/views/partials/forms/edit/image-upload.blade.php index feabb90e35..9daf7ebeb6 100644 --- a/resources/views/partials/forms/edit/image-upload.blade.php +++ b/resources/views/partials/forms/edit/image-upload.blade.php @@ -1,6 +1,6 @@
-
+
+
+ +