rebuild + first bit of customizer urls

1 files changed, 175 insertions, 0 deletions

diff --git a/assets/js/customizer.js b/assets/js/customizer.js
new file mode 100644
index 000000000..33bc71e44
--- /dev/null
+++ b/assets/js/customizer.js
@@ -0,0 +1,175 @@
+window.onload = function () { // wait for load in a dumb way because B-0
+  var cw = '/*!\n * Bootstrap v3.0.0-rc.2\n *\n * Copyright 2013 Twitter, Inc\n * Licensed under the Apache License v2.0\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Designed and built with all the love in the world @twitter by @mdo and @fat.\n */\n\n'
+
+  function generateUrl() {
+    var vars = {}
+
+    $('#less-variables-section input')
+        .each(function () {
+          $(this).val() && (vars[ $(this).prev().text() ] = $(this).val())
+        })
+
+    var data = {
+      vars: vars,
+      css: $('#less-section input:not(:checked)').map(function () { return this.value }).toArray(),
+      js: $('#plugin-section input:not(:checked)').map(function () { return this.value }).toArray()
+    }
+
+    if ($.isEmptyObject(data.vars) && !data.css.length && !data.js.length) return
+
+    window.location = jQuery.param.querystring('/customize/', data)
+  }
+
+  function parseUrl() {
+    var data = jQuery.deparam.querystring()
+
+    if (data.js) {
+      for (var i = 0; i < data.js.length; i++) {
+        var input = $('input[value="'+data.js[i]+'"]')
+        input && input.prop('checked', false)
+      }
+    }
+
+    if (data.css) {
+      for (var i = 0; i < data.css.length; i++) {
+        var input = $('input[value="'+data.css[i]+'"]')
+        input && input.prop('checked', false)
+      }
+    }
+
+    if (data.vars) {
+      // todo (fat): vars
+    }
+  }
+
+  function generateZip(css, js, complete) {
+    if (!css && !js) return alert('you want to build nothing… o_O')
+
+    var zip = new JSZip()
+
+    if (css) {
+      var cssFolder = zip.folder('css')
+      for (var fileName in css) {
+        cssFolder.file(fileName, css[fileName])
+      }
+    }
+
+    if (js) {
+      var jsFolder = zip.folder('js')
+      for (var fileName in js) {
+        jsFolder.file(fileName, js[fileName])
+      }
+    }
+
+    var content = zip.generate()
+
+    location.href = 'data:application/zip;base64,' + content
+
+    complete()
+  }
+
+  function generateCustomCSS(vars) {
+    var result = ''
+
+    for (var key in vars) {
+      result += key + ': ' + vars[key] + ';\n'
+    }
+
+    return result + '\n\n'
+  }
+
+  function generateCSS() {
+    var $checked = $('#less-section input:checked')
+
+    if (!$checked.length) return false
+
+    var result = {}
+    var vars = {}
+    var css = ''
+
+    $('#less-variables-section input')
+        .each(function () {
+          $(this).val() && (vars[ $(this).prev().text() ] = $(this).val())
+        })
+
+    css += __less['variables.less']
+    if (vars) css += generateCustomCSS(vars)
+    css += __less['mixins.less']
+    css += $checked
+      .map(function () { return __less[this.value] })
+      .toArray()
+      .join('\n')
+
+    css = css.replace(/@import[^\n]*/gi, '') //strip any imports
+
+    try {
+      var parser = new less.Parser({
+          paths: ['variables.less', 'mixins.less']
+        , optimization: 0
+        , filename: 'bootstrap.css'
+      }).parse(css, function (err, tree) {
+        if (err) return alert(err)
+
+        result = {
+          'bootstrap.css'     : cw + tree.toCSS(),
+          'bootstrap.min.css' : cw + tree.toCSS({ compress: true })
+        }
+      })
+    } catch (err) {
+      return alert(err)
+    }
+
+    return result
+  }
+
+  function generateJavascript() {
+    var $checked = $('#plugin-section input:checked')
+    if (!$checked.length) return false
+
+    var js = $checked
+      .map(function () { return __js[this.value] })
+      .toArray()
+      .join('\n')
+
+    return {
+      'bootstrap.js': js,
+      'bootstrap.min.js': cw + uglify(js)
+    }
+  }
+
+  var $downloadBtn = $('#btn-download').on('click', function (e) {
+    e.preventDefault()
+    $downloadBtn.addClass('loading')
+    generateZip(generateCSS(), generateJavascript(), function () {
+      $downloadBtn.removeClass('loading')
+      setTimeout(function () {
+        generateUrl()
+      }, 1)
+    })
+  })
+
+  var inputsComponent = $('#less-section input')
+  var inputsPlugin    = $('#plugin-section input')
+  var inputsVariables = $('#less-variables-section input')
+
+  $('#less-section .toggle').on('click', function (e) {
+    e.preventDefault()
+    inputsComponent.prop('checked', !inputsComponent.is(':checked'))
+  })
+
+  $('#plugin-section .toggle').on('click', function (e) {
+    e.preventDefault()
+    inputsPlugin.prop('checked', !inputsPlugin.is(':checked'))
+  })
+
+  $('#less-variables-section .toggle').on('click', function (e) {
+    e.preventDefault()
+    inputsVariables.val('')
+  })
+
+  try {
+    parseUrl()
+  } catch (e) {
+    // maybe alert user that we can't parse their url
+  }
+}
\ No newline at end of file