Skip to content

Instantly share code, notes, and snippets.

@Wilto
Created March 7, 2012 22:26
Show Gist options
  • Save Wilto/1996704 to your computer and use it in GitHub Desktop.
Save Wilto/1996704 to your computer and use it in GitHub Desktop.
$(function($){
var depjson,
builderhtml = [],
sortable = [],
groupBy = function( jsondata ) {
var newarray = [];
for (key in jsondata) {
console.log( key );
}
return newarray;
},
strip = function( file ) {
return file.replace(/\.\//g, '').replace(/\./g, '-');
},
builditem = function( data ) {
builderhtml = groupBy( data, 'group' );
//console.log( builderhtml );
for ( var key in builderhtml ) {
var id = strip( key ),
label = builderhtml[key].label,
desc = builderhtml[key].description,
labelm = "<label for='" + id + "'>" + label + "</label>",
inputm = "<input type='checkbox' id='" + id + "' name='" + id + "' " + ( builderhtml[key].required ? "disabled='disabled' checked='checked'" : "" ) + " />",
descm = "<small>" + desc + "</small>",
item = inputm;
if( label ) { item = item + labelm; }
if( desc ) { item = item + descm; }
document.getElementById('builder').innerHTML = document.getElementById('builder').innerHTML + "<li>" + item + "</li>";
}
},
checkDependencies = function( e ) {
var $el = $( e.target ),
id = $el.attr('id').replace(/\-/g, '.'),
dep = depjson[ id ];
if ( $el.is(':checked') ) {
if( dep.deps ) {
for ( i = 0; i < dep.deps.length; i++ ) {
var checkDep = strip( dep.deps[i] );
$( '#' + checkDep ).attr('checked', 'checked');
}
}
} else {
for ( var key in depjson ) {
if ( depjson.hasOwnProperty(key) && depjson[key].deps ) {
for ( i = 0; i < depjson[key].deps.length; i++ ) {
if( strip( depjson[key].deps[i] ) == strip( id ) ) {
var checkDep = strip( key );
$( '#' + checkDep ).removeAttr('checked');
}
}
}
}
}
};
$.ajax({
url: 'http://amd-builder.no.de/jquery-mobile/master/dependencies?baseUrl=js',
success: builditem
});
$(document).delegate('input:checkbox', 'change', checkDependencies );
$('.download-builder').bind('submit', function(e) {
var $el = $(this),
formData = $el.find(':checked'),
items = '';
formData.each(function() {
items = items + $(this).attr('id') + '&';
});
$.ajax({
url: 'http://amd-builder.no.de/jquery-mobile/master/make?baseUrl=js&include=' + items.replace(/\-/g, '.') + '&pragmasOnSave=%7B%22jqmBuildExclude%22%3Atrue%7D',
success: function( data ) {
if( $('.builder-output').length ) {
$('.builder-output').text( data );
} else {
$el.after( "<textarea class='builder-output'>" + data + "</textarea>" );
}
}
});
e.preventDefault();
}).append('<input type="submit">');
});
#builder {
list-style: none;
}
#builder li {
display: block;
padding: 2px 0 0 0;
}
#builder label {
display: inline-block;
padding: 0 0 0 5px;
}
#builder small {
display: block; color: #777;
}
textarea {
width: 100%;
height: 200px;
}
<!DOCTYPE html>
<!--[if lt IE 7]> <html dir="ltr" lang="en-US" class="no-js ie ie6 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 7]> <html dir="ltr" lang="en-US" class="no-js ie ie7 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 8]> <html dir="ltr" lang="en-US" class="no-js ie ie8 lte9 lte8"> <![endif]-->
<!--[if IE 9]> <html dir="ltr" lang="en-US" class="no-js ie ie9 lte9"> <![endif]-->
<!--[if gt IE 9]> <html dir="ltr" lang="en-US" class="no-js"> <![endif]-->
<!--[if !IE]><!--> <html> <!--<![endif]-->
<head>
<meta charset="UTF-8" />
<title>Download Builder | jQuery Mobile</title>
<link rel="stylesheet" type="text/css" media="all" href="http://jquerymobile.com/wp-content/themes/jquery-mobile/style.css" />
<link rel="stylesheet" type="text/css" href="builder.css" />
</head>
<body class="page page-template-default sub">
<header id="header">
<div id="logo">
<a href="http://jquerymobile.com/" rel="home" title="jQuery Mobile">jQuery Mobile</a>
</div>
<nav id="project-nav">
<ul>
<li class="alpha"><a href="http://jquery.com">jQuery</a></li>
<li><a href="http://jqueryui.com">UI</a></li>
<li><a href="http://jquerymobile.com">Mobile</a></li>
<li class="break"><a href="http://meetups.jquery.com">Meetups</a></li>
<li><a href="http://forum.jquery.com">Forum</a></li>
<li><a href="http://events.jquery.com">Events</a></li>
<li class="break"><a href="http://jquery.org/about">About</a></li>
<li class="omega"><a href="http://jquery.org/donate">Donate</a></li>
</ul>
</nav>
<nav id="site-nav">
<ul>
<li id="nav-docs" class="alpha"><a href="/demos">Docs</a></li>
<li id="nav-download"><a href="/download">Download</a></li>
<li id="nav-platforms"><a href="/gbs">Platforms</a></li>
<li id="nav-themes"><a href="/themeroller/">Themes</a></li>
<li id="nav-contribute"><a href="/resources">Resources</a></li>
<li id="nav-community"><a href="http://forum.jquery.com/jquery-mobile">Forum</a></li>
<li id="nav-blog" class="omega"><a href="/blog">Blog</a></li>
</ul>
</nav>
</header>
<article id="page">
<header class="page-header">
<h1>Download Builder</h1>
</header>
<form name="download-builder" class="download-builder" method="post">
<ul id="builder">
</ul>
</form>
<footer id="footer">
<p id="jq-copyright">&copy; 2010 <a href="http://jquery.org/">The jQuery Project</a></p>
<p id="jq-hosting">Sponsored by <a href="http://mediatemple.net" class="jq-mediaTemple">Media Temple</a>, <a href="#project-sponsors">Mobile Project Sponsors</a> and <a href="http://jquery.org/sponsors">Others</a>.</p>
</footer>
</article>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type='text/javascript' src='build.js'></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment