Animate It! - Version 1.4.0

Version Description

Download this release

Release Info

Developer eleopard
Plugin Icon 128x128 Animate It!
Version 1.4.0
Comparing to
See all releases

Code changes from version 1.3.3 to 1.4.0

Files changed (5) hide show
  1. assets/css/style.css +1 -7
  2. assets/helper/eds_tinymce_popup.php +62 -23
  3. assets/js/viewportchecker.js +9 -4
  4. edsanimate.php +9 -5
  5. readme.txt +7 -2
assets/css/style.css CHANGED
@@ -12,10 +12,6 @@
12
  }
13
 
14
  input, select, button, textarea {
15
- -webkit-appearance: none;
16
- -moz-appearance: none;
17
- appearance: none;
18
-
19
  font: inherit;
20
  font-size: 16px !important;
21
  color: inherit;
@@ -90,9 +86,7 @@ input, select, button, textarea {
90
  border: 1px solid #c0c8c9;
91
  }
92
 
93
- .input--dropdown {
94
- background-image: url("images/ddown.png");
95
- background-image: url("images/ddown.svg?3"), none;
96
  background-repeat: no-repeat;
97
  background-size: 1.5rem 1rem;
98
  background-position: right center;
12
  }
13
 
14
  input, select, button, textarea {
 
 
 
 
15
  font: inherit;
16
  font-size: 16px !important;
17
  color: inherit;
86
  border: 1px solid #c0c8c9;
87
  }
88
 
89
+ .input--dropdown {
 
 
90
  background-repeat: no-repeat;
91
  background-size: 1.5rem 1rem;
92
  background-position: right center;
assets/helper/eds_tinymce_popup.php CHANGED
@@ -193,13 +193,7 @@
193
  <br/>
194
  <i>(Please select any one option)</i>
195
  </td>
196
- </tr>
197
- <tr>
198
- <td>Scroll: </td>
199
- <td colspan="2">
200
- <input type="radio" data-size="large" name="eds_animate_on" value="scroll" data-on-text="Yes" data-off-text="No" data-radio-all-off="true" />
201
- </td>
202
- </tr>
203
  <tr>
204
  <td>Click: </td>
205
  <td colspan="2">
@@ -212,10 +206,25 @@
212
  <input type="radio" data-size="large" name="eds_animate_on" value="hover" data-on-text="Yes" data-off-text="No" data-radio-all-off="true" />
213
  </td>
214
  </tr>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
215
  <tr>
216
  <td colspan="3" style="text-align: center;">
217
- <button class="butt button-animate-it-green" onClick="insertEDSAnimate()">Insert</button>
218
- <button class="butt button-animate-it-cancel" onclick="tinyMCEPopup.close();">Cancel</button>
219
  </td>
220
  </tr>
221
  <tr>
@@ -237,27 +246,49 @@
237
  };
238
 
239
  $(document).ready(function(){
240
- $("input[name=eds_infinite]").bootstrapSwitch();
241
- $("input[name=eds_animate_on]").bootstrapSwitch();
242
- $('.js--triggerAnimation').click(function(e){
243
- e.preventDefault();
244
- var anim = $('.js--animations').val();
245
- testAnim(anim);
246
- });
247
-
248
- $('.js--animations').change(function(){
249
- var anim = $(this).val();
250
- testAnim(anim);
251
- });
 
 
 
 
 
 
 
 
 
 
 
 
252
  });
253
 
254
  </script>
 
255
  <script type= "text/javascript">
256
  function insertEDSAnimate()
257
  {
258
  var shortCode = "[edsanimate animation=\"";
259
  var hForm = document.edsanimate_form;
260
  var animate_on = "";
 
 
 
 
 
 
 
 
 
261
 
262
  shortCode += hForm.eds_style.value + "\" " ;
263
  if( hForm.eds_delay.value!="")
@@ -270,10 +301,18 @@
270
 
271
  animate_on = $('input[name=eds_animate_on]:radio:checked').val();
272
 
 
273
  if(animate_on != null)
274
- shortCode += ' animate_on="'+animate_on+'"] ';
275
  else
276
- shortCode += ' animate_on=""] ';
 
 
 
 
 
 
 
277
 
278
  shortCode += "<h3>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</h3><p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type</p>";
279
 
193
  <br/>
194
  <i>(Please select any one option)</i>
195
  </td>
196
+ </tr>
 
 
 
 
 
 
197
  <tr>
198
  <td>Click: </td>
199
  <td colspan="2">
206
  <input type="radio" data-size="large" name="eds_animate_on" value="hover" data-on-text="Yes" data-off-text="No" data-radio-all-off="true" />
207
  </td>
208
  </tr>
209
+ <tr>
210
+ <td>Scroll: </td>
211
+ <td colspan="2">
212
+ <input type="radio" data-size="large" name="eds_animate_on" value="scroll" data-on-text="Yes" data-off-text="No" data-radio-all-off="true" />
213
+ </td>
214
+ </tr>
215
+
216
+ <tr class="scroll_offset_wrapper">
217
+ <td>Scroll Offset (in %): </td>
218
+ <td colspan="2">
219
+ <input class="input" type="text" name="scroll_offset" id="scroll_offset" value="" />
220
+ </td>
221
+ </tr>
222
+
223
+
224
  <tr>
225
  <td colspan="3" style="text-align: center;">
226
+ <button type="button" class="butt button-animate-it-green" onClick="insertEDSAnimate()">Insert</button>
227
+ <button type="button" class="butt button-animate-it-cancel" onclick="tinyMCEPopup.close();">Cancel</button>
228
  </td>
229
  </tr>
230
  <tr>
246
  };
247
 
248
  $(document).ready(function(){
249
+ $(".scroll_offset_wrapper").hide();
250
+ $("input[name=eds_infinite]").bootstrapSwitch();
251
+ $("input[name=eds_animate_on]").bootstrapSwitch();
252
+
253
+ $('input[name="eds_animate_on"]').on('switchChange.bootstrapSwitch', function(event, state) {
254
+ if($('input[name=eds_animate_on]:radio:checked').val()!= null &&
255
+ $('input[name=eds_animate_on]:radio:checked').val() == 'scroll')
256
+ $(".scroll_offset_wrapper").show(500);
257
+ else
258
+ $(".scroll_offset_wrapper").hide(500);
259
+
260
+ });
261
+
262
+
263
+ $('.js--triggerAnimation').click(function(e){
264
+ e.preventDefault();
265
+ var anim = $('.js--animations').val();
266
+ testAnim(anim);
267
+ });
268
+
269
+ $('.js--animations').change(function(){
270
+ var anim = $(this).val();
271
+ testAnim(anim);
272
+ });
273
  });
274
 
275
  </script>
276
+
277
  <script type= "text/javascript">
278
  function insertEDSAnimate()
279
  {
280
  var shortCode = "[edsanimate animation=\"";
281
  var hForm = document.edsanimate_form;
282
  var animate_on = "";
283
+
284
+
285
+ var scroll_offset = hForm.scroll_offset.value;
286
+
287
+ if($('input[name=eds_animate_on]:radio:checked').val() == 'scroll' &&
288
+ scroll_offset != '' && isNaN(scroll_offset)){
289
+ alert("Scroll Offset should be a number");
290
+ return false;
291
+ }
292
 
293
  shortCode += hForm.eds_style.value + "\" " ;
294
  if( hForm.eds_delay.value!="")
301
 
302
  animate_on = $('input[name=eds_animate_on]:radio:checked').val();
303
 
304
+
305
  if(animate_on != null)
306
+ shortCode += ' animate_on="'+animate_on+'" ';
307
  else
308
+ shortCode += ' animate_on="" ';
309
+
310
+
311
+ if(animate_on=='scroll' && scroll_offset!= '')
312
+ shortCode += ' scroll_offset="'+scroll_offset+'" ';
313
+
314
+
315
+ shortCode += ']';
316
 
317
  shortCode += "<h3>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</h3><p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type</p>";
318
 
assets/js/viewportchecker.js CHANGED
@@ -20,14 +20,20 @@
20
 
21
  $elem.each(function(){
22
  var $obj = $(this);
 
23
 
24
  if ($obj.hasClass(options.classToAdd)){
25
  return;
26
  }
27
 
28
-
29
- var elemTop = Math.round( $obj.offset().top ) + Math.round(options.offset * $obj.height() * 0.01),
30
- elemBottom = elemTop + ($obj.height());
 
 
 
 
 
31
 
32
  // Add class if in viewport
33
  if ((elemTop < viewportBottom) && (elemBottom > viewportTop)){
@@ -38,7 +44,6 @@
38
  }
39
  });
40
  };
41
-
42
 
43
  $(window).scroll(this.checkElements);
44
  this.checkElements();
20
 
21
  $elem.each(function(){
22
  var $obj = $(this);
23
+ var scroll_offset = $obj.attr('eds_scroll_offset');
24
 
25
  if ($obj.hasClass(options.classToAdd)){
26
  return;
27
  }
28
 
29
+ var elemTop = '';
30
+ if(scroll_offset != null && scroll_offset != ''){
31
+ elemTop = Math.round( $obj.offset().top ) + Math.round(Number(scroll_offset) * $obj.height() * 0.01),
32
+ elemBottom = elemTop + ($obj.height());
33
+ }else{
34
+ elemTop = Math.round( $obj.offset().top ) + Math.round(options.offset * $obj.height() * 0.01),
35
+ elemBottom = elemTop + ($obj.height());
36
+ }
37
 
38
  // Add class if in viewport
39
  if ((elemTop < viewportBottom) && (elemBottom > viewportTop)){
44
  }
45
  });
46
  };
 
47
 
48
  $(window).scroll(this.checkElements);
49
  this.checkElements();
edsanimate.php CHANGED
@@ -3,7 +3,7 @@
3
  * Plugin Name: Animate It!
4
  * Plugin URI: http://www.eleopard.in
5
  * Description: It will allow user to add CSS Animations
6
- * Version: 1.3.3
7
  * Author: eLEOPARD Design Studios
8
  * Author URI: http://www.eleopard.in
9
  * License: GNU General Public License version 2 or later; see LICENSE.txt
@@ -213,7 +213,8 @@ function edsanimate_handler( $attributes, $content = null ) {
213
  'delay' => '',
214
  'duration' => '',
215
  'infinite_animation' =>'',
216
- 'animate_on' => ''
 
217
  ), $attributes ) );
218
 
219
 
@@ -242,10 +243,13 @@ function edsanimate_handler( $attributes, $content = null ) {
242
  else if(strcasecmp($animate_on, 'hover')==0)
243
  $classString .= " eds-on-hover";
244
 
245
-
246
- return '<div class="'.$classString.'">'.do_shortcode($content).'</div>';
 
 
 
247
  else:
248
- return do_shortcode($content);
249
  endif;
250
 
251
  }
3
  * Plugin Name: Animate It!
4
  * Plugin URI: http://www.eleopard.in
5
  * Description: It will allow user to add CSS Animations
6
+ * Version: 1.4.0
7
  * Author: eLEOPARD Design Studios
8
  * Author URI: http://www.eleopard.in
9
  * License: GNU General Public License version 2 or later; see LICENSE.txt
213
  'delay' => '',
214
  'duration' => '',
215
  'infinite_animation' =>'',
216
+ 'animate_on' => '',
217
+ 'scroll_offset' => ''
218
  ), $attributes ) );
219
 
220
 
243
  else if(strcasecmp($animate_on, 'hover')==0)
244
  $classString .= " eds-on-hover";
245
 
246
+ if(isset($scroll_offset) && $scroll_offset!=''){
247
+ return '<div class="'.$classString.'" eds_scroll_offset="'.$scroll_offset.'">'.$content.'</div>';
248
+ }else
249
+ return '<div class="'.$classString.'">'.$content.'</div>';
250
+
251
  else:
252
+ return $content;
253
  endif;
254
 
255
  }
readme.txt CHANGED
@@ -2,8 +2,8 @@
2
  Contributors: eleopard
3
  Tags: css3 animation, animate.css, jquery, on scroll animation, delay animation
4
  Requires at least: 3.0
5
- Tested up to: 4.0
6
- Stable tag: 1.3.3
7
  License: GNU General Public License version 2 or later
8
  License URI: http://www.gnu.org/copyleft/gpl.html
9
 
@@ -21,6 +21,7 @@ Some of the Key features Include:
21
  * Allowing user to apply CSS3 animations on WordPress Posts and Text Widgets
22
  * 50+ Entry, Exit and Attention Seeker Animations
23
  * Capability to apply animation on Scroll
 
24
  * Capability to apply animation on Hover
25
  * Capability to apply animation on Click
26
  * Provide special CSS delay classes to create a nice animation sequence on pages and posts
@@ -64,6 +65,10 @@ Percentage scroll offset can be set from Settings-> Animate It! menu in the admi
64
 
65
  == Changelog ==
66
 
 
 
 
 
67
  = Version 1.3.3 =
68
  * Resolved issue related to nested shortcodes.
69
 
2
  Contributors: eleopard
3
  Tags: css3 animation, animate.css, jquery, on scroll animation, delay animation
4
  Requires at least: 3.0
5
+ Tested up to: 4.1.1
6
+ Stable tag: 1.4.0
7
  License: GNU General Public License version 2 or later
8
  License URI: http://www.gnu.org/copyleft/gpl.html
9
 
21
  * Allowing user to apply CSS3 animations on WordPress Posts and Text Widgets
22
  * 50+ Entry, Exit and Attention Seeker Animations
23
  * Capability to apply animation on Scroll
24
+ * Capability to add different scroll offset on individual animation blocks
25
  * Capability to apply animation on Hover
26
  * Capability to apply animation on Click
27
  * Provide special CSS delay classes to create a nice animation sequence on pages and posts
65
 
66
  == Changelog ==
67
 
68
+ = Version 1.4.0 =
69
+ * Resolved issue related to CSS.
70
+ * New feature that will allow user to add different scroll offset on individual animation blocks.
71
+
72
  = Version 1.3.3 =
73
  * Resolved issue related to nested shortcodes.
74