mirror of
https://github.com/PokeAPI/pokeapi
synced 2024-11-25 04:40:21 +00:00
cleanup. navigation between version uis
This commit is contained in:
Zane Adickes
parent
00408c89e2
commit
f9e528dd38
13 changed files with 61 additions and 56 deletions
4
assets/pokemon_v2/css/app.min.css
vendored
4
assets/pokemon_v2/css/app.min.css
vendored
|
|
@ -1,8 +1,8 @@
|
|||
body{font-family:Lato,Sans-Serif;color:#212121;padding-top:53px}h1,h2,h3,h4,h5,h6{margin-top:0}ul{list-style:none}ul li{padding:0}pre.scroll{max-height:360px;overflow:scroll}.standard-pad{padding-top:40px}.hero{text-align:center}.center-block{float:none;margin:0 auto}.btn,.input-group-addon{border-radius:0}
|
||||
body{font-family:Lato,Sans-Serif;color:#212121;padding-top:53px}h1,h2,h3,h4,h5,h6{margin-top:0}ul{list-style:none}ul li{padding:0}pre.scroll{max-height:360px;overflow:scroll}.standard-pad{padding-top:40px}.hero{text-align:center;padding-bottom:40px}.center-block{float:none;margin:0 auto}.btn,.input-group-addon{border-radius:0}
|
||||
ul[side-nav]{padding:0}ul[side-nav] ul{padding-left:10px}
|
||||
.pokespinner{height:80px;width:80px;border-radius:50%;border:4px solid #00838f;background-color:#fff;overflow:hidden;position:relative;box-sizing:border-box;-webkit-animation:a 1.5s infinite linear;animation:a 1.5s infinite linear}.pokespinner:after,.pokespinner:before{display:block;content:""}.pokespinner:before{width:100%;height:40px;margin-top:-6px;background-color:#26c6da;border-bottom:4px solid #00838f}.pokespinner:after{width:10px;height:10px;background-color:#fff;position:absolute;top:40px;left:40px;margin:-10px 0 0 -10px;border-radius:50%;border:1px solid #00838f;box-shadow:0 0 0 2px #fff,0 0 0 6px #00838f}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
|
||||
|
||||
#contributors .contributor{position:relative;margin-bottom:30px}#contributors .contributor .avatar{width:100%;height:auto}
|
||||
header{background-color:#d9d9d9}header .title{font-size:2em;padding-top:6px;display:inline-block;font-weight:900}header .pokenav{float:right;padding:16px 0;margin:0}header .pokenav li{display:inline-block;margin-left:30px;font-size:1.1em}header .pokenav li a{cursor:pointer;color:#212121;font-weight:600}header .pokenav li a:hover{text-decoration:none}
|
||||
#docs{padding-top:40px}#docs table{width:100%;margin-bottom:20px}#docs table td,#docs table th{border:1px solid #ccc;padding:10px}#docs section{margin-bottom:60px}#docs h2{font-weight:900}#docs .request{font-size:1.4em;font-weight:300}#docs .models-tag,#docs .response-tag{font-style:italic;margin-bottom:3px;font-weight:300}#docs .models-tag:before,#docs .response-tag:before{display:inline-block;content:"example response"}#docs .models-tag:before{content:"response models"}
|
||||
header{background-color:#d9d9d9}header .title{font-size:2em;padding-top:6px;display:inline-block;font-weight:900}header .pokenav{float:right;padding:16px 0;margin:0}header .pokenav li{display:inline-block;margin-left:30px;font-size:1.1em}header .pokenav li a{cursor:pointer;color:#212121;font-weight:600}header .pokenav li a:hover{text-decoration:none}
|
||||
#home .title{font-weight:900}#home .v{font-size:.5em;font-weight:300}#home .try{font-weight:600}#home .request{width:100%;margin-bottom:30px}#home .request .endpoint button{border-right-style:none}#home .json-body{border:1px solid #d9d9d9;padding:20px;min-height:360px;max-height:360px;overflow:scroll}
|
||||
10
assets/pokemon_v2/js/app.min.js
vendored
10
assets/pokemon_v2/js/app.min.js
vendored
|
|
@ -1,9 +1,9 @@
|
|||
!function(){"use strict";angular.module("pokeapi_v2",["pokeapi-core","pokeapi-header","pokeapi-home","pokeapi-about","pokeapi-docs","pokeapi-contributors"]).config(["$locationProvider","$httpProvider",function(o,e){o.html5Mode(!0),e.defaults.xsrfCookieName="csrftoken",e.defaults.xsrfHeaderName="X-CSRFToken"}])}();
|
||||
!function(){"use strict";angular.module("pokeapi_v2",["pokeapi-core","pokeapi-header","pokeapi-home","pokeapi-about","pokeapi-docs","pokeapi-contributors"]).config(["$locationProvider","$stateProvider",function(o,e){o.html5Mode(!0),e.state("v1",{url:"v1/",controller:function(){window.location.reload(!0)}})}])}();
|
||||
!function(){"use strict";angular.module("pokeapi-about",["pokeapi-core"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-contributors",["pokeapi-core"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-core",["ui.router","jsonFormatter"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-docs",["pokeapi-core"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-header",[])}();
|
||||
!function(){"use strict";angular.module("pokeapi-docs",["pokeapi-core"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-home",["pokeapi-core"])}();
|
||||
!function(){"use strict";angular.module("pokeapi-about").config(["$stateProvider",function(t){t.state("about",{url:"/about",templateUrl:"static/pokemon_v2/partials/about.html"})}])}();
|
||||
!function(){"use strict";angular.module("pokeapi-contributors").config(["$stateProvider",function(t){t.state("contributors",{url:"/contributors",templateUrl:"static/pokemon_v2/partials/contributors.html",controller:"ContributorsController"})}])}();
|
||||
|
|
@ -11,8 +11,8 @@
|
|||
!function(){"use strict";angular.module("pokeapi-home").config(["$stateProvider",function(o){o.state("home",{url:"/",templateUrl:"static/pokemon_v2/partials/home.html",controller:"HomeController"})}])}();
|
||||
"use strict";angular.module("pokeapi-core").factory("APIService",["$http",function(e){var r="api/v2/",t={};return t.getResource=function(t,n){var u=e.get(r+t+n).then(function(e){return e});return u},t}]);
|
||||
"use strict";angular.module("pokeapi-core").factory("RepoService",["$http",function(t){var r="http://api.github.com/repos/phalt/pokeapi/",e=r+"contributors",o={};return o.getContributors=function(){var r=t.get(e).then(function(t){return t});return r},o}]);
|
||||
angular.module("pokeapi-core").directive("sideNav",["$window",function(n){return{restrict:"EA",templateUrl:"static/pokemon_v2/partials/side-nav.html",replace:!0,link:function(e,t,r){function a(n){return n.getAttribute("side-nav-title")||anchor.textContent}function o(){console.log("scroll")}e.nav=[];var l=null,c=angular.element(document.querySelectorAll("[side-nav-parent], [side-nav-child]"));for(i=0;i<c.length;i++)anchor=c[i],console.log(anchor),anchor.hasAttribute("side-nav-parent")?(l={},l.anchorText=a(anchor),l.children=[],e.nav.push(l)):l.children.push({anchorText:a(anchor)});console.log(e.nav),angular.element(n).bind("scroll",o)}}}]);
|
||||
"use strict";angular.module("pokeapi-core").directive("sideNav",["$window",function(e){return{restrict:"EA",templateUrl:"static/pokemon_v2/partials/side-nav.html",replace:!0,link:function(t){function n(){console.log("scroll")}function r(e){return e.getAttribute("side-nav-title")||e.textContent}t.nav=[];for(var l=null,a=angular.element(document.querySelectorAll("[side-nav-parent], [side-nav-child]")),i=0;i<a.length;i++){var o=a[i];o.hasAttribute("side-nav-parent")?(l={},l.anchorText=r(o),l.children=[],t.nav.push(l)):l.children.push({anchorText:r(o)})}angular.element(e).bind("scroll",n)}}}]);
|
||||
"use strict";angular.module("pokeapi-header").directive("pokeapiHeader",function(){return{restrict:"A",templateUrl:"static/pokemon_v2/partials/header.html",replace:!0}});
|
||||
"use strict";angular.module("pokeapi-contributors").controller("ContributorsController",["$scope","RepoService",function(o,t){o.failure=!1,o.contributors=[],t.getContributors().then(function(t){200==t.status?(o.contributors=t.data,console.log(t)):o.failure=!0})}]);
|
||||
"use strict";angular.module("pokeapi-contributors").controller("ContributorsController",["$scope","RepoService",function(o,t){o.failure=!1,o.contributors=[],t.getContributors().then(function(t){200===t.status?(o.contributors=t.data,console.log(t)):o.failure=!0})}]);
|
||||
"use strict";angular.module("pokeapi-home").controller("DocsController",[function(){}]);
|
||||
"use strict";angular.module("pokeapi-home").controller("HomeController",["$scope","APIService",function(e,o){function n(){document.querySelector(".json-body a")}e.loading=!1,e.failure=!1,e.dropdownExpanded=!1,e.endpointIndex=5,e.endpointOptions=["ability/","egg-group/","item/","move/","pokedex/","pokemon-species/","type/"],e.resourceID="1",e.resource=null,e.toggleDropdown=function(){e.dropdownExpanded=!e.dropdownExpanded},e.setEndpoint=function(o){e.endpointIndex=o},e.getResource=function(){e.loading=!0,o.getResource(e.endpointOptions[e.endpointIndex],e.resourceID).then(function(o){200===o.status?(e.resource=o.data,n()):e.failure=!0,e.loading=!1})},e.getResource()}]);
|
||||
"use strict";angular.module("pokeapi-home").controller("HomeController",["$scope","APIService",function(e,o){e.loading=!1,e.failure=!1,e.dropdownExpanded=!1,e.endpointIndex=5,e.endpointOptions=["ability/","egg-group/","item/","move/","pokedex/","pokemon-species/","type/"],e.resourceID="1",e.resource=null,e.toggleDropdown=function(){e.dropdownExpanded=!e.dropdownExpanded},e.setEndpoint=function(o){e.endpointIndex=o},e.getResource=function(){e.loading=!0,o.getResource(e.endpointOptions[e.endpointIndex],e.resourceID).then(function(o){200===o.status?e.resource=o.data:e.failure=!0,e.loading=!1})},e.getResource()}]);
|
||||
|
|
@ -7,6 +7,7 @@
|
|||
|
||||
<h1 class="title">Pokéapi <span class="v">v2</span> </h1>
|
||||
<h3>The Pokémon RESTful API</h3>
|
||||
<a ui-sref="v1">Looking for V1?</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,11 +8,10 @@ from django.contrib import admin
|
|||
from pokemon import urls as pokemon_urls
|
||||
from pokemon_v2 import urls as pokemon_v2_urls
|
||||
|
||||
urlpatterns = [
|
||||
|
||||
url(r'^', include(pokemon_urls)),
|
||||
# need to make sure v2 urls resolve last so angular routes have control
|
||||
v2 = [ url(r'^', include(pokemon_v2_urls)) ]
|
||||
|
||||
url(r'^', include(pokemon_v2_urls)),
|
||||
urlpatterns = [
|
||||
|
||||
url(r'^admin/', include(admin.site.urls)),
|
||||
|
||||
|
|
@ -24,4 +23,6 @@ urlpatterns = [
|
|||
'django.views.static.serve',
|
||||
{'document_root': settings.STATIC_ROOT}),
|
||||
|
||||
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
||||
url(r'^', include(pokemon_urls)),
|
||||
|
||||
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) + v2
|
||||
|
|
@ -34,8 +34,10 @@ api_resources.register(MoveResource())
|
|||
api_resources.register(PokedexResource())
|
||||
|
||||
urlpatterns = [
|
||||
|
||||
# url(r'^v1$', 'pokemon.views.home'),
|
||||
|
||||
url(r'^v1/$', 'pokemon.views.home'),
|
||||
url(r'^v1/?$', 'pokemon.views.home'),
|
||||
|
||||
url(r'^v1/docs/$',
|
||||
TemplateView.as_view(template_name='docs-v1.html'),
|
||||
|
|
|
|||
|
|
@ -12,14 +12,21 @@
|
|||
'pokeapi-contributors'
|
||||
])
|
||||
|
||||
.config(['$locationProvider', '$httpProvider',
|
||||
.config(['$locationProvider', '$stateProvider',
|
||||
|
||||
function ($locationProvider, $httpProvider) {
|
||||
function ($locationProvider, $stateProvider) {
|
||||
|
||||
$locationProvider.html5Mode(true);
|
||||
|
||||
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
|
||||
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
|
||||
// Allow navigation to V1. Leaves the single page app.
|
||||
$stateProvider.state('v1', {
|
||||
|
||||
url : 'v1/',
|
||||
controller : function () {
|
||||
|
||||
window.location.reload(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
]);
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ angular.module('pokeapi-contributors')
|
|||
|
||||
Repo.getContributors().then( function (response) {
|
||||
|
||||
if (response.status == 200) {
|
||||
if (response.status === 200) {
|
||||
|
||||
$scope.contributors = response.data;
|
||||
console.log(response);
|
||||
|
|
|
|||
|
|
@ -7,12 +7,7 @@ angular.module('pokeapi-core')
|
|||
|
||||
function ($http) {
|
||||
|
||||
var BASE_URL = "api/v2/";
|
||||
var ID = '/{id}';
|
||||
|
||||
// var ABILITY = BASE_URL + "ability";
|
||||
// var ABILITY_DETAIL = ABILITY + ID
|
||||
|
||||
var BASE_URL = 'api/v2/';
|
||||
var service = {};
|
||||
|
||||
service.getResource = function (endpoint, id) {
|
||||
|
|
@ -24,7 +19,7 @@ angular.module('pokeapi-core')
|
|||
});
|
||||
|
||||
return cb;
|
||||
}
|
||||
};
|
||||
|
||||
return service;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@ angular.module('pokeapi-core')
|
|||
|
||||
function ($http) {
|
||||
|
||||
var BASE_URL = "http://api.github.com/repos/phalt/pokeapi/"
|
||||
var CONTRIBUTORS_PATH = BASE_URL + "contributors";
|
||||
var BASE_URL = 'http://api.github.com/repos/phalt/pokeapi/';
|
||||
var CONTRIBUTORS_PATH = BASE_URL + 'contributors';
|
||||
|
||||
var service = {};
|
||||
|
||||
|
|
@ -21,7 +21,7 @@ angular.module('pokeapi-core')
|
|||
});
|
||||
|
||||
return cb;
|
||||
}
|
||||
};
|
||||
|
||||
return service;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
|
||||
'use strict';
|
||||
|
||||
angular.module('pokeapi-core')
|
||||
|
||||
.directive('sideNav', ['$window', function ($window) {
|
||||
|
|
@ -11,23 +13,31 @@ angular.module('pokeapi-core')
|
|||
|
||||
replace: true,
|
||||
|
||||
link: function (scope, element, attrs) {
|
||||
link: function (scope) {
|
||||
|
||||
function calculate () {
|
||||
|
||||
console.log('scroll');
|
||||
}
|
||||
|
||||
function getAnchorText (el) {
|
||||
|
||||
return el.getAttribute('side-nav-title') || el.textContent;
|
||||
}
|
||||
|
||||
scope.nav = [];
|
||||
var parent = null;
|
||||
var anchors = angular.element(document.querySelectorAll('[side-nav-parent], [side-nav-child]'));
|
||||
|
||||
for (i = 0; i < anchors.length; i++) {
|
||||
for (var i = 0; i < anchors.length; i++) {
|
||||
|
||||
anchor = anchors[i];
|
||||
|
||||
console.log(anchor);
|
||||
var anchor = anchors[i];
|
||||
|
||||
if (anchor.hasAttribute('side-nav-parent')) {
|
||||
|
||||
parent = {};
|
||||
parent.anchorText = getAnchorText(anchor);
|
||||
parent.children = []
|
||||
parent.children = [];
|
||||
scope.nav.push(parent);
|
||||
|
||||
} else {
|
||||
|
|
@ -40,20 +50,8 @@ angular.module('pokeapi-core')
|
|||
}
|
||||
}
|
||||
|
||||
console.log(scope.nav);
|
||||
|
||||
function getAnchorText (el) {
|
||||
|
||||
return el.getAttribute('side-nav-title') || anchor.textContent;
|
||||
}
|
||||
|
||||
angular.element($window).bind('scroll', calculate);
|
||||
|
||||
function calculate () {
|
||||
|
||||
console.log('scroll');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
}]);
|
||||
|
|
@ -37,6 +37,7 @@ pre.scroll {
|
|||
.hero {
|
||||
|
||||
text-align: center;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.center-block {
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ angular.module('pokeapi-home')
|
|||
if (response.status === 200) {
|
||||
|
||||
$scope.resource = response.data;
|
||||
intercept();
|
||||
// intercept();
|
||||
|
||||
} else {
|
||||
|
||||
|
|
@ -53,17 +53,17 @@ angular.module('pokeapi-home')
|
|||
|
||||
$scope.loading = false;
|
||||
}
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
$scope.getResource();
|
||||
|
||||
function intercept () {
|
||||
// function intercept () {
|
||||
|
||||
var links = document.querySelector('.json-body a');
|
||||
// var links = document.querySelector('.json-body a');
|
||||
|
||||
|
||||
}
|
||||
// }
|
||||
}
|
||||
|
||||
]);
|
||||
|
|
|
|||
|
|
@ -71,11 +71,11 @@ router.register(r"version-group", VersionGroupResource)
|
|||
###########################
|
||||
|
||||
urlpatterns = [
|
||||
|
||||
url(r'^api/v2/', include(router.urls)),
|
||||
|
||||
url(r'^$',
|
||||
url(r'^.*$',
|
||||
TemplateView.as_view(template_name='home.html'),
|
||||
name="home"
|
||||
),
|
||||
|
||||
url(r'^api/v2/', include(router.urls)),
|
||||
)
|
||||
]
|
||||
|
|
|
|||
Loading…
Reference in a new issue