|
@@ -1,166 +1,6 @@
|
|
|
@component('panel.layouts.component', ['title' => 'ویرایش محصول '])
|
|
|
@slot('style')
|
|
|
<style>
|
|
|
- .card-header {
|
|
|
- text-align: center !important;
|
|
|
- }
|
|
|
- .form-control {
|
|
|
- background-color: hsl(315, 22%, 86%);
|
|
|
- }
|
|
|
- .required {
|
|
|
- color: red;
|
|
|
- }
|
|
|
- .py-5 {
|
|
|
- padding-top: 0 !important;
|
|
|
- }
|
|
|
- .photo {
|
|
|
- border: 0px;
|
|
|
- background-color: #fff;
|
|
|
- }
|
|
|
- #holder {
|
|
|
- margin: 15px;
|
|
|
- height: 150px;
|
|
|
- width: 150px;
|
|
|
-
|
|
|
- }
|
|
|
- .btn_photo {
|
|
|
- margin-bottom: -50px;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .card-header {
|
|
|
- text-align: center !important;
|
|
|
- }
|
|
|
-
|
|
|
- .form-control {
|
|
|
-
|
|
|
- background-color: hsl(315, 22%, 86%);
|
|
|
- }
|
|
|
-
|
|
|
- .required {
|
|
|
- color: red;
|
|
|
- }
|
|
|
-
|
|
|
- .py-5 {
|
|
|
- padding-top: 0 !important;
|
|
|
- }
|
|
|
-
|
|
|
- .select2 {
|
|
|
- width: 100% !important;
|
|
|
- }
|
|
|
-
|
|
|
- .photo {
|
|
|
- border: 0px;
|
|
|
- background-color: #fff;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- /* Fine Uploader Gallery View Styles
|
|
|
- /* ---------------------------------------*/
|
|
|
-
|
|
|
- .media {
|
|
|
- border-radius: 10px;
|
|
|
- display: flex;
|
|
|
- text-align: center;
|
|
|
- margin: 10px;
|
|
|
- padding: 10px;
|
|
|
- border: 2px solid #752360;
|
|
|
- align-items: flex-start;
|
|
|
- }
|
|
|
-
|
|
|
- #gallery img {
|
|
|
- width: 150px;
|
|
|
- margin-bottom: 10px;
|
|
|
- margin-right: 10px;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
-
|
|
|
- .hide-element {
|
|
|
- display: none;
|
|
|
- }
|
|
|
- /* Feature Images*/
|
|
|
-
|
|
|
- .btn-file {
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
-
|
|
|
- }
|
|
|
- .btn-file input[type=file] {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- right: 0;
|
|
|
- min-width: 100%;
|
|
|
- min-height: 100%;
|
|
|
- font-size: 100px;
|
|
|
- text-align: right;
|
|
|
- filter: alpha(opacity=0);
|
|
|
- opacity: 0;
|
|
|
- outline: none;
|
|
|
- background: white;
|
|
|
- cursor: inherit;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .alert {
|
|
|
- box-shadow: 10px 10px 5px;
|
|
|
- -moz-box-shadow: 10px 10px 5px;
|
|
|
- -webkit-box-shadow: 10px 10px 5px;
|
|
|
- }
|
|
|
- .media-left {
|
|
|
- z-index: 1000;
|
|
|
- cursor: pointer;
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
- .dz-preview .form-control {
|
|
|
- width: 60% !important;
|
|
|
- display: flex;
|
|
|
- padding: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .media-left img {
|
|
|
- z-index: 1000;
|
|
|
- cursor: pointer;
|
|
|
- display: flex;
|
|
|
- }
|
|
|
-
|
|
|
- .thumbnail {
|
|
|
- color: #006dcc;
|
|
|
- *color: #0044cc;
|
|
|
- }
|
|
|
- .media-body {
|
|
|
- flex: 1;
|
|
|
- padding: 15px;
|
|
|
- }
|
|
|
- #delete {
|
|
|
- display: flex;
|
|
|
- margin-left: -40px;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
-
|
|
|
- .label-tags i {
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
-
|
|
|
- /* *****************************/
|
|
|
- output span{
|
|
|
- padding: 6px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .test{
|
|
|
- padding: 10px;
|
|
|
- }
|
|
|
- .DeleteImages{
|
|
|
- border:2px solid #752360;
|
|
|
- margin: 5px;
|
|
|
- border-radius: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- @media only screen and (min-width: 900px) {
|
|
|
- .b{
|
|
|
- padding: 0 17px;
|
|
|
- }
|
|
|
- }
|
|
|
.hide-element{
|
|
|
display: flex;}
|
|
|
</style>
|
|
@@ -334,76 +174,63 @@
|
|
|
@enderror
|
|
|
</div>
|
|
|
<div class="form-group col-md-8">
|
|
|
- <label for="title">
|
|
|
- {{ __('product.featured_image') }}
|
|
|
- </label> <i class="required"> *</i>
|
|
|
+ @component('product::components.featuredImage')
|
|
|
+ @slot('ImageSrc')
|
|
|
+ {{\Illuminate\Support\Facades\Storage::disk('product')->url($product->featured_image->path)}}
|
|
|
+ @endslot
|
|
|
+ @slot('featureDescription')
|
|
|
+ {{$product->featured_image->descriptionImg}}
|
|
|
+ @endslot
|
|
|
+ @slot('featureCaption')
|
|
|
+ {{$product->featured_image->caption}}
|
|
|
+ @endslot
|
|
|
+ @endcomponent
|
|
|
+ </div>
|
|
|
|
|
|
- <span class="btn btn-primary btn-file">
|
|
|
- <input type="file" id="uploadImages" name="featured_image"
|
|
|
- class="form-control photo browse @error('featured_image') is-invalid @enderror"
|
|
|
- value="" autocomplete="featured_image" autofocus>تصویر شاخص
|
|
|
- </span>
|
|
|
- <div class="hide-element" id="previewImages">
|
|
|
- <div class="media col-12">
|
|
|
+ <div class="row">
|
|
|
|
|
|
- <div class="media-left ">
|
|
|
- <a class="btn btn-sm btn-danger btn_photo"
|
|
|
- href="{{route('uploads.destroyFile', $product->featured_image->id)}}">
|
|
|
- <i class="icon fa fa-close"></i>
|
|
|
- </a>
|
|
|
- <img class="media-object img-thumbnail" src="{{\Illuminate\Support\Facades\Storage::disk('product')->url($product->featured_image->path)}}"
|
|
|
- alt="" id="0" title="" data-toggle="modal"
|
|
|
- data-target="#individualImagePreview"
|
|
|
- style="width: 250px; height: 150px;" >
|
|
|
- </div>
|
|
|
+ <div class="form-row ">
|
|
|
+ <div class="upload-widget test ">
|
|
|
|
|
|
- <div class="media-body">
|
|
|
- <p>
|
|
|
- <label for="featureDescription">توضیحات: </label>
|
|
|
- <input type="text" class="form-control" value="{{$product->featured_image->descriptionImg}}" name="featureDescription">
|
|
|
- </p>
|
|
|
- <p>
|
|
|
- <label for="featureCaption">عنوان: </label>
|
|
|
- <input type="text" class="form-control" value="{{$product->featured_image->caption}}" name="featureCaption">
|
|
|
- </p>
|
|
|
- </div>
|
|
|
+ <div class="select">
|
|
|
+ <label for="title">
|
|
|
+ {{ __('product.gallery_image') }}
|
|
|
+ </label>
|
|
|
+ <span class="btn btn-primary btn-file">
|
|
|
+ <input class="files" type="file" name="gallery_image[]" value="{{old('gallery_image[]')}}" multiple>
|
|
|
+ {{ __('product.gallery_images') }}
|
|
|
+ </span>
|
|
|
|
|
|
+ <output class="list row " >
|
|
|
+
|
|
|
+ @foreach($product->gallery_images as $upload_photo)
|
|
|
+ <div class="b">
|
|
|
+ <div class=" DeleteImages">
|
|
|
+ <a class="deleteGallary btn btn-danger pull-right position-absolute"
|
|
|
+ href="{{route('uploads.destroyFile', $upload_photo->id)}}">
|
|
|
+ <i class="icon fa fa-close"></i>
|
|
|
+ </a>
|
|
|
+ <img id="holder" class="img-thumbnail"
|
|
|
+ src="{{ \Illuminate\Support\Facades\Storage::disk('product')->url($upload_photo->path) }}"
|
|
|
+ alt=""
|
|
|
+ style="width: 200px; height: 150px;" >
|
|
|
+ <span class="form-input py-3 md-form" style="display: block;">
|
|
|
+ <label for="description">توضیحات: </label>
|
|
|
+ <input type="text" class="form-control" value="{{$upload_photo->descriptionImg}}" name="descriptionGallery[]">
|
|
|
+ <label for="caption">عنوان: </label>
|
|
|
+ <input type="text" class="form-control" value="{{$upload_photo->caption}}" name="captionGallery[]">
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ @endforeach
|
|
|
+
|
|
|
+ </output>
|
|
|
+ </div>
|
|
|
+ <div class="dropZone col-3">
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
-
|
|
|
- @error('featured_image')
|
|
|
- <span class="invalid-feedback" role="alert">
|
|
|
- <strong>{{ $message }}</strong>
|
|
|
- </span>
|
|
|
- @enderror
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="form-group photo">
|
|
|
- <label for="title">{{ __('product.photo') }}</label>
|
|
|
- <i class="required"> *</i>
|
|
|
-
|
|
|
- <input type="file" name="photo" id="photo"
|
|
|
- class="form-control photo @error('photo') is-invalid @enderror"
|
|
|
- value="{{old('photo')}}" autocomplete="photo" autofocus multiple>
|
|
|
- @error('photo')
|
|
|
- <span class="invalid-feedback" role="alert">
|
|
|
- <strong>{{ $message }}</strong>
|
|
|
- </span>
|
|
|
- @enderror
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- @foreach($product->gallery_images as $upload_photo)
|
|
|
- <div class="col-md-2">
|
|
|
- <a class="btn btn-sm btn-danger btn_photo"
|
|
|
- href="{{route('uploads.destroyFile', $upload_photo->id)}}">
|
|
|
- <i class="icon fa fa-close"></i>
|
|
|
- </a>
|
|
|
- <img id="holder" class="img-thumbnail"
|
|
|
- src="{{ \Illuminate\Support\Facades\Storage::disk('product')->url($upload_photo->path) }}"
|
|
|
- alt="">
|
|
|
- </div>
|
|
|
- @endforeach
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group mb-0">
|
|
@@ -426,335 +253,6 @@
|
|
|
</div>
|
|
|
@endslot
|
|
|
@slot('script')
|
|
|
- <script>
|
|
|
-
|
|
|
- //**************************show images gallery**********************************************
|
|
|
- $(document).ready(function(){
|
|
|
- $('.upload-widget').on('click', '.deleteGallary', function(e){
|
|
|
- e.preventDefault();
|
|
|
- $(this).closest(".DeleteImages").remove();
|
|
|
- });
|
|
|
-
|
|
|
- });
|
|
|
- var FileUploader = (function() {
|
|
|
-
|
|
|
- function FileUploader(options) {
|
|
|
- options = options || {};
|
|
|
-
|
|
|
- this.widget = document.querySelector(options.className);
|
|
|
- this.dropZone = this.widget.querySelector('.dropZone');
|
|
|
- this.input = this.widget.querySelector('.files');
|
|
|
- this.output = this.widget.querySelector('.list');
|
|
|
- };
|
|
|
-
|
|
|
-
|
|
|
- FileUploader.prototype.init = function() {
|
|
|
- var self = this;
|
|
|
-
|
|
|
- self.dropZone.addEventListener('drop', function(e) {self.handleFile(e, self);}, false);
|
|
|
- self.input.addEventListener('change', function(e) {self.handleFile(e, self);}, false);
|
|
|
- self.dropZone.addEventListener('dragover', self.handleDragOver, false);
|
|
|
- };
|
|
|
-
|
|
|
- //
|
|
|
- FileUploader.prototype.handleFile = function(evt, that) {
|
|
|
- var self = that;
|
|
|
- var files;
|
|
|
-
|
|
|
- evt.stopPropagation();
|
|
|
- evt.preventDefault();
|
|
|
-
|
|
|
- if (evt.type === 'change') {
|
|
|
- files = evt.target.files;
|
|
|
- } else if (evt.type === 'drop') {
|
|
|
- files = evt.dataTransfer.files;
|
|
|
- }
|
|
|
-
|
|
|
- self.selectLogic(files, self);
|
|
|
- };
|
|
|
-
|
|
|
-
|
|
|
- FileUploader.prototype.handleDragOver = function(evt) {
|
|
|
- evt.stopPropagation();
|
|
|
- evt.preventDefault();
|
|
|
- evt.dataTransfer.dropEffect = 'link';
|
|
|
- };
|
|
|
-
|
|
|
-
|
|
|
- FileUploader.prototype.selectLogic = function(files, that) {
|
|
|
- var self = that;
|
|
|
- var reader;
|
|
|
-
|
|
|
- for (var i = 0, file; file = files[i]; i++) {
|
|
|
-
|
|
|
- reader = new FileReader();
|
|
|
- reader.onload = (function(theFile) {
|
|
|
- return function(e) {
|
|
|
- var
|
|
|
- div = document.createElement('div'),
|
|
|
- canvas = document.createElement('canvas'),
|
|
|
- ctx = canvas.getContext('2d'),
|
|
|
- image = new Image(),
|
|
|
- ratio,
|
|
|
- thumb;
|
|
|
- div.className = 'b';
|
|
|
- image.src = e.target.result;
|
|
|
- //size image
|
|
|
- image.onload = function() {
|
|
|
- ratio = 150/image.width;
|
|
|
- ratio = 150/image.height;
|
|
|
-
|
|
|
-
|
|
|
- canvas.width = image.width * ratio;
|
|
|
- canvas.height = image.height * ratio;
|
|
|
- ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
|
|
|
-
|
|
|
- // Gallery Description Input Fields
|
|
|
- thumb = canvas.toDataURL(theFile.type);
|
|
|
-
|
|
|
- div.innerHTML = '<div class="DeleteImages">' +
|
|
|
- '<a href="" class="deleteGallary btn btn-danger pull-right position-absolute"> ' +
|
|
|
- '<i class="icon fa fa-close"></i>' +
|
|
|
- '</a>' +
|
|
|
- '<img class="thumb img-thumbnail" style="width: 200px; height: 150px;" src="' + thumb + '" title="' + escape(theFile.name) + '">' +
|
|
|
- '<span class="form-input py-3 md-form" style="display: block;"> ' +
|
|
|
- '<label for="description">توضیحات: </label>' +
|
|
|
- '<input type="text" class="form-control" name="descriptionGallery[]">\n' +
|
|
|
- '<label for="caption">عنوان: </label>' +
|
|
|
- '<input type="text" class="form-control" name="captionGallery[]">' +
|
|
|
- '</span>' +
|
|
|
- '</div>';
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- self.output.insertBefore(div, null);
|
|
|
- }
|
|
|
- })(file)
|
|
|
- reader.readAsDataURL(file);
|
|
|
- }
|
|
|
- }
|
|
|
- return FileUploader;
|
|
|
- })();
|
|
|
-
|
|
|
- var test = new FileUploader({className: '.test'});
|
|
|
- test.init();
|
|
|
-
|
|
|
- //***************FEATURE IMAGES***************************************
|
|
|
- $(document).ready(function () {
|
|
|
- $('[data-toggle="tooltip"]').tooltip({
|
|
|
- html: true
|
|
|
- });
|
|
|
- $('#deleteG').on('click' function () {
|
|
|
-
|
|
|
- $(this).closest('.preview').find('dz-preview').remove();
|
|
|
-
|
|
|
- });
|
|
|
- $('.media').addClass('hide-element');
|
|
|
- $('#imagesUploadForm').submit(function (evt) {
|
|
|
- evt.preventDefault();
|
|
|
- });
|
|
|
- $('#edit').click(function () {
|
|
|
- console.log('click detected inside circl-o of edit');
|
|
|
- $('#edit').toggleClass('fa-circle-o').toggleClass('fa-check-circle');
|
|
|
- if ($('#edit').hasClass('fa-check-circle')) {
|
|
|
- $('#captionForImage').toggleClass('hide-element');
|
|
|
- } else {
|
|
|
- $('#captionForImage').toggleClass('hide-element');
|
|
|
- }
|
|
|
- });
|
|
|
- //Delete features Image
|
|
|
- $(document).ready(function(){
|
|
|
- $('#delete').click(function(e){
|
|
|
- e.preventDefault();
|
|
|
- $(this).closest(".media").html('').hide();
|
|
|
- });
|
|
|
- /*$('#previewImages').on('click', '#delete', function(e){
|
|
|
- e.preventDefault();
|
|
|
- $(this).closest(".media").remove();
|
|
|
- });*/
|
|
|
- });
|
|
|
- //namespace variable to determine whether to continue or not
|
|
|
- var proceed = false;
|
|
|
- //Ensure that FILE API is supported by the browser to proceed
|
|
|
- if (window.File && window.FileReader && window.FileList && window.Blob) {
|
|
|
- if (window.webkitURL || window.URL) {
|
|
|
- $('#errorMessaage').removeClass('hide-element').addClass(
|
|
|
- '').html('');
|
|
|
- proceed = true;
|
|
|
- } else {
|
|
|
- $('#errorMessaage').removeClass('hide-element').addClass(
|
|
|
- 'alert-warning').html('');
|
|
|
- }
|
|
|
-
|
|
|
- } else {
|
|
|
- $('#errorMessaage').removeClass('hide-element').addClass(
|
|
|
- 'alert-warning').html('');
|
|
|
- }
|
|
|
- if (proceed) {
|
|
|
- var input = "";
|
|
|
- var formData = new FormData();
|
|
|
- $('input[name=featured_image]').on("change", function (e) {
|
|
|
- var counter = 0;
|
|
|
- var modalPreviewItems = "";
|
|
|
- input = this.files;
|
|
|
- $($(this)[0].files).each(function (i, file) {
|
|
|
- formData.append("file[]", file);
|
|
|
- });
|
|
|
- $('#previewImages').removeClass('hide-element');
|
|
|
- $('#imagesUpload').removeClass('disabled');
|
|
|
- var successUpload = 0;
|
|
|
- var failedUpload = 0;
|
|
|
- var extraFiles = 0;
|
|
|
- var size = input.length;
|
|
|
- $(input).each(function () {
|
|
|
- var reader = new FileReader();
|
|
|
- var uploadImage = this;
|
|
|
- console.log(this);
|
|
|
- reader.readAsArrayBuffer(this);
|
|
|
- reader.onload = function (e) {
|
|
|
- var magicNumbers = validateImage.magicNumbersForExtension(e);
|
|
|
- var fileSize = validateImage.isUploadedFileSizeValid(uploadImage);
|
|
|
- var extension = validateImage.uploadFileExtension(uploadImage);
|
|
|
- var isValidImage = validateImage.validateExtensionToMagicNumbers(magicNumbers);
|
|
|
- var thumbnail = validateImage.generateThumbnail(uploadImage);
|
|
|
- if (fileSize && isValidImage) {
|
|
|
- $('#' + counter).parents('.media').removeClass('hide-element');
|
|
|
- $('#' + counter).attr('src', thumbnail).height('200');
|
|
|
- $('#uploadDataInfo').removeClass('hide-element').addClass('alert-success');
|
|
|
- successUpload++;
|
|
|
- modalPreviewItems += carouselInsideModal.createItemsForSlider(thumbnail, counter);
|
|
|
-
|
|
|
- } else {
|
|
|
- $('#uploadDataInfo').removeClass('hide-element alert-success').addClass('alert-warning');
|
|
|
- failedUpload++;
|
|
|
- }
|
|
|
- counter++;
|
|
|
- if (counter === size) {
|
|
|
- $('#myCarousel').append(carouselInsideModal.createIndicators(successUpload, "myCarousel"));
|
|
|
- $('#previewItems').append(modalPreviewItems);
|
|
|
- $('#previewItems .item').first().addClass('active');
|
|
|
- $('#carouselIndicators > li').first().addClass('active');
|
|
|
- $('#myCarousel').carousel({
|
|
|
- interval: 2000,
|
|
|
- cycle: true
|
|
|
- });
|
|
|
- if (size > 4) {
|
|
|
- $('#toManyFilesUploaded').html("Only files displayed below will be uploaded");
|
|
|
- extraFiles = size - 4;
|
|
|
- }
|
|
|
-
|
|
|
- $('#filesCount').html(successUpload + " files are ready to upload");
|
|
|
- if (failedUpload !== 0 || extraFiles !== 0) {
|
|
|
- failedUpload === 0 ? "" : failedUpload;
|
|
|
- extraFiles === 0 ? "" : extraFiles;
|
|
|
- $('#filesUnsupported').html(failedUpload + extraFiles + " files were not selected for upload");
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- };
|
|
|
- });
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- var toBeDeleted = [];
|
|
|
- var eachImageValues = [];
|
|
|
- $('.media').each(function (index) {
|
|
|
- var imagePresent = "";
|
|
|
- $("body").on("click", "#delete" + index, function () {
|
|
|
- imagePresent = $("#" + index).attr('src');
|
|
|
- $("#undo" + index).removeClass('hide-element');
|
|
|
- $("#" + index).attr('src', './img/200x200.gif');
|
|
|
- $("#delete" + index).addClass('hide-element');
|
|
|
- toBeDeleted.push(index);
|
|
|
-
|
|
|
- });
|
|
|
- $("body").on("click", "#undo" + index, function () {
|
|
|
- $("#" + index).attr('src', imagePresent);
|
|
|
- $("#undo" + index).addClass('hide-element');
|
|
|
- $("#delete" + index).removeClass('hide-element');
|
|
|
- var indexToDelete = toBeDeleted.indexOf(index);
|
|
|
- if (indexToDelete > -1) {
|
|
|
- toBeDeleted.splice(indexToDelete, 1);
|
|
|
- // console.log(toBeDeleted);
|
|
|
- $("#delete" + index).parent().find('input[type="text"]').prop('disabled', false).removeClass('disabled');
|
|
|
- }
|
|
|
- if (toBeDeleted.length === 4) {
|
|
|
- $('#sendImagesToServer').prop('disabled', true).html('No Files to Upload');
|
|
|
-
|
|
|
- } else {
|
|
|
- $('#sendImagesToServer').prop('disabled', false).html('Update & Preview');
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- var validateImage = {
|
|
|
- magicNumbersForExtension: function (event) {
|
|
|
- var headerArray = (new Uint8Array(event.target.result)).subarray(0, 4);
|
|
|
- var magicNumber = "";
|
|
|
- for (var counter = 0; counter < headerArray.length; counter++) {
|
|
|
- magicNumber += headerArray[counter].toString(16);
|
|
|
- }
|
|
|
- return magicNumber;
|
|
|
- },
|
|
|
- isUploadedFileSizeValid: function (fileUploaded) {
|
|
|
- var fileSize = fileUploaded.size;
|
|
|
- var maximumSize = 2097125;
|
|
|
- var isValid = "";
|
|
|
- if (fileSize <= maximumSize) {
|
|
|
- isValid = true;
|
|
|
- } else {
|
|
|
- isValid = false;
|
|
|
- }
|
|
|
- return isValid;
|
|
|
- },
|
|
|
- uploadFileExtension: function (fileUploaded) {
|
|
|
- var fileExtension = "";
|
|
|
- var imageType = "";
|
|
|
- imageType = fileUploaded.type.toLowerCase();
|
|
|
- fileExtension = imageType.substr((imageType.lastIndexOf('/') + 1));
|
|
|
- return fileExtension;
|
|
|
- },
|
|
|
- validateExtensionToMagicNumbers: function (magicNumbers) {
|
|
|
- var properExtension = "";
|
|
|
- if (magicNumbers.toLowerCase() === "ffd8ffe0" || magicNumbers.toLowerCase() === "ffd8ffe1" ||
|
|
|
- magicNumbers.toLowerCase() === "ffd8ffe8" ||
|
|
|
- magicNumbers.toLocaleLowerCase() === "89504e47") {
|
|
|
- properExtension = true;
|
|
|
-
|
|
|
- } else {
|
|
|
- properExtension = false;
|
|
|
- }
|
|
|
- return properExtension;
|
|
|
- },
|
|
|
- generateThumbnail: function (uploadImage) {
|
|
|
- if (window.URL)
|
|
|
- imageSrc = window.URL.createObjectURL(uploadImage);
|
|
|
- else
|
|
|
- imageSrc = window.webkitURL.createObjectURL(uploadImage);
|
|
|
- return imageSrc;
|
|
|
- }
|
|
|
- };
|
|
|
- var carouselInsideModal = {
|
|
|
- createIndicators: function (carouselLength, dataTarget) {
|
|
|
- var carouselIndicators = '<ol class = "carousel-indicators" id="carouselIndicators">';
|
|
|
- for (var counter = 0; counter < carouselLength; counter++) {
|
|
|
- carouselIndicators += '<li data-target = "#' + dataTarget + '"data-slide-to="' + counter + '"></li>';
|
|
|
- }
|
|
|
- carouselIndicators += "</ol>";
|
|
|
- return carouselIndicators;
|
|
|
- },
|
|
|
- createItemsForSlider: function (imgSrc, counter) {
|
|
|
- var item = '<div class = "item">' + '<img src="' + imgSrc + '" id="preview' + counter + '" /></div>';
|
|
|
- return item;
|
|
|
- }
|
|
|
- };
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- </script>
|
|
|
@endslot
|
|
|
@endcomponent
|
|
|
|