added input fields to take in the api url and api key
This commit is contained in:
@@ -29,14 +29,14 @@
|
||||
</h1>
|
||||
|
||||
<ul id='nav'>
|
||||
<li class="first odd"><input class="header-input" type="text" style="width: 400px" placeholder="http://awesome-api.com/rest/list.json"></li>
|
||||
<li class="even"><input class="header-input" type="text" style="width: 200px" placeholder="(api key)"></li>
|
||||
<li class="last odd"><a href="/support" class="active">Explore</a></li>
|
||||
<li class="first odd"><input id="input_baseUrl" class="header-input" type="text" style="width: 400px" placeholder="http://awesome-api.com/rest/list.json"></li>
|
||||
<li class="even"><input id="input_apiKey" class="header-input" type="text" style="width: 200px" placeholder="(api key)"></li>
|
||||
<li class="last odd" id="button_explore"><a href="#" class="active">Explore</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id='content'>
|
||||
<div class='container'>
|
||||
<div id="resources_container" class='container'>
|
||||
<div class='fullwidth_column'>
|
||||
<div class='heading_with_menu'>
|
||||
<h1>
|
||||
@@ -49,12 +49,15 @@
|
||||
|
||||
</ul>
|
||||
<p>
|
||||
<br>The latest API base URL is
|
||||
<br>API base URL is
|
||||
<span id="api_host_url" class='code'></span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="content_message" class='container'>
|
||||
</div>
|
||||
</div>
|
||||
<div id='footer'>
|
||||
<div class='container'>
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
|
||||
function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
function SwaggerService(hostUrl, rootResourcesApi, statusCallback) {
|
||||
if(!hostUrl)
|
||||
throw new Error("hostUrl must be passed while creating SwaggerService");
|
||||
|
||||
// constants
|
||||
var apiHost = hostUrl;
|
||||
var rootResourcesApiName = rootResourcesApi || "list";
|
||||
var statusListener = statusCallback;
|
||||
|
||||
// utility functions
|
||||
function log(m) {
|
||||
@@ -15,7 +16,11 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
function error(m) {
|
||||
if (window.console) console.log("ERROR: " + m);
|
||||
}
|
||||
|
||||
|
||||
function updateStatus(status) {
|
||||
statusListener(status);
|
||||
}
|
||||
|
||||
// make some models public
|
||||
this.ApiResource = function() {return ApiResource;};
|
||||
|
||||
@@ -97,6 +102,8 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
this.operations.refresh(value);
|
||||
}
|
||||
|
||||
updateStatus("Loading " + this.path + "...");
|
||||
|
||||
},
|
||||
|
||||
toString: function() {
|
||||
@@ -164,7 +171,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
});
|
||||
|
||||
// Model: ApiModel
|
||||
var ApiModel = Spine.Model.setup("ApiModel", ["id", "fields"]);;
|
||||
var ApiModel = Spine.Model.setup("ApiModel", ["id", "fields"]);
|
||||
ApiModel.include({
|
||||
init: function(atts) {
|
||||
if (atts) this.load(atts);
|
||||
@@ -184,6 +191,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
}
|
||||
}
|
||||
//log("got " + this.fields.count() + " fields for " + this.id);
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
@@ -231,6 +239,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
}
|
||||
} else
|
||||
this.dataType = atts.type;
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
@@ -257,6 +266,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
fetchEndpoints: function() {
|
||||
var controller = this;
|
||||
|
||||
updateStatus("Fetching API List...");
|
||||
$.getJSON(apiHost + "/" + rootResourcesApiName + ".json", function(response) {
|
||||
//log(response);
|
||||
ApiResource.createAll(response.apis);
|
||||
@@ -279,6 +289,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
|
||||
fetchResource: function(apiResource) {
|
||||
var controller = this;
|
||||
updateStatus("Fetching " + apiResource.name + "...");
|
||||
$.getJSON(apiHost + apiResource.path_json, function(response) {
|
||||
controller.loadResources(response, apiResource);
|
||||
});
|
||||
@@ -290,6 +301,7 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
// log(response);
|
||||
|
||||
apiResource.addApis(response.apis);
|
||||
// updateStatus("Parsed Apis");
|
||||
|
||||
//log(response.models);
|
||||
if(response.models) {
|
||||
@@ -303,6 +315,8 @@ function SwaggerService(hostUrl, rootResourcesApi) {
|
||||
// apiResource.modelList.create(m);
|
||||
}
|
||||
}
|
||||
|
||||
updateStatus();
|
||||
} finally {
|
||||
if(this.countLoaded == ApiResource.count()) {
|
||||
log("all models/api loaded");
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
jQuery(function($) {
|
||||
|
||||
this.baseUrl = "http://swagr.api.wordnik.com/v4/list.json";
|
||||
|
||||
var ApiSelectionController = Spine.Controller.create({
|
||||
proxied: ["showApi"],
|
||||
|
||||
baseUrlList: new Array(),
|
||||
|
||||
init: function() {
|
||||
@@ -16,6 +20,12 @@ jQuery(function($) {
|
||||
|
||||
this.render();
|
||||
|
||||
$("#button_explore").click(this.showApi);
|
||||
},
|
||||
|
||||
slapOn: function() {
|
||||
messageController.showMessage("Please enter a base url for the api that you wish to explore.");
|
||||
$("#resources_container").hide();
|
||||
},
|
||||
|
||||
supportsLocalStorage: function() {
|
||||
@@ -28,9 +38,36 @@ jQuery(function($) {
|
||||
|
||||
render: function() {
|
||||
// $("#baseUrlSelector").chosen();
|
||||
},
|
||||
|
||||
showApi: function() {
|
||||
var baseUrl = jQuery.trim($("#input_baseUrl").val());
|
||||
if(baseUrl.length == 0) {
|
||||
$("#input_baseUrl").wiggle();
|
||||
} else {
|
||||
var resourceListController = ResourceListController.init({baseUrl: baseUrl})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var MessageController = Spine.Controller.create({
|
||||
showMessage: function(msg) {
|
||||
if(msg) {
|
||||
$("#content_message").html(msg);
|
||||
$("#content_message").show();
|
||||
} else {
|
||||
$("#content_message").html("");
|
||||
$("#content_message").hide();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
clearMessage: function() {
|
||||
this.showMessage();
|
||||
}
|
||||
});
|
||||
var messageController = MessageController.init();
|
||||
|
||||
// The following heirarchy is followed by these view controllers
|
||||
// ResourceListController
|
||||
// >>> ResourceController
|
||||
@@ -47,6 +84,10 @@ jQuery(function($) {
|
||||
throw new Error("A baseUrl must be passed to ResourceListController");
|
||||
}
|
||||
|
||||
$("#content_message").hide();
|
||||
$("#resources_container").hide();
|
||||
$("#resources").html("");
|
||||
|
||||
var hostUrl = this.baseUrl.substr(0, this.baseUrl.lastIndexOf("/"));
|
||||
var resourceListApi = this.baseUrl.substr(this.baseUrl.lastIndexOf("/") + 1, this.baseUrl.length);
|
||||
log("resourceListApi=" + resourceListApi);
|
||||
@@ -54,7 +95,12 @@ jQuery(function($) {
|
||||
|
||||
// create and initialize SwaggerService
|
||||
$("#api_host_url").html(hostUrl);
|
||||
var swaggerService = new SwaggerService(hostUrl, "list");
|
||||
var swaggerService = new SwaggerService(hostUrl, "list", function(msg) {
|
||||
if(msg)
|
||||
messageController.showMessage(msg);
|
||||
else
|
||||
messageController.showMessage("Rendering page...");
|
||||
});
|
||||
swaggerService.init();
|
||||
|
||||
// Create convenience references to Spine models
|
||||
@@ -65,6 +111,8 @@ jQuery(function($) {
|
||||
|
||||
addAll: function() {
|
||||
this.ApiResource.each(this.addOne);
|
||||
messageController.clearMessage();
|
||||
$("#resources_container").slideDown();
|
||||
},
|
||||
|
||||
addOne: function(apiResource) {
|
||||
@@ -102,6 +150,7 @@ jQuery(function($) {
|
||||
renderApi: function(api) {
|
||||
var resourceApisContainer = "#" + this.apiResource.name + "_endpoint_list";
|
||||
ApiController.init({item: api, container: resourceApisContainer});
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
@@ -214,9 +263,13 @@ jQuery(function($) {
|
||||
|
||||
});
|
||||
|
||||
var apiSelectionController = ApiSelectionController.init();
|
||||
|
||||
var resourceListController = ResourceListController.init({baseUrl: "http://swagr.api.wordnik.com/v4/list.json"});
|
||||
var apiSelectionController = ApiSelectionController.init();
|
||||
if(this.baseUrl) {
|
||||
var resourceListController = ResourceListController.init({baseUrl: this.baseUrl});
|
||||
} else {
|
||||
apiSelectionController.slapOn();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user