summaryrefslogtreecommitdiff
path: root/public/assets/js
diff options
context:
space:
mode:
Diffstat (limited to 'public/assets/js')
-rw-r--r--public/assets/js/lib/router.js20
-rw-r--r--public/assets/js/lib/views/stream/hootstream.js40
-rw-r--r--public/assets/js/lib/views/stream/index.js22
-rw-r--r--public/assets/js/vendor/view/router.js117
4 files changed, 117 insertions, 82 deletions
diff --git a/public/assets/js/lib/router.js b/public/assets/js/lib/router.js
index bedf0b9..848c813 100644
--- a/public/assets/js/lib/router.js
+++ b/public/assets/js/lib/router.js
@@ -6,6 +6,12 @@ var SiteRouter = Router.extend({
"/index/:keyword": "index",
"/index": "index",
"/stream": "stream",
+ "/stream/thread": "stream",
+ "/stream/thread/:id": "streamThread",
+ "/stream/keyword": "streamKeyword",
+ "/stream/keyword/:keyword": "streamKeyword",
+ "/stream/profile": "streamProfile",
+ "/stream/profile/:username": "streamItem",
"/login": "login",
"/logout": "logout",
"/signup": "signup",
@@ -39,9 +45,19 @@ var SiteRouter = Router.extend({
app.view.load(keyword);
},
- stream: function (keyword) {
+ stream: function (target) {
app.view = new StreamView();
- app.view.load(keyword);
+ app.view.load(target || {});
+ },
+
+ streamKeyword: function (keyword) {
+ this.stream({ keyword: keyword });
+ },
+ streamThread: function (thread) {
+ this.stream({ thread: parseInt(thread) });
+ },
+ streamProfile: function (username) {
+ this.stream({ username: username });
},
login: function () {
diff --git a/public/assets/js/lib/views/stream/hootstream.js b/public/assets/js/lib/views/stream/hootstream.js
index 016c987..4be70bd 100644
--- a/public/assets/js/lib/views/stream/hootstream.js
+++ b/public/assets/js/lib/views/stream/hootstream.js
@@ -3,6 +3,10 @@ const IMAGE_REGEXP = /(.gif|.jpg|.jpeg|.png)$/gi;
var HootStream = View.extend({
el: "#hootstream",
+ events: {
+ "click a": "onClickLink",
+ },
+
initialize: function ({ parent }) {
this.parent = parent;
this.$hootevents = this.$("#hootevents");
@@ -10,6 +14,25 @@ var HootStream = View.extend({
this.threadTemplate = this.$(".threadTemplate").html();
this.lastlogTemplate = this.$(".lastlogTemplate").html();
this.fileTemplate = this.$(".fileTemplate").html();
+ this.onClickLink = this.onClickLink.bind(this);
+ },
+
+ onClickLink: function (event) {
+ // console.log(event.target.className, event.target.href);
+ const url = new URL(event.target.href);
+ switch (event.target.className) {
+ case "file":
+ // play audio?
+ break;
+ case "userLink":
+ case "threadLink":
+ case "keywordLink":
+ event.preventDefault();
+ console.log(">>", url.pathname);
+ app.router.go(url.pathname);
+ break;
+ }
+ // this.parent.onKeyword(keyword)
},
load: function (data) {
@@ -34,6 +57,10 @@ var HootStream = View.extend({
},
render: (template, object) => {
+ if (!template) {
+ console.log("No template", object);
+ return $("<div>No template</div>");
+ }
const rendered = Object.entries(object).reduce(
(newTemplate, [key, value]) =>
newTemplate.replace(new RegExp(`{{${key}}}`, "g"), value),
@@ -99,9 +126,9 @@ var HootStream = View.extend({
"<div class='divider dark'></div>",
this.renderHoot({
template: this.threadTemplate,
- hoot: `<a class="threadLink" href="/details/${thread.id}">${thread.title}</a>`,
+ hoot: `<a class="threadLink" href="/stream/thread/${thread.id}">${thread.title}</a>`,
keyword_link: thread.keyword
- ? `<a class="keywordLink" href="/stream/${thread.keyword}">${thread.keyword}</a>`
+ ? `<a class="keywordLink" href="/stream/keyword/${thread.keyword}">${thread.keyword}</a>`
: "",
username: thread.username,
className: postedToday ? "isRecent" : "",
@@ -155,7 +182,7 @@ var HootStream = View.extend({
});
},
- agglutinate: ({ threads, comments, files, hootbox, lastlog }) =>
+ agglutinate: ({ query, threads, comments, files, hootbox, lastlog }) =>
[
...threads.map((thread) => [
thread.id,
@@ -172,7 +199,12 @@ var HootStream = View.extend({
IMAGE_REGEXP.test(file.filename) ? "images" : "files",
file,
]),
- ...hootbox.map((hoot) => [1, hoot.date, "hoot", hoot]),
+ ...(query.has_query ? [] : hootbox).map((hoot) => [
+ 1,
+ hoot.date,
+ "hoot",
+ hoot,
+ ]),
...lastlog.map((user) => [1, user.lastseen, "lastlog", user]),
]
.sort((a, b) => b[1] - a[1])
diff --git a/public/assets/js/lib/views/stream/index.js b/public/assets/js/lib/views/stream/index.js
index d55a9c3..76dbfa8 100644
--- a/public/assets/js/lib/views/stream/index.js
+++ b/public/assets/js/lib/views/stream/index.js
@@ -1,8 +1,5 @@
var StreamView = View.extend({
- events: {},
-
- action: "/api/stream",
- keywordAction: "/api/keyword/",
+ action: "/api/stream/",
initialize: function (opt) {
// opt.parent = parent
@@ -14,21 +11,10 @@ var StreamView = View.extend({
// this.countdown = new Countdown({ parent: this });
},
- load: function (keyword) {
+ load: function ({ ...target }) {
$("body").addClass("index");
- // if (keyword) {
- // $(".subtitle").html(
- // '<a href="/">&lt; Home</a> &middot; <a href="/keywords">Keywords</a>'
- // );
- // this.threadbox.options.latest = false;
- // this.threadbox.options.welcome = false;
- // $.get(this.keywordAction + keyword, this.populate.bind(this));
- // } else {
- // this.hootbox.options.required = true;
- // this.threadbox.options.latest = true;
- // this.threadbox.options.welcome = true;
- // }
- $.get(this.action, this.populate.bind(this));
+ console.log(target);
+ $.get(this.action, target, this.populate.bind(this));
},
populate: function (data) {
diff --git a/public/assets/js/vendor/view/router.js b/public/assets/js/vendor/view/router.js
index 3b0d939..0f977e0 100644
--- a/public/assets/js/vendor/view/router.js
+++ b/public/assets/js/vendor/view/router.js
@@ -1,82 +1,83 @@
var Router = View.extend({
+ routeByHash: false,
- routeByHash: false,
+ go: function (url) {
+ this.parseRoute(url);
+ },
- go: function(url){
- this.parseRoute(url)
- },
-
- pushState: function(url){
- if (this.routeByHash) {
- window.location.hash = url
- }
- else if (window.history) {
- window.history.pushState(null, null, url)
- }
- },
+ pushState: function (url) {
+ if (this.routeByHash) {
+ window.location.hash = url;
+ } else if (window.history) {
+ window.history.pushState(null, null, url);
+ }
+ },
- route: function(){
- var path = this.routeByHash ? window.location.hash.substr(0) : window.location.pathname
- path = path || "/"
- this.originalPath = path
- this.parseRoute(path)
+ route: function () {
+ var path = this.routeByHash
+ ? window.location.hash.substr(0)
+ : window.location.pathname;
+ path = path || "/";
+ this.originalPath = path;
+ this.parseRoute(path);
},
-
- parseRoute: function(pathname){
-
- pathname = pathname.replace(/^#/, "")
-
- if (pathname[0] !== "/") { pathname = "/" + pathname }
+
+ parseRoute: function (pathname) {
+ pathname = pathname.replace(/^#/, "");
+
+ if (pathname[0] !== "/") {
+ pathname = "/" + pathname;
+ }
var routes = this.routes,
- path = pathname.split("/");
+ path = pathname.split("/");
for (var i = 0; i < path.length; i++) {
- if (! path[i].length) {
- path[i] = null
+ if (!path[i].length) {
+ path[i] = null;
}
}
- if (pathname in routes) {
- this[this.routes[pathname]]()
- return
+ if (pathname in routes) {
+ this[this.routes[pathname]]();
+ return;
}
-
- if (path[path.length-1] == null) {
- path.pop()
+
+ if (path[path.length - 1] == null) {
+ path.pop();
}
for (var route in routes) {
- var routePath = route.split("/")
+ var routePath = route.split("/");
if (routePath[1] == path[1]) {
- if (routePath[2] && routePath[2].indexOf(":") !== -1 && path[2] && (path[3] === routePath[3]) ) {
- this[this.routes[route]](path[2])
- return
- }
- else if (routePath[2] == path[2]) {
+ if (
+ routePath[2] &&
+ routePath[2].indexOf(":") !== -1 &&
+ path[2] &&
+ path[3] === routePath[3]
+ ) {
+ this[this.routes[route]](path[2]);
+ return;
+ } else if (routePath[2] == path[2]) {
if (routePath[3] && path[3]) {
if (routePath[3].indexOf(":") !== -1) {
- this[this.routes[route]](path[3])
- return
- }
- else if (routePath[3] == path[3]) {
- this[this.routes[route]]()
- return
+ this[this.routes[route]](path[3]);
+ return;
+ } else if (routePath[3] == path[3]) {
+ this[this.routes[route]]();
+ return;
}
+ } else if (!routePath[3] && !path[3]) {
+ this[this.routes[route]]();
+ return;
}
- else if (! routePath[3] && ! path[3]) {
- this[this.routes[route]]()
- return
- }
- }
- else if (! routePath[2] && (! path[2].length || ! path[2])) {
- this[this.routes[route]]()
- return
+ } else if (!routePath[2] && (!path[2].length || !path[2])) {
+ this[this.routes[route]]();
+ return;
}
}
}
- // Redirect to root on 404
- window.location = '/'
- }
-
-})
+ // Redirect to root on 404
+ window.location = "/";
+ },
+});