https://wslr.org/wp-content/plugins/smart-forms/pr/js/form_element_extensions/form-element-extensions.js?ver=5

1function SmartFormsPRAddExtension(elementName)
2{
3    sfFormElementBase.Extensions.push({Name:elementName,Create:function(options){return new sfFileUpload(options)}});
4}
5
6SmartFormsPRAddExtension('sfFileUpload');
7/************************************************************************************* File Upload ***************************************************************************************************/
8function sfFileUpload(options)
9{
10    sfFormElementBase.call(this,options);
11    this.Title="Title";
12
13    if(this.IsNew)
14    {
15        this.Options.ClassName="sfFileUpload";
16        this.Options.Title="Title";
17        this.Options.Label="Upload File";
18        this.Options.Multiple="n";
19        this.Options.IsRequired="n";
20        this.Options.Placeholder='Choose a file';
21        this.Options.MaximumFileSize='0';
22        this.Options.MaximumFileSizeMessage='Invalid file size';
23        this.Options.UploadButton='Upload Button';
24        this.Options.AllowedExtensions='';
25    }else{
26        this.SetDefaultIfUndefined('Placeholder','Choose a file');
27        this.SetDefaultIfUndefined('MaximumFileSizeMessage','Invalid file size');
28        this.SetDefaultIfUndefined('UploadButton','Upload');
29        this.SetDefaultIfUndefined('MaximumFileSize','0');
30        this.SetDefaultIfUndefined('AllowedExtensions','*.*');
31
32    }
33
34
35}
36
37sfFileUpload.prototype=Object.create(sfFormElementBase.prototype);
38
39sfFileUpload.prototype.CreateProperties=function()
40{
41
42    this.Properties.push(new PropertyContainer('general','General').AddProperties([
43        new SimpleTextProperty(this,this.Options,"Label","Label",{ManipulatorType:'basic'}),
44        new SimpleTextProperty(this,this.Options,"AllowedExtensions","Allowed Extensions",{ManipulatorType:'basic',Notes:'Add the extensions separated by comma, e.g. .jpeg,.png'}),
45        new SimpleTextProperty(this,this.Options,"MaximumFileSize","Maximum File Size (in mb)",{ManipulatorType:'basic',Notes:'0 for no maximum, your might also need to <a href="https://www.bitcatcha.com/blog/increase-maximum-upload-file-size-in-wordpress/">configure</a> your site to allow big files'}),
46        new SimpleTextProperty(this,this.Options,"MaximumFileSizeMessage","Maximum File Size Message",{ManipulatorType:'basic'}),
47        new SimpleTextProperty(this,this.Options,"Placeholder","Placeholder",{ManipulatorType:'basic'}),
48        new SimpleTextProperty(this,this.Options,"UploadButton","Upload Button",{ManipulatorType:'basic'}),
49        new CheckBoxProperty(this,this.Options,"IsRequired","Required",{ManipulatorType:'basic'}),
50        new CheckBoxProperty(this,this.Options,"Multiple","Multiple files",{ManipulatorType:'basic'}),
51        new IdProperty(this,this.Options)
52    ]));
53
54};
55
56sfFileUpload.prototype.GenerateInlineElement=function()
57{
58    return '<div class="rednao_label_container col-sm-3"><label class="rednao_control_label" >'+this.Options.Label+'</label></div>\
59            <div class="redNaoControls col-sm-9"></div>';
60};
61
62
63sfFileUpload.prototype.GetFileUploadComponent=function(jQueryFileContainer)
64{
65    var component= rnJQuery('<div class="sfUploadFileElement input-group">\
66                                <input class="sfUploadFilePath form-control" placeholder="'+RedNaoEscapeHtml(this.Options.Placeholder)+'" disabled="disabled" type="text" />\
67                                <span class="sfUploadFileContainer input-group-addon">\
68                                    <span class="sfUploadFileButtonText">'+RedNaoEscapeHtml(this.Options.UploadButton)+'</span>\
69                                    <input accept="'+this.Options.AllowedExtensions+'" class="sfUploadFileButton" type="file" name="'+this.Id+'" class="upload"/>\
70                                </span>\
71                              <div class="sfDeleteButton sfDeletebutton_invisible" style="display: table-cell !important"></div></div>');
72
73    var self=this;
74    var clickEvent;
75    component.find('.sfUploadFileButton').click(function(){
76        component.closest('.form-group').addClass('is-focused');
77        clickEvent=function(event){
78            if(event.target!=component.find('.sfUploadFileButton')[0])
79            {
80                component.closest('.form-group').removeClass('is-focused');
81                rnJQuery('body').unbind('click', clickEvent);
82            }
83        };
84        rnJQuery('body').click(clickEvent);
85    });

86
87    var me=this;
88    component.find('.sfUploadFileButton').change(
89    function(e){
90        rnJQuery('body').unbind('click',clickEvent);
91        component.closest('.form-group').removeClass('is-focused');
92        var selectedPath=component.find('.sfUploadFileButton').val();
93
94        let maximumFileSize=Number(me.Options.MaximumFileSize);
95        if(isNaN(maximumFileSize))
96            maximumFileSize=0;
97
98        if(e.target.files.length>0&&maximumFileSize>0)
99        {
100            let size=e.target.files[0].size;
101            if(size>0&&e.target.files[0].size/1048576.0>maximumFileSize)
102            {
103                alert(me.Options.MaximumFileSizeMessage);
104                e.target.value='';
105                return;
106            }
107        }
108
109        if(e.target.files.length>0) {
110            let name = e.target.files[0].name;
111            let extensions = me.Options.AllowedExtensions.trim().split(',');
112            if (extensions.length > 0) {
113                if (!extensions.some(x => name.endsWith(x.toLowerCase().trim()))) {
114                    alert('Invalid file type');
115                    e.target.value = '';
116                    return;
117                }
118            }
119        }
120
121
122        var index=selectedPath.lastIndexOf('\\');
123        if(index>=0)
124        {
125            selectedPath=selectedPath.substring(index+1);
126        }
127        component.find('.sfUploadFilePath').val(selectedPath);
128        if(selectedPath=="")
129        {
130            component.find(".sfDeleteButton").removeClass("sfDeleteButton_visible").addClass("sfDeleteButton_invisible");
131            self.DeleteComponent(component);
132        }
133        else
134        {
135            component.find(".sfDeleteButton").removeClass("sfDeleteButton_invisible").addClass("sfDeleteButton_visible");
136            if(self.Options.Multiple=="y")
137            {
138                var emptyElements=0;
139                rnJQuery('#'+self.Id+ ' .sfUploadFileButton').each(
140                    function()
141                    {
142                        if(rnJQuery(this).val()=="")
143                        {
144                            emptyElements++;
145                        }
146                    }
147                );
148                if(emptyElements==0)
149                    self.AppendComponent(jQueryFileContainer)
150            }
151        }
152    });
153
154    component.find(".sfDeleteButton").click(
155    function()
156    {
157        self.DeleteComponent(component);
158    });
159    return component;
160};
161
162sfFileUpload.prototype.DeleteComponent=function(component)
163{
164
165
166    if(this.JQueryElement.find('.sfUploadFileButton').length>1)
167        component.remove();
168    else{
169        this.JQueryElement.find( '.sfUploadFileButton').val('');
170        this.JQueryElement.find('.sfUploadFilePath').val('');
171
172
173    }
174};
175
176sfFileUpload.prototype.GenerationCompleted=function(jQueryElement)
177{
178    this.AppendComponent(jQueryElement);
179};
180
181sfFileUpload.prototype.AppendComponent=function(jQueryElement)
182{
183    var fileUploadComponent=this.GetFileUploadComponent(jQueryElement);
184    jQueryElement.find('.redNaoControls').append(fileUploadComponent);
185    if(smartFormsDesignMode)
186    {
187        jQueryElement.find('.sfUploadFilePath').removeAttr('disabled');
188        jQueryElement.find('.sfUploadFileButton').remove();
189    }
190
191    jQueryElement.find('.sfUploadFileElement').removeClass('sfUploadFilePathMargin');
192    jQueryElement.find('.sfUploadFileElement:not(:last-child)').addClass('sfUploadFilePathMargin');
193};
194
195sfFileUpload.prototype.GetValueString=function () {
196    var data= [];
197    var count=1;
198    var self=this;
199    if(this.IsIgnored())
200        return [];
201    this.JQueryElement.find('.sfUploadFileButton').each(function()
202    {
203        var jqueryFileElement=rnJQuery(this);
204        if(rnJQuery.trim(jqueryFileElement.val())!="")
205        {
206            var fieldName="sfufn"+"@"+self.Id+"@"+count.toString();
207            jqueryFileElement.attr('name',fieldName);
208            data.push( {path:fieldName});
209            count++;
210        }else
211            jqueryFileElement.removeAttr('name');
212    });

213
214    return data;
215
216};
217
218sfFileUpload.prototype.IsValid=function()
219{
220    if(this.Options.IsRequired=='n')
221        return true;
222
223    var isValid=false;
224    this.JQueryElement.find('.sfUploadFileButton').each(
225        function()
226        {
227            if(rnJQuery(this).val()!="")
228            {
229                isValid=true;
230            }
231        }
232    );
233
234    if(isValid)
235        return true;
236
237    var self=this;
238    this.JQueryElement.find('.sfUploadFileButton').each(
239        function()
240        {
241            if(rnJQuery(this).val()=="")
242            {
243                rnJQuery('#'+self.Id).addClass('has-error');
244                isValid=false;
245            }
246        }
247    );
248
249    return false;
250};
251
252sfFileUpload.prototype.StoresInformation=function()
253{
254    return true;
255};