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'
+ var cw = '/*!\n * Bootstrap v3.0.0\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 showError(msg, err) {
+ $('<div id="bsCustomizerAlert" class="bs-customizer-alert">\
+ <div class="container">\
+ <a href="#bsCustomizerAlert" data-dismiss="alert" class="close pull-right">×</a>\
+ <p class="bs-customizer-alert-text"><span class="glyphicon glyphicon-warning-sign"></span>' + msg + '</p>' +
+ (err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') + '\
+ </div>\
+ </div>').appendTo('body').alert()
+ throw err
+ }
+
+ function showCallout(msg, showUpTop) {
+ var callout = $('<div class="bs-callout bs-callout-danger">\
+ <h4>Attention!</h4>\
+ <p>' + msg + '</p>\
+ </div>')
+
+ if (showUpTop) {
+ callout.appendTo('.bs-docs-container')
+ } else {
+ callout.insertAfter('.bs-customize-download')
+ }
+ }
+
+ function getQueryParam(key) {
+ key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars
+ var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)"));
+ return match && decodeURIComponent(match[1].replace(/\+/g, " "));
+ }
- function generateUrl() {
+ function createGist(configData) {
+ var data = {
+ "description": "Bootstrap Customizer Config",
+ "public": true,
+ "files": {
+ "config.json": {
+ "content": JSON.stringify(configData, null, 2)
+ }
+ }
+ }
+ $.ajax({
+ url: 'https://api.github.com/gists',
+ type: 'POST',
+ dataType: 'json',
+ data: JSON.stringify(data)
+ })
+ .success(function(result) {
+ history.replaceState(false, document.title, window.location.origin + window.location.pathname + '?id=' + result.id)
+ })
+ .error(function(err) {
+ showError('<strong>Ruh roh!</strong> Could not save gist file, configuration not saved.', err)
+ })
+ }
+
+ function getCustomizerData() {
var vars = {}
$('#less-variables-section input')
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()
+ css: $('#less-section input:checked') .map(function () { return this.value }).toArray(),
+ js: $('#plugin-section input: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)
+ return data
}
function parseUrl() {
- var data = jQuery.deparam.querystring()
+ var id = getQueryParam('id')
- 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 (!id) return
- if (data.css) {
- for (var i = 0; i < data.css.length; i++) {
- var input = $('input[value="'+data.css[i]+'"]')
- input && input.prop('checked', false)
+ $.ajax({
+ url: 'https://api.github.com/gists/' + id,
+ type: 'GET',
+ dataType: 'json'
+ })
+ .success(function(result) {
+ var data = JSON.parse(result.files['config.json'].content)
+ if (data.js) {
+ $('#plugin-section input').each(function () {
+ $(this).prop('checked', ~$.inArray(this.value, data.js))
+ })
}
- }
-
- if (data.vars) {
- // todo (fat): vars
- }
+ if (data.css) {
+ $('#less-section input').each(function () {
+ $(this).prop('checked', ~$.inArray(this.value, data.css))
+ })
+ }
+ if (data.vars) {
+ for (var i in data.vars) {
+ $('input[data-var="' + i + '"]').val(data.vars[i])
+ }
+ }
+ })
+ .error(function(err) {
+ showError('Error fetching bootstrap config file', err)
+ })
}
- function generateZip(css, js, complete) {
- if (!css && !js) return alert('you want to build nothing… o_O')
+ function generateZip(css, js, fonts, complete) {
+ if (!css && !js) return showError('<strong>Ruh roh!</strong> No Bootstrap files selected.', new Error('no Bootstrap'))
var zip = new JSZip()
}
}
- var content = zip.generate()
+ if (fonts) {
+ var fontsFolder = zip.folder('fonts')
+ for (var fileName in fonts) {
+ fontsFolder.file(fileName, fonts[fileName])
+ }
+ }
- location.href = 'data:application/zip;base64,' + content
+ var content = zip.generate({type:"blob"})
- complete()
+ complete(content)
}
function generateCustomCSS(vars) {
return result + '\n\n'
}
+ function generateFonts() {
+ var glyphicons = $('#less-section [value="glyphicons.less"]:checked')
+ if (glyphicons.length) {
+ return __fonts
+ }
+ }
+
function generateCSS() {
var $checked = $('#less-section input:checked')
css += __less['variables.less']
if (vars) css += generateCustomCSS(vars)
css += __less['mixins.less']
+ css += __less['normalize.less']
+ css += __less['scaffolding.less']
css += $checked
.map(function () { return __less[this.value] })
.toArray()
, optimization: 0
, filename: 'bootstrap.css'
}).parse(css, function (err, tree) {
- if (err) return alert(err)
-
+ if (err) {
+ return showError('<strong>Ruh roh!</strong> Could not parse less files.', err)
+ }
result = {
'bootstrap.css' : cw + tree.toCSS(),
'bootstrap.min.css' : cw + tree.toCSS({ compress: true })
}
})
} catch (err) {
- return alert(err)
+ return showError('<strong>Ruh roh!</strong> Could not parse less files.', err)
}
return result
}
}
- 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')
inputsVariables.val('')
})
- try {
- parseUrl()
- } catch (e) {
- // maybe alert user that we can't parse their url
+ $('[data-dependencies]').on('click', function () {
+ if (!$(this).is(':checked')) return
+ var dependencies = this.getAttribute('data-dependencies')
+ if (!dependencies) return
+ dependencies = dependencies.split(',')
+ for (var i = 0; i < dependencies.length; i++) {
+ var dependency = $('[value="' + dependencies[i] + '"]')
+ dependency && dependency.prop('checked', true)
+ }
+ })
+
+ $('[data-dependents]').on('click', function () {
+ if ($(this).is(':checked')) return
+ var dependents = this.getAttribute('data-dependents')
+ if (!dependents) return
+ dependents = dependents.split(',')
+ for (var i = 0; i < dependents.length; i++) {
+ var dependent = $('[value="' + dependents[i] + '"]')
+ dependent && dependent.prop('checked', false)
+ }
+ })
+
+ var $compileBtn = $('#btn-compile')
+ var $downloadBtn = $('#btn-download')
+
+ $compileBtn.on('click', function (e) {
+ e.preventDefault()
+
+ $compileBtn.attr('disabled', 'disabled')
+
+ generateZip(generateCSS(), generateJavascript(), generateFonts(), function (blob) {
+ $compileBtn.removeAttr('disabled')
+ saveAs(blob, "bootstrap.zip")
+ createGist(getCustomizerData())
+ })
+ })
+
+ // browser support alerts
+ if (!window.URL && navigator.userAgent.toLowerCase().indexOf('safari') != -1) {
+ showCallout("Looks like you're using safari, which sadly doesn't have the best support\
+ for HTML5 blobs. Because of this your file will be downloaded with the name <code>\"untitled\"</code>.\
+ However, if you check your downloads folder, just rename this <code>\"untitled\"</code> file\
+ to <code>\"bootstrap.zip\"</code> and you should be good to go!")
+ } else if (!window.URL && !window.webkitURL) {
+ $('.bs-docs-section, .bs-sidebar').css('display', 'none')
+
+ showCallout("Looks like your current browser doesn't support the Bootstrap Customizer. Please take a second\
+ to <a href=\"https://www.google.com/intl/en/chrome/browser/\"> upgrade to a more modern browser</a>.", true)
}
-}
\ No newline at end of file
+
+ parseUrl()
+}
projects / bootswatch / blobdiff