Updated the build

This commit is contained in:
zeke
2011-08-09 12:28:38 -07:00
parent 5dc5dca7b7
commit f738ca4732
3 changed files with 49 additions and 15 deletions

View File

@@ -14,9 +14,9 @@
</head> </head>
<body> <body>
<form id='api_selector'> <form id='api_selector'>
<li><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text" /></li> <div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text" /></div>
<li><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text" /></li> <div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text" /></div>
<li><a id="explore" href="#">Explore</a></li> <div class='input'><a id="explore" href="#">Explore</a></div>
</form> </form>
<div class='container' id='resources_container'> <div class='container' id='resources_container'>
<ul id='resources'></ul> <ul id='resources'></ul>
@@ -136,5 +136,9 @@
<td width='500'>${description}</td> <td width='500'>${description}</td>
</tr> </tr>
</script> </script>
<p id='colophon'>
Sexy API documentation from
<a href="http://swagger.wordnik.com">Swagger</a>.
</p>
</body> </body>
</html> </html>

View File

@@ -24,6 +24,22 @@ jQuery(function($) {
} }
$("a#explore").click(this.showApi); $("a#explore").click(this.showApi);
this.adaptToScale();
$(window).resize(function() {
apiSelectionController.adaptToScale();
});
},
adaptToScale: function() {
var form_width = $('form#api_selector').width();
var inputs_width = 0;
$('form#api_selector div.input').each( function(){ inputs_width += $(this).outerWidth(); });
// Update with of baseUrl input
var free_width = form_width - inputs_width;
$('#input_baseUrl').width($('#input_baseUrl').width() + free_width - 50);
}, },
slapOn: function() { slapOn: function() {
@@ -315,8 +331,9 @@ jQuery(function($) {
}); });
// Attach controller to window
window.apiSelectionController = ApiSelectionController.init(); window.apiSelectionController = ApiSelectionController.init();
if (this.baseUrl) { if (this.baseUrl) {
window.resourceListController = ResourceListController.init({ window.resourceListController = ResourceListController.init({
baseUrl: this.baseUrl, baseUrl: this.baseUrl,

View File

@@ -278,46 +278,59 @@ form.fullwidth ol li.string input, form.fullwidth ol li.url input, form.fullwidt
width: 500px !important; } width: 500px !important; }
body { body {
font-family: "Droid Sans", sans-serif; font-family: "Droid Sans", sans-serif; }
margin: 20px; }
body #content_message { body #content_message {
margin: 10px 0; margin: 10px 15px;
font-style: italic; font-style: italic;
color: #999999; } color: #999999; }
body form#api_selector { body form#api_selector {
background-color: #89bf04;
padding: 15px;
float: none; float: none;
clear: both; clear: both;
overflow: hidden; overflow: hidden;
display: block; } display: block; }
body form#api_selector li { body form#api_selector .input {
display: block; display: block;
clear: none; clear: none;
float: left; float: left;
margin: 0 10px 0 0; } margin: 0 10px 0 0; }
body form#api_selector li input { body form#api_selector .input input {
font-size: 1em; font-size: 1em;
padding: 3px; } padding: 3px; }
body form#api_selector li input#input_baseUrl { body form#api_selector .input input#input_baseUrl {
width: 500px; } width: 500px; }
body form#api_selector li input#input_apiKey { body form#api_selector .input input#input_apiKey {
width: 150px; } width: 250px; }
body form#api_selector li a#explore { body form#api_selector .input a#explore {
display: block; display: block;
text-decoration: none; text-decoration: none;
font-weight: bold; font-weight: bold;
padding: 8px 8px; padding: 8px 8px;
font-size: 0.9em; font-size: 0.9em;
color: white; color: white;
background-color: #89bf04; background-color: #547f00;
-moz-border-radius: 4px; -moz-border-radius: 4px;
-webkit-border-radius: 4px; -webkit-border-radius: 4px;
-o-border-radius: 4px; -o-border-radius: 4px;
-ms-border-radius: 4px; -ms-border-radius: 4px;
-khtml-border-radius: 4px; -khtml-border-radius: 4px;
border-radius: 4px; } border-radius: 4px; }
body form#api_selector li a#explore:hover { body form#api_selector .input a#explore:hover {
background-color: #547f00; } background-color: #547f00; }
body p#colophon {
margin: 0 15px 40px 15px;
padding: 10px 0;
font-size: 0.8em;
border-top: 1px solid #dddddd;
font-family: "Droid Sans", sans-serif;
color: #999999;
font-style: italic; }
body p#colophon a {
text-decoration: none;
color: #547f00; }
body ul#resources { body ul#resources {
padding: 0 15px;
font-family: "Droid Sans", sans-serif; font-family: "Droid Sans", sans-serif;
font-size: 0.9em; } font-size: 0.9em; }
body ul#resources li.resource { body ul#resources li.resource {