1/** 2 * Shortcode Skills 3 * 4 * @package ThemeREX Addons 5 * @since v1.2 6 */ 7 8/* global jQuery, TRX_ADDONS_STORAGE */ 9 10(function() { 11 12 "use strict"; 13 14 var $document = jQuery( document ); 15 16 $document.on( 'action.init_trx_addons', function() { 17 18 var $skills_items, 19 $skills_canvas; 20 21 // Update links and values after the new post added 22 $document.on( 'action.init_hidden_elements', update_jquery_links ); 23 $document.on( 'action.got_ajax_response', update_jquery_links ); 24 var first_run = true; 25 function update_jquery_links(e) { 26 if ( first_run && e && e.namespace == 'init_hidden_elements' ) { 27 first_run = false; 28 return; 29 } 30 $skills_canvas = jQuery( '.sc_skills_pie canvas' ); 31 $skills_items = jQuery( '.sc_skills_item' ); 32 if ($skills_items.length > 0 ) { 33 trx_addons_intersection_observer_add( $skills_items, function( item, enter ) { 34 if ( enter ) { 35 trx_addons_intersection_observer_remove( item ); 36 trx_addons_sc_skills_init(); 37 } 38 } ); 39 } 40 } 41 update_jquery_links(); 42 43 $document 44 .on( 'action.init_hidden_elements', trx_addons_sc_skills_init ) 45 .on( 'action.scroll_trx_addons', trx_addons_sc_skills_init ) 46 .on( 'action.resize_trx_addons', trx_addons_sc_skills_resize ); 47 48 // Skills init 49 function trx_addons_sc_skills_init(e, container) { 50 if ( $skills_items.length === 0 ) return; 51 52 $skills_items.each(function(idx) { 53 var skillsItem = $skills_items.eq(idx); 54 // If item now invisible or inited 55 if ( skillsItem.hasClass('inited') || ! skillsItem.hasClass('trx_addons_in_viewport') || skillsItem.parents('div:hidden,article:hidden').length > 0 ) { 56 return; 57 } 58 var init_ok = true; 59 var skills = skillsItem.parents('.sc_skills').eq(0); 60 var type = skills.data('type'); 61 var total = (type=='pie' && skills.hasClass('sc_skills_compact_on')) 62 ? skillsItem.find('.sc_skills_data .pie') 63 : skillsItem.find('.sc_skills_total').eq(0); 64 var start = parseFloat(total.data('start')); 65 var stop = parseFloat(total.data('stop')); 66 var maximum = parseInt(total.data('max'), 10); 67 var startPercent = Math.round(start/maximum*100); 68 var stopPercent = Math.round(stop/maximum*100); 69 var ed = total.data('ed'); 70 var speed = parseInt(total.data('speed'), 10); 71 var step = parseFloat(total.data('step')); 72 var duration = parseInt(total.data('duration'), 10); 73 if (isNaN(duration)) { 74 duration = Math.ceil(maximum/step)*speed; 75 total.data('duration', duration); 76 } 77 total.data('decimals', Math.max( 78 0, 79 start!=parseInt(start, 10) ? (''+start).length - 1 - (''+parseInt(start, 10)).length : 0, 80 stop!=parseInt(stop, 10) ? (''+stop).length - 1 - (''+parseInt(stop, 10)).length : 0 81 ) 82 ); 83 84 if (type == 'bar') { 85 var dir = skills.data('dir'); 86 var count = skillsItem.find('.sc_skills_count').eq(0); 87 if (dir=='horizontal') { 88 count.css('width', startPercent + '%').animate({ width: stopPercent + '%' }, duration); 89 } else if (dir=='vertical') { 90 count.css('height', startPercent + '%').animate({ height: stopPercent + '%' }, duration); 91 } 92 trx_addons_sc_skills_animate_counter(start, stop, speed, step, ed, total); 93 94 } else if (type == 'counter') { 95 trx_addons_sc_skills_animate_counter(start, stop, speed, step, ed, total); 96 97 } else if (type == 'pie') { 98 if (window.ChartLegacy) { 99 var steps = parseInt(total.data('steps'), 10); 100 var bg_color = total.data('bg_color'); 101 var border_color = total.data('border_color'); 102 var cutout = parseInt(total.data('cutout'), 10); 103 var easing = total.data('easing'); 104 var options = trx_addons_apply_filters('trx_addons_filter_skills_pie_options', { 105 segmentShowStroke: border_color !== '', 106 segmentStrokeColor: border_color, 107 segmentStrokeWidth: border_color !== '' ? 1 : 0, 108 percentageInnerCutout: cutout, 109 animation: true, //skillsItem.parents('.vc_row[data-vc-full-width="true"]').length==0, 110 animationSteps: steps, 111 animationEasing: easing, 112 animateRotate: true, 113 animateScale: true //skillsItem.parents('.vc_row[data-vc-full-width="true"]').length==0, 114 } ); 115 var pieData = []; 116 total.each(function() { 117 var color = jQuery(this).data('color');
118 var stop = parseInt(jQuery(this).data('stop'), 10); 119 var stopPercent = Math.round(stop/maximum*100); 120 pieData.push({ 121 value: stopPercent, 122 color: color 123 }); 124 }); 125 if (total.length == 1) { 126 trx_addons_sc_skills_animate_counter(start, stop, Math.round(1500/steps), step, ed, total); 127 pieData.push({ 128 value: 100-stopPercent, 129 color: bg_color 130 }); 131 } 132 var canvas = skillsItem.find('canvas'); 133 canvas 134 .data('pie-data', pieData) 135 .data('pie-options', options) 136 .attr({width: skillsItem.width(), height: skillsItem.width()}) 137 .css({width: skillsItem.width(), height: skillsItem.height()}); 138 new ChartLegacy(canvas.get(0).getContext("2d")).Doughnut(pieData, options); 139 } else { 140 init_ok = false; 141 } 142 } 143 if (init_ok) skillsItem.addClass('inited'); 144 }); 145 } 146 147 // Skills counter animation 148 function trx_addons_sc_skills_animate_counter(start, stop, speed, step, ed, total) { 149 start = Math.min(stop, start+step); 150 // Example of format output number: leave 2 decimals and separate it with ',' and use dot '.' as thousands delimiter 151 //total.text(Number(start).formatMoney(2, ',', '.')+ed); 152 var style = total.data('style') || 'counter'; 153 if ( style == 'odometer' ) { 154 var digits = total.find('.sc_skills_digit'), 155 duration = total.data('duration'); 156 digits.each( function(idx, item) { 157 var $self = digits.eq(idx); 158 if ( ! $self.data('rounds') ) { 159 var rounds = idx*10 + (''+stop).substring(idx, idx+1) * 1, 160 delay = Math.floor( ( duration - 300 ) / Math.max( 1, rounds ) ); 161 $self.data( { 162 'rounds': rounds, 163 'round': 0, 164 'skip': 0, 165 'delay': delay 166 } ); 167 } 168 trx_addons_sc_skills_animate_digit($self, idx); 169 } ); 170 } else { // style == 'counter' 171 total.text( trx_addons_round_number( start, total.data('decimals') ) + ed ); 172 if (start < stop) { 173 setTimeout(function () { 174 trx_addons_sc_skills_animate_counter(start, stop, speed, step, ed, total); 175 }, speed); 176 } 177 } 178 } 179 180 // Animate one digit in the odometer 181 function trx_addons_sc_skills_animate_digit($self, idx) { 182 var $ribbon = $self.find('.sc_skills_digit_ribbon'), 183 $value = $self.find('.sc_skills_digit_value'), 184 rounds = $self.data('rounds'), 185 round = $self.data('round'), 186 skip = $self.data('skip'), 187 delay = $self.data('delay') + ( round < rounds ? 0 : 300 ); 188 if ( round < rounds ) { 189 if ( skip++ < idx ) { 190 $self.data('skip', skip); 191 setTimeout( function() { 192 trx_addons_sc_skills_animate_digit($self, idx); 193 }, delay ); 194 } else { 195 round++; 196 var $next = $value.clone(); 197 $next.html( round % 10 ); 198 $value.after( $next ); 199 $ribbon.animate( { 200 'top': -$value.height()+'px' 201 }, 202 delay, 203 'linear', 204 function() { 205 $value.remove(); 206 $ribbon.css('top', 0); 207 trx_addons_sc_skills_animate_digit($self, idx); 208 } 209 ); 210 $self.data('round', round); 211 } 212 } 213 } 214 215 // Resize Pie Skills 216 function trx_addons_sc_skills_resize() { 217 218 if ( $skills_canvas.length == 0 ) return; 219 220 $skills_canvas.each(function () { 221 var canvas = jQuery(this); 222 // If item now invisible 223 if ( ! window.ChartLegacy || canvas.parents('div:hidden,article:hidden').length > 0 ) { 224 return; 225 } 226 var skillsItem = canvas.parent(); 227 if (skillsItem.width() != canvas.width()) { 228 var data = canvas.data('pie-data'); 229 var opt = canvas.data('pie-options'); 230 if (data === undefined || opt === undefined) return; 231 canvas.empty() 232 .attr({width: skillsItem.width(), height: skillsItem.width()}) 233 .css({width: skillsItem.width(), height: skillsItem.height()}); 234 opt.animation = false; 235 new ChartLegacy(canvas.get(0).getContext("2d")).Doughnut(data, opt); 236 } 237 }); 238 } 239 240 } ); 241 242})();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.