https://blastcityla.com/wp-content/themes/youplay/assets/js/youplay-cf7_ver-4.9.8.js

1/*
2  Bootstrap - File Input
3  ======================
4
5  This is meant to convert all file input tags into a set of elements that displays consistently in all browsers.
6
7  Converts all
8  <input type="file">
9  into Bootstrap buttons
10  <a class="btn">Browse</a>
11
12*/
13(function($) {
14
15$.fn.bootstrapFileInput = function() {
16
17  this.each(function(i,elem){
18
19    var $elem = $(elem);
20
21    // Maybe some fields don't need to be standardized.
22    if (typeof $elem.attr('data-bfi-disabled') != 'undefined') {
23      return;
24    }
25
26    // Set the word to be displayed on the button
27    var buttonWord = 'Browse';
28
29    if (typeof $elem.attr('title') != 'undefined') {
30      buttonWord = $elem.attr('title');
31    }
32
33    var className = '';
34
35    if (!!$elem.attr('class')) {
36      className = ' ' + $elem.attr('class');
37    }
38
39    // Now we're going to wrap that input field with a Bootstrap button.
40    // The input will actually still be there, it will just be float above and transparent (done with the CSS).
41    $elem.wrap('<a class="file-input-wrapper btn btn-default ' + className + '"></a>').parent().prepend($('<span></span>').html(buttonWord));
42  })
43
44  // After we have found all of the file inputs let's apply a listener for tracking the mouse movement.
45  // This is important because the in order to give the illusion that this is a button in FF we actually need to move the button from the file input under the cursor. Ugh.
46  .promise().done( function(){
47
48    // As the cursor moves over our new Bootstrap button we need to adjust the position of the invisible file input Browse button to be under the cursor.
49    // This gives us the pointer cursor that FF denies us
50    $('.file-input-wrapper').mousemove(function(cursor) {
51
52      var input, wrapper,
53        wrapperX, wrapperY,
54        inputWidth, inputHeight,
55        cursorX, cursorY;
56
57      // This wrapper element (the button surround this file input)
58      wrapper = $(this);
59      // The invisible file input element
60      input = wrapper.find("input");
61      // The left-most position of the wrapper
62      wrapperX = wrapper.offset().left;
63      // The top-most position of the wrapper
64      wrapperY = wrapper.offset().top;
65      // The with of the browsers input field
66      inputWidth= input.width();
67      // The height of the browsers input field
68      inputHeight= input.height();
69      //The position of the cursor in the wrapper
70      cursorX = cursor.pageX;
71      cursorY = cursor.pageY;
72
73      //The positions we are to move the invisible file input
74      // The 20 at the end is an arbitrary number of pixels that we can shift the input such that cursor is not pointing at the end of the Browse button but somewhere nearer the middle
75      moveInputX = cursorX - wrapperX - inputWidth + 20;
76      // Slides the invisible input Browse button to be positioned middle under the cursor
77      moveInputY = cursorY- wrapperY - (inputHeight/2);
78
79      // Apply the positioning styles to actually move the invisible file input
80      input.css({
81        left:moveInputX,
82        top:moveInputY
83      });
84    });
85
86    $('body').on('change', '.file-input-wrapper input[type=file]', function(){
87
88      var fileName;
89      fileName = $(this).val();
90
91      // Remove any previous file names
92      $(this).parent().next('.file-input-name').remove();
93      if (!!$(this).prop('files') && $(this).prop('files').length > 1) {
94        fileName = $(this)[0].files.length+' files';
95      }
96      else {
97        fileName = fileName.substring(fileName.lastIndexOf('\\') + 1, fileName.length);
98      }
99
100      // Don't try to show the name if there is none
101      if (!fileName) {
102        return;
103      }
104
105      var selectedFileNamePlacement = $(this).data('filename-placement');
106      if (selectedFileNamePlacement === 'inside') {
107        // Print the fileName inside
108        $(this).siblings('span').html(fileName);
109        $(this).attr('title', fileName);
110      } else {
111        // Print the fileName aside (right after the the button)
112        $(this).parent().after('<span class="file-input-name">'+fileName+'</span>');
113      }
114    });
115
116  });
117
118};
119
120// Add the styles before the first stylesheet
121// This ensures they can be easily overridden with developer styles
122var cssHtml = '<style>'+
123  '.file-input-wrapper { overflow: hidden; position: relative; margin-left: 0px !important; cursor: pointer; z-index: 1; }'+
124  '.file-input-wrapper input[type=file], .file-input-wrapper input[type=file]:focus, .file-input-wrapper input[type=file]:hover { position: absolute; top: 0; left: 0; cursor: pointer; opacity: 0; filter: alpha(opacity=0); z-index: 99; outline: 0; }'+
125  '.file-input-name { margin-left: 8px; }'+
126  '.file-input-wrapper:before {margin-left: 5px; margin-right: 5px;}'+
127
128  // some youplay styles
129  '.youplay-checkbox.wpcf7-youplay-checkbox input[type=checkbox]+label:after {left: 0;}'+
130  '.youplay-radio.wpcf7-youplay-radio input[type=radio]+label:after {left: 0;}'+
131  '.youplay-checkbox.wpcf7-youplay-checkbox input[type=checkbox]+label:before {left: 4px;}'+
132  '.youplay-radio.wpcf7-youplay-radio input[type=radio]+label:before {left: 7px;}'+
133  '.wpcf7-form {padding-left: 0.5em;}'+
134  '.wpcf7-list-item.first {margin-left: 0;}'+
135  '.wpcf7-submit {margin-left: 5px !important;}'+
136  '.youplay-input.has-error:after, .youplay-textarea.has-error:after {background: rgba(255, 42, 42, 0.25);}'+
137  '.wpcf7-response-output.alert {border: none; padding: 15px;}'+
138  '</style>';
139$('link[rel=stylesheet]').eq(0).before(cssHtml);
140
141})(jQuery);
142
143
144
145/* Some corrections for Contact Form plugin (change form inputs styles) */
146!function( $ ) {
147    "use strict"
148
149  var $window = $(window);
150  var uniqID = 734;
151
152  // all inputs
153  var $input = $('input.wpcf7-text, input.wpcf7-number, input.wpcf7-date, input.wpcf7-quiz');
154  var $textarea = $('textarea.wpcf7-textarea');
155  var $select = $('select.wpcf7-select');
156  var $checkbox_radio = $('.wpcf7-checkbox [type=checkbox], input.wpcf7-acceptance, .wpcf7-radio [type=radio]');
157  var $file = $('input.wpcf7-file');
158  var $submit = $('input.wpcf7-submit');
159
160  // set youplay styles
161  $input.each(function() {
162    var $parent = $(this).parent('.wpcf7-form-control-wrap');
163    if(!$parent.length) {
164        $parent = $(this).wrap('<div>').parent();
165    }
166    $parent.css('display', 'inline-block').addClass('youplay-input');
167  })
168
169  $textarea.each(function() {
170    var $parent = $(this).parent('.wpcf7-form-control-wrap');
171    $parent.css('display', 'inline-block').addClass('youplay-textarea');
172  })
173
174  $select.each(function() {
175    var $parent = $(this).parent('.wpcf7-form-control-wrap');
176    $parent.css({
177        display: 'inline-block',
178        width: 'auto'
179    }).addClass('youplay-select');
180  })
181
182  $checkbox_radio.each(function() {
183    var is = $(this).is('[type=checkbox]')?'checkbox':'radio';
184    var id = ++uniqID;
185    var text = $(this).next('span').html() || '&nbsp;';
186    var label = $('<label>')
187    $(this).next('span').remove();
188    $(this).parent().addClass('youplay-' + is + ' wpcf7-youplay-' + is);
189    $(this).attr('id', 'youplay-' + is + '-id' + id);
190    label.insertAfter(this).attr('for', 'youplay-' + is + '-id' + id).html(text);
191  })
192
193  $file.bootstrapFileInput();
194
195  $submit.each(function() {
196    var className = $(this).attr('class') + ' btn';
197    if(!/btn-/g.test(className)) {
198      className += ' btn-default';
199    }
200    $(this).after('<button type="submit" class="' + className + '">' + $(this).val() + '</button>')
201    $(this).remove();
202  })
203
204
205    // add Bootstrap Alert classes to response output
206    $( function() {

207        $( 'div.wpcf7' ).on( 'invalid.wpcf7', function() {
208            $( this ).find( 'div.wpcf7-response-output' ).addClass('alert alert-warning' );
209        });
210        $( 'div.wpcf7' ).on( 'spam.wpcf7', function() {
211            $( this ).find( 'div.wpcf7-response-output' ).addClass('alert alert-warning' );
212        });
213        $( 'div.wpcf7' ).on( 'mailsent.wpcf7', function() {
214            $( this ).find( 'div.wpcf7-response-output' ).addClass('alert alert-success' );
215        });
216        $( 'div.wpcf7' ).on( 'mailfailed.wpcf7', function() {
217            $( this ).find( 'div.wpcf7-response-output' ).addClass('alert alert-danger' );
218        });
219    });
220
221    // WPCF7 Function Override: Adjusted for Bootstrap Help Block Output and Status Class
222    $.fn.wpcf7NotValidTip = function( message ) {
223        return this.each( function() {
224            var $into = $( this );
225            $into.addClass( 'has-error' );
226            $into.find( 'span.wpcf7-not-valid-tip' ).remove();
227            $into.before( '<span class="help-block wpcf7-not-valid-tip">' + message + '</span>' );
228            $into.slideDown( 'fast' );
229
230            if ( $into.is( '.use-floating-validation-tip *' ) ) {
231                $( '.wpcf7-not-valid-tip', $into ).mouseover( function() {
232                    $( this ).wpcf7FadeOut();
233                });
234
235                $( ':input', $into ).focus( function() {
236                    $( '.wpcf7-not-valid-tip', $into ).not( ':hidden' ).wpcf7FadeOut();
237                });
238            }
239        });
240    };
241
242    // WPCF7 Function Override: Different DOM Element is required
243    $.fn.wpcf7RefillQuiz = function( quiz ) {
244        return this.each( function() {
245            var form = $( this );
246
247            $.each( quiz, function( i, n ) {
248                form.find( ':input[name="' + i + '"]' ).clearFields();
249                form.find( ':input[name="' + i + '"]' ).siblings( 'p.wpcf7-quiz-label' ).text( n[0] );

250                form.find( 'input:hidden[name="_wpcf7_quiz_answer_' + i + '"]' ).attr( 'value', n[1] );
251            });
252        });
253    };
254
255    // WPCF7 Function Override: Adjusted for Bootstrap Alert classes and Status Class
256    $.fn.wpcf7ClearResponseOutput = function() {
257        return this.each(function() {
258            $( this ).find( 'div.alert' ).hide().empty().removeClass( 'wpcf7-mail-sent-ok wpcf7-mail-sent-ng wpcf7-validation-errors wpcf7-spam-blocked alert-warning alert-success alert-danger' ).removeAttr( 'role' );
259            $( this ).find( '.has-error' ).removeClass( 'has-error' );
260            $( this ).find( 'span.wpcf7-not-valid-tip' ).remove();
261            $( this ).find( 'img.ajax-loader' ).css({ visibility: 'hidden' });
262        });
263    };
264}( jQuery );