wes
/
KettleBlog
1
0
Fork 0
Code Issues Pull Requests 15 Projects Releases Wiki Activity
Browse Source

update loaders

pull/1/head
wes 8 years ago
parent
e7c99fe4fe
commit
88c52a06c1
4 changed files with 30 additions and 22 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 14
      build/scripts/riotblog.min.js
  2. 10
      build/templates/index.html
  3. 18
      src/scripts/post.tag
  4. 10
      src/templates/index.html

14
build/scripts/riotblog.min.js
View File

File diff suppressed because one or more lines are too long

10
build/templates/index.html
View File

@ -1,17 +1,17 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<head> <head>
<link rel="stylesheet" href="/blog/styles/spectre.min.css"> <link rel="stylesheet" href="/styles/spectre.min.css">
<link rel="stylesheet" href="/blog/styles/riotblog.min.css"> <link rel="stylesheet" href="/styles/riotblog.min.css">
<link rel="stylesheet" href="/blog/styles/projects.min.css"> <link rel="stylesheet" href="/styles/projects.min.css">
<link rel="stylesheet" href="/blog/styles/animate.min.css"> <link rel="stylesheet" href="/styles/animate.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
</head> </head>
<html> <html>
<body> <body>
<section class="text-center nav navbar centered page-top navbar-section"> <section class="text-center nav navbar centered page-top navbar-section">
<h1 class="blog-title">WK</h1> <h1 class="blog-title">WTF</h1>
</section> </section>
<app></app> <app></app>
<footer class="footer"> <footer class="footer">

18
src/scripts/post.tag
View File

@ -1,8 +1,9 @@
<post> <post>
<div class="posts-box post centered"> <div class="posts-box post centered">
<div class="text-break animated fadeIn"> <div class="text-break animated fadeIn">
<loading if={this.loading}></loading>
<div <div
if={this.swipe} if={this.swipe && !this.loading}
class={`animated ${this.transition}`} class={`animated ${this.transition}`}
> >
<h4>{ this.title }</h4> <h4>{ this.title }</h4>
@ -40,7 +41,8 @@ self.nextloading = "";
self.transition = ""; self.transition = "";
self.nomore = false; self.nomore = false;
self.content = ""; self.content = "";
self.swipe = true; self.swipe = false;
self.loading = !self.opts.state.loaded;
prev(ev) { prev(ev) {
ev.preventDefault(); ev.preventDefault();
@ -53,7 +55,7 @@ prev(ev) {
self.opts.state.pid--; self.opts.state.pid--;
self.update(); self.update();
} }
self.update({"swipe" : false}); self.update({"swipe" : !self.swipe});
self.setPost(self.opts.state.pid, "fadeInLeft"); self.setPost(self.opts.state.pid, "fadeInLeft");
} }
@ -67,11 +69,12 @@ next(ev) {
self.opts.state.pid++; self.opts.state.pid++;
self.update(); self.update();
} }
self.update({"swipe" : false}); self.update({"swipe" : !self.swipe});
self.setPost(self.opts.state.pid, "fadeInRight"); self.setPost(self.opts.state.pid, "fadeInRight");
} }
setPost(pid, transition) { setPost(pid, transition) {
self.update({"loading" : self.opts.state.loaded});
fetch(`/blog/switchpost/${pid-1}`) fetch(`/blog/switchpost/${pid-1}`)
.then((resp) => resp.text()) .then((resp) => resp.text())
.then( .then(
@ -80,6 +83,7 @@ setPost(pid, transition) {
self.nomore = true; self.nomore = true;
self.prevloading = ""; self.prevloading = "";
self.nextloading = ""; self.nextloading = "";
self.loading = false;
self.update() self.update()
return; return;
} }
@ -89,9 +93,10 @@ setPost(pid, transition) {
self.prevloading = ""; self.prevloading = "";
self.nextloading = ""; self.nextloading = "";
self.nomore = true; self.nomore = true;
self.swipe = true; self.swipe = !self.swipe;
self.transition = ""; self.transition = "";
self.opts.state.pid--; self.opts.state.pid--;
self.loading = false;
self.update(); self.update();
return; return;
} }
@ -100,8 +105,9 @@ setPost(pid, transition) {
self.content = postcontent[0].doc.content[0]; self.content = postcontent[0].doc.content[0];
self.title = postcontent[0].doc.title[0]; self.title = postcontent[0].doc.title[0];
self.transition = transition; self.transition = transition;
self.swipe = true; self.swipe = !self.swipe;
self.nomore = false; self.nomore = false;
self.loading = false;
self.update(); self.update();
} }

10
src/templates/index.html
View File

@ -1,17 +1,17 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<head> <head>
<link rel="stylesheet" href="/blog/styles/spectre.min.css"> <link rel="stylesheet" href="/styles/spectre.min.css">
<link rel="stylesheet" href="/blog/styles/riotblog.min.css"> <link rel="stylesheet" href="/styles/riotblog.min.css">
<link rel="stylesheet" href="/blog/styles/projects.min.css"> <link rel="stylesheet" href="/styles/projects.min.css">
<link rel="stylesheet" href="/blog/styles/animate.min.css"> <link rel="stylesheet" href="/styles/animate.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
</head> </head>
<html> <html>
<body> <body>
<section class="text-center nav navbar centered page-top navbar-section"> <section class="text-center nav navbar centered page-top navbar-section">
<h1 class="blog-title">WK</h1> <h1 class="blog-title">WTF</h1>
</section> </section>
<app></app> <app></app>
<footer class="footer"> <footer class="footer">

Write Preview
Loading…
Cancel
Save