/**
* File attachment wrapper. * * @author Htmlstream * @version 1.0 * */
;(function ($) {
'use strict'; $.HSCore.components.HSFileAttachment = { /** * * * @var Object _baseConfig */ _baseConfig: { input: '<div class="u-file-attach-v3 g-mb-15">\ <h3 class="g-font-size-16 g-color-gray-dark-v2 mb-0">Drop files here or <span class="g-color-primary">Browse your device</span></h3>\ <p class="g-font-size-14 g-color-gray-light-v2 mb-0">Maximum file size 10mb</p>\ </div>', box: '<div class="js-result-list row"></div>', item: '<div class="js-result-list__item col-md-3 text-center">\ <div class="g-pa-10 g-brd-around g-brd-gray-light-v2">\ <h3 class="g-font-size-16 g-color-gray-dark-v2 g-mb-5">{{fi-name}}</h3>\ <p class="g-font-size-12 g-color-gray-light-v2 g-mb-5">{{fi-size2}}</p>\ <div class="g-mb-10">{{fi-image}}</div>\ <div class="text-left">{{fi-progressBar}}</div>\ </div>\ </div>', itemAppend: '<div class="js-result-list__item col-md-3">\ <div class="g-pa-10 g-brd-around g-brd-gray-light-v2">\ <h3 class="g-font-size-16 g-color-gray-dark-v2 g-mb-5">{{fi-name}}</h3>\ <p class="g-font-size-12 g-color-gray-light-v2 g-mb-5">{{fi-size2}}</p>\ <div class="g-mb-10">{{fi-image}}</div>\ <div class="text-left">{{fi-progressBar}}</div>\ <div>{{fi-icon}}</div>\ <div><i class="js-result-list-item-remove fa fa-close"></i></div>\ </div>\ </div>', progressBar: '<progress class="u-progress-bar-v1"></progress>', selectors: { list: '.js-result-list', item: '.js-result-list__item', progressBar: '.u-progress-bar-v1', remove: '.js-result-list-item-remove' } }, /** * * * @var jQuery pageCollection */ pageCollection: $(), /** * Initialization of File attachment wrapper. * * @param String selector (optional) * @param Object config (optional) * * @return jQuery pageCollection - collection of initialized items. */ init: function (selector, config) { this.collection = selector && $(selector).length ? $(selector) : $(); if (!$(selector).length) return; this.config = config && $.isPlainObject(config) ? $.extend({}, this._baseConfig, config) : this._baseConfig; this.config.itemSelector = selector; this.initFileAttachment(); return this.pageCollection; }, initFileAttachment: function () { //Variables var $self = this, config = $self.config, collection = $self.pageCollection; //Actions this.collection.each(function (i, el) { //Variables var $this = $(el); $this.filer({ changeInput: config.input, showThumbs: true, templates: { box: config.box, item: config.item, itemAppend: config.itemAppend, progressBar: config.progressBar, _selectors: config.selectors, itemAppendToEnd: false, removeConfirmation: true }, dragDrop: {}, uploadFile: { url: '../../../assets/include/php/file-upload/upload.php', data: {}, type: 'POST', enctype: 'multipart/form-data', beforeSend: function () { }, success: function (data, el) { var parent = el.find(".u-progress-bar-v1").parent(); el.find(".u-progress-bar-v1").fadeOut("slow", function () { $("<div class=\"text-success g-px-10\"><i class=\"fa fa-check-circle\"></i> Success</div>").hide().appendTo(parent).fadeIn("slow"); }); }, error: function (el) { var parent = el.find(".u-progress-bar-v1").parent(); el.find(".u-progress-bar-v1").fadeOut("slow", function () { $("<div class=\"text-error g-px-10\"><i class=\"fa fa-minus-circle\"></i> Error</div>").hide().appendTo(parent).fadeIn("slow"); }); } } }); //Actions collection = collection.add($this); }); } };
})(jQuery);