1(function ChartPress() { 2 function KeySpline (mX1, mY1, mX2, mY2) { 3 // KeySpline 4 // Gaetan Renaudeau <[email protected]> 5 // 2012 MIT License 6 7 this.get = function(aX) { 8 if (mX1 == mY1 && mX2 == mY2) return aX; // linear 9 return CalcBezier(GetTForX(aX), mY1, mY2); 10 } 11 12 function A(aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; } 13 function B(aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1; } 14 function C(aA1) { return 3.0 * aA1; } 15 16 // Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2. 17 function CalcBezier(aT, aA1, aA2) { 18 return ((A(aA1, aA2)*aT + B(aA1, aA2))*aT + C(aA1))*aT; 19 } 20 21 // Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2. 22 function GetSlope(aT, aA1, aA2) { 23 return 3.0 * A(aA1, aA2)*aT*aT + 2.0 * B(aA1, aA2) * aT + C(aA1); 24 } 25 26 function GetTForX(aX) { 27 // Newton raphson iteration 28 var aGuessT = aX; 29 for (var i = 0; i < 4; ++i) { 30 var currentSlope = GetSlope(aGuessT, mX1, mX2); 31 if (currentSlope == 0.0) return aGuessT; 32 var currentX = CalcBezier(aGuessT, mX1, mX2) - aX; 33 aGuessT -= currentX / currentSlope; 34 } 35 return aGuessT; 36 } 37 } 38 39 // Utility functions 40 var getClass = document.getElementsByClassName.bind(document); 41 var getAll = document.querySelectorAll.bind(document); 42 //HTMLCollection.prototype.forEach = NodeList.prototype.forEach = function(callback) { for (var i = 0; i < this.length; i++) callback.call(this[i]); }; 43 44 // Handler class for horizontal bar type charts 45 (function BarCharts_Horizontal() { 46 47 var charts = getClass('chartpress-bar-horizontal'); 48 var settings = { 49 chart: { 50 // [required/not required, available values, default value] 51 scale: ['not-required', ['small', 'medium', 'large'], 'medium'], 52 maxValue: ['not-required', ['max', '<integer>'], 'max'], 53 shortenNumbers: ['not-required', [true, false], false], 54 liveNumbers: ['not-required', [true, false], true], 55 percentage: ['not-required', [true, false], false], 56 animationTime: ['not-required', [3000, '<integer>'], 3000], 57 timingFunction: ['not-required', ['<string>'], 'cubic-bezier(0.455, 0.03, 0.515, 0.955)'], 58 color: ['not-required', ['none', '<string>'], '#52E5E7'], 59 secondColor: ['not-required', ['none', '<string>'], '#130CB7'] 60 }, 61 bar: { 62 scale: ['not-required', ['inherit', 'small', 'medium', 'large'], 'inherit'], 63 maxValue: ['not-required', ['inherit', 'max', '<integer>'], 'inherit'], 64 shortenNumbers: ['not-required', ['inherit', true, false], 'inherit'], 65 liveNumbers: ['not-required', ['inherit', true, false], 'inherit'], 66 percentage: ['not-required', ['inherit', true, false], 'inherit'], 67 animationTime: ['not-required', ['inherit', 3000, '<integer>'], 'inherit'], 68 timingFunction: ['not-required', ['inherit', '<string>'], 'inherit'], 69 value: ['required', ['<integer>'], 'no-default-value'], 70 title: ['required', ['<string>'], 'no-default-value'], 71 color: ['not-required', ['inherit', '<string>'], 'inherit'], 72 secondColor: ['not-required', ['none', 'inherit', '<string>'], 'inherit'] 73 } 74 }; 75 76 var forEveryBar = function(bars, callback) { 77 for (var i = 0; i < bars.length; i++) { 78 var bar = bars[i]; 79 callback.call(bar); 80 } 81 }; 82 83 var Animation = function() { 84 var linearCompletePercentage = function(chart) { 85 return ret = (Date.now() - chart.chartpress.animation.startTime) / parseInt(calculate(chart, 'animationTime')); 86 };
87 var functionalCompletePercentage = function(chart) { 88 var ret = chart.chartpress.animation.bezierEngine.get(linearCompletePercentage(chart)); 89 if (ret >= 1.0) return 1.0; 90 else return ret; 91 }; 92 var initialize = function(chart) { 93 var splitBezierString = function(strng) { 94 strng = strng.split('('); 95 strng = strng[1].split(','); 96 var coordinates = []; 97 for (var i = 0; i < strng.length; i++) { 98 coordinates[i] = parseFloat(strng[i]); 99 } 100 return coordinates; 101 }; 102 var bezierCoordinates = splitBezierString(calculate(chart, 'timingFunction')); 103 chart.chartpress = { 104 animation: { 105 startTime: Date.now(), 106 bezierEngine: new KeySpline( 107 bezierCoordinates[0], 108 bezierCoordinates[1], 109 bezierCoordinates[2], 110 bezierCoordinates[3] 111 ) 112 } 113 }; 114 }; 115 var displayValue = function(bar) { 116 var chart = bar.parentNode; 117 frame = functionalCompletePercentage(chart); 118 var finalValue = calculate(bar, 'value'); 119 var currentValue = Math.round(finalValue * frame); 120 var intToString = function(number) { 121 var ret = ''; 122 var strng = number.toString(); 123 strng.split(""); 124 for (var i = strng.length; i > 0; i--) { 125 ret += strng[strng.length - i]; 126 if (i > 3 && i % 3 == 1) ret += '.'; 127 } 128 return ret; 129 } 130 return intToString(currentValue); 131 }; 132 var tracker = function() { 133 // this <- bar 134 var chart = this.parentNode; 135 var container = this.children[0]; 136 var textArea = container.children[0]; 137 var number = textArea.children[1]; 138 139 var _linearCompletePercentage = linearCompletePercentage(chart); 140 var _functionalCompletePercentage = functionalCompletePercentage(chart); 141 142 number.innerHTML = displayValue(this); 143 144 if (_functionalCompletePercentage < 1.0) window.requestAnimationFrame(tracker.bind(this)); 145 }; 146 this.startAnimation = function(chart) { 147 initialize(chart); 148 var bars = chart.children; 149 forEveryBar(bars, function() { 150 this.addEventListener('animationstart', tracker.bind(this)); 151 this.style.animation = 'chartpress-expand ' + calculate(this, 'animationTime') + 'ms ' + calculate(this, 'timingFunction') + ' 0s 1 normal both running'; 152 }); 153 154 }; 155 }; 156 var calculate = function (obj, prop) { 157 var getBiggestBar = function(bars) { 158 var biggestBar = bars[0]; 159 forEveryBar(bars, function() { 160 if (parseInt(this.dataset.value) > parseInt(biggestBar.dataset.value)) 161 biggestBar = this; 162 }); 163 return biggestBar; 164 }; 165 if (obj.classList.contains('chartpress-bar-horizontal')) { 166 var ret; 167 168 if (obj.dataset[prop] != undefined) 169 ret = obj.dataset[prop]; 170 else if (settings.chart[prop] != undefined) { 171 if (settings.chart[prop][0] == 'not-required') 172 ret = settings.chart[prop][2]; 173 else { 174 console.log('[CHARTPRESS][WARN] Chart (' + obj + ') doesn\'t have property (' + property + ') and there is no default value for obj prop.'); 175 return false;
176 } 177 } 178 179 switch (prop) { 180 case 'maxValue': 181 if (ret == 'max') { 182 var bars = obj.children; 183 return getBiggestBar(bars).dataset.value; 184 } 185 default: 186 return ret; 187 } 188 } else if (obj.parentNode.classList.contains('chartpress-bar-horizontal')) { 189 var chart = obj.parentNode; 190 if (obj.dataset[prop] != undefined) 191 return obj.dataset[prop]; 192 else if (settings.bar[prop] != undefined) { 193 if (settings.bar[prop][2] == 'inherit') return calculate(chart, prop); 194 else return settings.bar[prop][2]; 195 } 196 else 197 console.log('[CHARTPRESS][WARN] Bar (' + obj + ') doesn\'t have prop (' + prop + ') and there is no default value for obj prop.'); 198 return false; 199 } 200 }; 201 var checkDataset = function(chart) { // TODO: 202 return true; 203 }; 204 var initializeForCSS = function(chart) { 205 // FOR CHART 206 for (var key in settings.chart) { 207 if (chart.dataset.hasOwnProperty(key) == false && settings.chart[key][0] == 'not-required') { 208 chart.dataset[key] = calculate(chart, key); 209 } 210 } 211 // FOR BARS 212 var bars = chart.children; 213 forEveryBar(bars, function() { 214 for (var key in settings.bar) { 215 if (this.dataset.hasOwnProperty(key) == false && settings.bar[key][0] == 'not-required') { 216 this.dataset[key] = calculate(this, key); 217 } 218 } 219 }); 220 }; 221 var addScrollListener = function(chart) { // TODO: 222 var startAnimation = function() { // TODO: 223 ; 224 }; 225 }; 226 var buildChart = function(chart) { // FIXME: 227 var buildElements = function(chart) { 228 var bars = chart.children; 229 forEveryBar(bars, function() { 230 var container = document.createElement('div'); 231 container.classList.add('container'); 232 this.appendChild(container); 233 234 var textArea = document.createElement('div'); 235 textArea.classList.add('text-area'); 236 container.appendChild(textArea); 237 238 var title = document.createElement('div'); 239 title.innerHTML = calculate(this, 'title'); 240 title.classList.add('title'); 241 textArea.appendChild(title); 242 243 var number = document.createElement('div'); 244 number.classList.add('number'); 245 textArea.appendChild(number); 246 number.innerHTML = calculate(this, 'value'); 247 248 var bar = document.createElement('div'); 249 bar.classList.add('bar'); 250 container.appendChild(bar); 251 252 if (calculate(this, 'secondColor') != 'none') { 253 // gradient background 254 bar.style.background = 'linear-gradient(-90deg, ' + calculate(this, 'color') + ', ' + calculate(this, 'secondColor') + ')'; 255 } else { 256 // solid color background 257 bar.style.background = calculate(this, 'color'); 258 } 259 260 container.style.width = (parseInt(calculate(this, 'value')) / parseInt(calculate(this, 'maxValue'))) * 100 + '%'; 261 }); 262 }; 263 if (checkDataset(chart) == false) { 264 console.log('[CHARTPRESS][ERROR] Invalid data attributes. Chartpress creater halted for this chart.'); 265 return false; 266 } 267 initializeForCSS(chart); 268 buildElements(chart); 269 addScrollListener(chart); 270 var anim = new Animation();
271 anim.startAnimation(chart); // FIXME: KALDIR 272 }; 273 274 for (var i = 0; i < charts.length; i++) { 275 var chart = charts[i]; 276 buildChart(chart); 277 } 278 279 })(); 280 281 // TODO: 282 // Handler class for circular type charts 283})(); 284jQuery(document).ready(function($){ 285 var progressBarOptions = { 286 startAngle: -1.55, 287 size: 200 288 } 289 290 $('.circle').circleProgress(progressBarOptions).on('circle-animation-progress', function(event, progress, stepValue) { 291 $(this).find('strong').text(String(stepValue.toFixed(2)).substr(1)); 292 }); 293 294 $('#circle-a').circleProgress({ 295 value: 1.00, 296 fill: {gradient: ['#212d65', '#3ea5d7']} 297 298 }).on('circle-animation-progress', function(event, progress, value) { 299 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 300 }); 301 302 $('#circle-b').circleProgress({ 303 value : 1.00, 304 fill: {gradient: ['#212d65', '#3ea5d7']} 305 }).on('circle-animation-progress', function(event, progress, value) { 306 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 307 }); 308 309 $('#circle-c').circleProgress({ 310 value : .92, 311 fill: {gradient: ['#212d65', '#3ea5d7']} 312 }).on('circle-animation-progress', function(event, progress, value) { 313 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 314 }); 315 316 $('#circle-d').circleProgress({ 317 value : .99, 318 fill: {gradient: ['#212d65', '#3ea5d7']} 319 }).on('circle-animation-progress', function(event, progress, value) { 320 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 321 }); 322 $('#circle-e').circleProgress({ 323 value : .87, 324 fill: {gradient: ['#212d65', '#3ea5d7']} 325 }).on('circle-animation-progress', function(event, progress, value) { 326 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 327 }); 328 $('#circle-f').circleProgress({ 329 value : .74, 330 fill: {gradient: ['#212d65', '#3ea5d7']} 331 }).on('circle-animation-progress', function(event, progress, value) { 332 $(this).find('strong').html(Math.round(100 * value) + '<i>%</i>'); 333 }); 334});
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.