1 changed files with 0 additions and 140 deletions
@ -1,140 +0,0 @@ |
|||
<app> |
|||
<ul class="navigate tab tab-block"> |
|||
<li |
|||
class={"navigate-tab tab-item animated fadeIn " + (this.active.posts ? "active" : "")} |
|||
data-is="navtab" |
|||
active={ this.active.posts } |
|||
to={this.to("posts")} |
|||
title="Posts" |
|||
> |
|||
</li> |
|||
<li |
|||
class={"navigate-tab tab-item animated fadeIn " + (this.active.projects ? "active" : "")} |
|||
data-is="navtab" |
|||
active={ this.active.projects } |
|||
to={this.to("projects")} |
|||
title="Projects" |
|||
> |
|||
</li> |
|||
<li |
|||
class={"navigate-tab tab-item animated fadeIn " + (this.active.links ? "active" : "")} |
|||
data-is="navtab" |
|||
active={ this.active.links } |
|||
to={this.to("links")} |
|||
title="Links" |
|||
> |
|||
</li> |
|||
<li |
|||
class={"navigate-tab tab-item animated fadeIn " + (this.active.about ? "active" : "")} |
|||
data-is="navtab" |
|||
active={ this.active.about } |
|||
to={this.to("about")} |
|||
title="About" |
|||
> |
|||
</li> |
|||
</ul> |
|||
<div class="projects-content"> |
|||
<loading if={!this.state.loaded}></loading> |
|||
<projectsview |
|||
class="animated fadeInDown" |
|||
if={this.active.projects && this.state.loaded} |
|||
state={this.state} |
|||
ref="projectsview" |
|||
> |
|||
</projectsview> |
|||
</div> |
|||
<div class="content"> |
|||
<postsview |
|||
state={this.state} |
|||
if={this.active.posts} |
|||
ref="postsview" |
|||
> |
|||
</postsview> |
|||
</div> |
|||
<script> |
|||
import './navtab.tag'; |
|||
import './projectsview.tag'; |
|||
import './postsview.tag'; |
|||
import './loading.tag'; |
|||
|
|||
import Z from './zipper.js'; |
|||
import {default as R} from 'ramda'; |
|||
import route from 'riot-route'; |
|||
import lens from './lenses.js'; |
|||
|
|||
this.R = R; |
|||
this.route = route; |
|||
this.riot = riot; |
|||
|
|||
this.state = { |
|||
"pid" : 1, |
|||
"projects" : Z.empty, |
|||
"loaded" : false |
|||
}; |
|||
|
|||
this.active = { |
|||
"projects" : false, |
|||
"posts" : false, |
|||
"links" : false, |
|||
"about" : false |
|||
}; |
|||
|
|||
var self = this; |
|||
|
|||
function activate(page) { |
|||
return function() { |
|||
console.log(`trying to activate ${page}`); |
|||
self.active = lens.setActive(lens.actives(self.active), page).toJS(); |
|||
self.update(); |
|||
}; |
|||
} |
|||
|
|||
self.projects = activate("projects"); |
|||
self.about = activate("about"); |
|||
self.links = activate("links"); |
|||
|
|||
self.posts = function(pid) { |
|||
self.state.pid = parseInt(pid, 10); |
|||
activate("posts")(); |
|||
self.update(); |
|||
} |
|||
|
|||
to(name) { |
|||
return (function(e) { |
|||
/* This may or may not be used as an event handler */ |
|||
if (e !== undefined) { |
|||
e.preventDefault(); |
|||
} |
|||
this.route(name); |
|||
return; |
|||
}).bind(this); |
|||
} |
|||
|
|||
this.route("posts", self.to(`posts/${self.state.pid}`)); |
|||
this.route("posts/*", self.posts); |
|||
this.route("/", self.to("posts")); |
|||
this.route("projects", self.projects); |
|||
this.route("about", self.about); |
|||
this.route("links", self.links); |
|||
|
|||
this.on("mount", () => { |
|||
route.start(true); |
|||
}); |
|||
|
|||
function loaduser() { |
|||
/* https://api.github.com/users/${self.username}/repos?sort=updated&direction=desc */ |
|||
axios.get(`/blog/projects`) |
|||
.then(function(resp) { |
|||
self.state.projects = Z.fromList( |
|||
resp.data.filter( |
|||
R.pathEq(["fork"], false))); |
|||
|
|||
self.state.loaded = true; |
|||
self.update(); |
|||
}); |
|||
} |
|||
|
|||
this.on("mount", loaduser); |
|||
|
|||
</script> |
|||
</app> |
Loading…
Reference in new issue