+/**
+ * @desc Navigate with Keyboard from an article to another on an article's page
+ * @param string leftURL - URL of the article on the left
+ * @param string rightURL - URL of the article on the right
+ */
+
function navigateKeyboard(leftURL, rightURL) {
window.addEventListener("keydown", function (event) {
var key = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier versions
switch (key) {
case 37:
- goLeft(leftURL);
+ goLeft(leftURL); // left arrow
+ break;
+ case 72:
+ goLeft(leftURL); // h letter (vim style)
break;
case 39:
- goRight(rightURL);
+ goRight(rightURL); // right arrow
break;
+ case 76:
+ goRight(rightURL); // l letter (vim style)
+ break;
+ case 8:
+ window.history.back();
+
}
}, false);
window.location = window.location.origin + window.location.pathname + rightURL;
}
}
+
+
+/**
+ * @desc Do actions with Keyboard on an article's page
+ * @param number id - ID of the current article
+ */
+
+function actionArticle(id) {
+ window.addEventListener("keydown", function (event) {
+ var key = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier versions
+ switch (key) {
+ case 46:
+ deleteArticle(id); // delete key
+ break;
+ case 68:
+ deleteArticle(id); // d key letter
+ break;
+ case 70:
+ favoriteArticle(id); // f key letter
+ break;
+ case 77:
+ markReadArticle(id); // m key letter
+ break;
+ }
+
+ }, false);
+}
+
+function deleteArticle(id) {
+ if (id) {
+ window.location = window.location.origin + window.location.pathname + '?action=delete&id=' + id;
+ }
+}
+
+function favoriteArticle(id) {
+ if (id) {
+ window.location = window.location.origin + window.location.pathname + '?action=toggle_fav&id=' + id;
+ }
+}
+
+function markReadArticle(id) {
+ if (id) {
+ window.location = window.location.origin + window.location.pathname + '?action=toggle_archive&id=' + id;
+ }
+}
+
+function homeNavigation() {
+ selectedArticle = $('.entrie:first');
+ console.log("selected first article");
+ window.addEventListener("keydown", function (event) {
+ var key = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier versions
+ switch (key) {
+ case 37: // left arrow
+ selectedArticle = goSelectPrev(selectedArticle,1);
+ break;
+ case 72: // h letter (vim style)
+ selectedArticle = goSelectPrev(selectedArticle,1);
+ break;
+
+ case 39: // right arrow
+ selectedArticle = goSelectNext(selectedArticle,1);
+ break;
+ case 76: // l letter (vim style)
+ selectedArticle = goSelectNext(selectedArticle,1);
+ break;
+ case 13: // enter into article
+ enterArticle(selectedArticle);
+ break;
+ case 74: // j letter key
+ selectedArticle = goSelectNext(selectedArticle,3);
+ break;
+ case 40: // down arrow
+ selectedArticle = goSelectNext(selectedArticle,3);
+ break;
+ case 75: // k letter key
+ selectedArticle = goSelectNext(selectedArticle,3);
+ break;
+ case 38: // up arrow
+ selectedArticle = goSelectNext(selectedArticle,3);
+ break;
+ }
+
+ }, false);
+}
+
+function goSelectNext(selectedArticle,number) {
+ if (selectedArticle.next().length) {
+ selectedArticle.removeClass("eselected");
+ selectedArticle = selectedArticle.next();
+ selectedArticle.addClass("eselected");
+ console.log("Changed selected to next");
+ console.log("selectedArticle is now " + selectedArticle.attr("id"));
+ }
+ return selectedArticle;
+}
+
+
+function goSelectPrev(selectedArticle,number) {
+ if (selectedArticle.prev().length) {
+ selectedArticle.removeClass("eselected");
+ selectedArticle = selectedArticle.prev();
+ selectedArticle.addClass("eselected");
+ console.log("Changed selected to previous");
+ console.log("selectedArticle is now " + selectedArticle.attr("id"));
+
+ }
+ return selectedArticle;
+}
+
+function enterArticle(selectedArticle) {
+ window.location = selectedArticle.find('a:first').attr('href');
+}
\ No newline at end of file
transition: all 0.5s ease;
}
-.entrie:hover {
+.entrie:hover, .eselected {
box-shadow: 0 3px 10px rgba(0,0,0,1);
}
-.entrie:hover:after {
+.entrie:hover:after, .eselected:after {
height: 40px;
}
-.entrie:hover:before {
+.entrie:hover:before, .eselected:before {
bottom: 2.4em;
}
-.entrie:hover h2 a {
+.entrie:hover h2 a, .eselected h2 a {
color: #666;
}
line-height: 1.2;
}
- .entrie h2:after {
- content: none;
- }
+.entrie h2:after {
+ content: none;
+}
.entrie h2 a {
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}
-/*
-.entrie h2 a:after {
- content: "";
- position: absolute;
- top: 0;
- width: 100%;
- height: 100%;
- left: 0;
-}
-*/
.entrie p {
color: #666;
line-height: 1.7;
}
- .entrie h2 a:first-letter {
- text-transform: uppercase;
- }
-
-.entrie:hover .tools {
- bottom: 0;
+.entrie h2 a:first-letter {
+ text-transform: uppercase;
}
.entrie .tools {
transition: all 0.5s ease;
}
- .entrie .tools a {
- color: #666;
- text-decoration: none;
- display: block;
- padding: 0.4em;
- }
+.entrie:hover .tools, .eselected .tools {
+ bottom: 0;
+}
- .entrie .tools a:hover {
- color: #FFF;
- }
- .entrie .tools li {
- display: inline-block;
- }
+.entrie .tools a {
+ color: #666;
+ text-decoration: none;
+ display: block;
+ padding: 0.4em;
+}
+
+.entrie .tools a:hover {
+ color: #FFF;
+}
+
+.entrie .tools li {
+ display: inline-block;
+}
.entrie:nth-child(3n+1) {
margin-left: 0;