download.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. function prettyOutput() {
  2. document.getElementById('result').style.display = "inline-block";
  3. document.getElementById('result').innerText = calculateCSS();
  4. }
  5. function getNums (input) {
  6. input = input.split(' - ');
  7. input.shift();
  8. input.forEach(function(n, i) {
  9. input[i]=parseInt(n);
  10. });
  11. return input;
  12. }
  13. function calculateCSS() {
  14. var mincss = "";
  15. var details = {
  16. general: false,
  17. headings: false,
  18. buttons: false,
  19. forms: false,
  20. navbar: false,
  21. tables: false,
  22. icons: false,
  23. grid: false,
  24. messages: false
  25. };
  26. for (var i=0; i<document.getElementById('checkboxes').children.length; i++) {
  27. var currentTypeName = document.getElementById('checkboxes').children[i].children[0].name;
  28. var isChecked = document.getElementsByName(currentTypeName)[0].checked;
  29. details[currentTypeName] = isChecked;
  30. if (isChecked) {
  31. mincss += css[currentTypeName];
  32. }
  33. }
  34. var http = new XMLHttpRequest();
  35. var url = "http://8b51d1abd8.test-url.ws/gzipsize.php";
  36. var params = "encode="+mincss;
  37. http.open("POST", url, true);
  38. //Send the proper header information along with the request
  39. http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  40. http.setRequestHeader("Content-length", params.length);
  41. http.setRequestHeader("Connection", "close");
  42. http.onreadystatechange = function() {
  43. //Call a function when the state changes.
  44. if (http.readyState == 4 && http.status == 200) {
  45. details.totalmingzip = parseInt(http.responseText);
  46. document.getElementById('details').innerHTML = document.getElementById('details').innerHTML.replace(' and', ',');
  47. document.getElementById('details').innerHTML += ", and " + details.totalmingzip + " bytes minified and gzipped.";
  48. mixpanel.track('Calculate CSS', details);
  49. }
  50. };
  51. http.send(params);
  52. document.getElementById('details').innerHTML = "Your customized Min is about " + Math.round(-1*(((mincss.length/2274)-1)*100)) + "% smaller, or about "+ Math.round(((mincss.length/2274)*995)) +" bytes minified and gzipped."
  53. console.log(details);
  54. return mincss;
  55. }