Commit ce4a2c4e authored by agusmakmun's avatar agusmakmun
Browse files

Update feature search posts

parent 323cbb54
My Stack Problems
> This project forked and has been modified from [A simple grey theme for Jekyll](https://github.com/liamsymonds/simplygrey-jekyll)
> This project forked and has been modified from [A simple grey theme for Jekyll](https://github.com/liamsymonds/simplygrey-jekyll), and the search posts using [Super Search](https://github.com/chinchang/super-search)
![Screenshot Post](https://raw.githubusercontent.com/agusmakmun/agusmakmun.github.io/master/img/screenshot-post.png "Screenshot Post")
name: Agus Makmun
title: Stack Problems
description: My Personal Stack Problems
author: Agus Makmun
github: https://github.com/agusmakmun
about: I am freelance developer. Currently doing more in backend, actually in Python and Django.
urls:
......
......@@ -6,7 +6,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="/img/favicon.ico" />
<title>{% if page.title %} {{ page.title }} {% else %} {{ site.name }} {% endif %}</title>
<title>{% if page.title %}{{ page.title }} - {{ site.title }}{% else %}{{ site.author }}{% endif %}</title>
<meta name="author" content="{{ site.author }}" />
<meta name="description" content="{% if page.title %}{{ page.title }}{% else %}{{ site.description }}{% endif %}" />
<meta name="keywords" content="{% if page.title %}{{ page.title }}, {{ site.title }}, {% for categ in page.categories %}{{ categ }}{% if forloop.last == false %}, {% endif %}{% endfor %}{% else %}{{ site.title }}, {% for category in site.categories %}{% capture categories_slug %}{{ category | first }}{% endcapture %}{% for categ in categories_slug %}{{ categ }}{% endfor %}{% if forloop.last == false %}, {% endif %}{% endfor %}{% endif %}" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed.xml">
<!-- syntax highlighting CSS -->
<link rel="stylesheet" href="/css/syntax.css">
......@@ -17,7 +21,8 @@
<!-- Fonts -->
<link href="//fonts.googleapis.com/css?family=Roboto+Condensed:400,300italic,300,400italic,700&amp;subset=latin,latin-ext" rel="stylesheet" type="text/css">
<!-- Custom CSS -->
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/super-search.css">
<link rel="stylesheet" href="/css/main.css">
</head>
......@@ -25,13 +30,20 @@
<div class="container">
<div class="col-sm-3">
<a href="/"><img id="about" src="/img/avatar.jpg" height="75px" width="75px" /></a>
<h1 class="author-name">{{ site.name }}</h1>
<h1 class="author-name">{{ site.author }}</h1>
{% if site.about %}
<div id="about">
{{ site.about }}
</div>
{% endif %}
<hr />
<div class="search" id="js-search">
<input type="text" placeholder="(sitemap)~$ type to search" class="search__input form-control" id="js-search__input">
<ul class="search__results" id="js-search__results"></ul>
</div>
<hr />
<strong>Navigation</strong><br />
&raquo; <a href="/">Home</a> <br />
{% for i in site.urls %}
......@@ -43,7 +55,7 @@
{{ content }}
<footer>
&copy; {{ site.name }}
&copy; {{ site.author }}
{% if site.github %}
- <a href="{{ site.github }}">{{ site.github }}</a> - Powered by Jekyll.
{% endif %}
......@@ -56,5 +68,6 @@
<!-- Placed at the end of the document so the pages load faster -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/super-search.js"></script>
</body>
</html>
......@@ -25,7 +25,7 @@ layout: default
<ul>
{% endif %}
<li class="relatedPost">
<a href="{{ site.url }}{{ post.url }}">{{ post.title }}</a>
<a href="{{ site.url }}{{ post.url }}">{{ post.title }}</a>
{% if post.categories %}
(Categories: {% for category in post.categories %}<a href="/category/{{ category }}">{{ category }}</a>{% if forloop.last == false %}, {% endif %}{% endfor %})
{% endif %}
......
/* Super Search
Author: Kushagra Gour (http://kushagragour.in)
MIT Licensed
*/
input#js-search__input {
font-size: 12px;
font-family: "Roboto Condensed", Arial, sans-serif;
}
.is-active .search__input {
transform: translateY(0);
}
.search__results {
list-style: none;
padding: 0;
overflow-x: hidden;
height: calc(100% - 110px);
transition: 0.2s ease;
}
.search__results.is-hidden {
opacity: 0;
transform: translateY(-1vh);
display: none;
}
.search__results > li {
border-top: 1px solid #f0f0f0;
}
.search__results > li > a {
display: block;
padding: 10px;
}
.search__result-date {
color: #BBB;
position: absolute;
right: 12px;
}
.search.is-active {
opacity: 1;
visibility: visible;
}
\ No newline at end of file
/* Super Search
Author: Kushagra Gour (http://kushagragour.in)
MIT Licensed
*/
(function () {
var isSearchOpen = false,
searchEl = document.querySelector('#js-search'),
searchInputEl = document.querySelector('#js-search__input'),
searchResultsEl = document.querySelector('#js-search__results'),
currentInputValue = '',
lastSearchResultHash,
posts = [];
// Changes XML to JSON
// Modified version from here: http://davidwalsh.name/convert-xml-json
function xmlToJson(xml) {
// Create the return object
var obj = {};
if (xml.nodeType == 1) { // element
// do attributes
if (xml.attributes.length > 0) {
obj["@attributes"] = {};
for (var j = 0; j < xml.attributes.length; j++) {
var attribute = xml.attributes.item(j);
obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
}
}
} else if (xml.nodeType == 3) { // text
obj = xml.nodeValue;
}
// do children
// If all text nodes inside, get concatenated text from them.
var textNodes = [].slice.call(xml.childNodes).filter(function (node) { return node.nodeType === 3; });
if (xml.hasChildNodes() && xml.childNodes.length === textNodes.length) {
obj = [].slice.call(xml.childNodes).reduce(function (text, node) { return text + node.nodeValue; }, '');
}
else if (xml.hasChildNodes()) {
for(var i = 0; i < xml.childNodes.length; i++) {
var item = xml.childNodes.item(i);
var nodeName = item.nodeName;
if (typeof(obj[nodeName]) == "undefined") {
obj[nodeName] = xmlToJson(item);
} else {
if (typeof(obj[nodeName].push) == "undefined") {
var old = obj[nodeName];
obj[nodeName] = [];
obj[nodeName].push(old);
}
obj[nodeName].push(xmlToJson(item));
}
}
}
return obj;
}
function getPostsFromXml(xml) {
var json = xmlToJson(xml);
return json.channel.item;
}
var xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","/sitemap.xml");
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState != 4) return;
if (xmlhttp.status != 200 && xmlhttp.status != 304) { return; }
var node = (new DOMParser).parseFromString(xmlhttp.responseText, 'text/xml');
node = node.children[0];
posts = getPostsFromXml(node);
}
xmlhttp.send();
window.toggleSearch = function toggleSearch() {
_gaq.push(['_trackEvent', 'supersearch', searchEl.classList.contains('is-active')]);
searchEl.classList.toggle('is-active');
if (searchEl.classList.contains('is-active')) {
// while opening
searchInputEl.value = '';
} else {
// while closing
searchResultsEl.classList.add('is-hidden');
}
setTimeout(function () {
searchInputEl.focus();
}, 210);
}
window.addEventListener('keyup', function onKeyPress(e) {
if (e.which === 27) {
toggleSearch();
}
});
window.addEventListener('keypress', function onKeyPress(e) {
if (e.which === 47 && !searchEl.classList.contains('is-active')) {
toggleSearch();
}
});
searchInputEl.addEventListener('input', function onInputChange() {
var currentResultHash, d;
currentInputValue = searchInputEl.value;
if (!currentInputValue || currentInputValue.length < 3) {
lastSearchResultHash = '';
searchResultsEl.classList.add('is-hidden');
return;
}
searchResultsEl.style.offsetWidth;
var matchingPosts = posts.filter(function (post) {
if (post.title.indexOf(currentInputValue) !== -1 || post.description.indexOf(currentInputValue) !== -1) {
return true;
}
});
if (!matchingPosts.length) {
searchResultsEl.classList.add('is-hidden');
}
currentResultHash = matchingPosts.reduce(function(hash, post) { return post.title + hash; }, '');
if (matchingPosts.length && currentResultHash !== lastSearchResultHash) {
searchResultsEl.classList.remove('is-hidden');
searchResultsEl.innerHTML = matchingPosts.map(function (post) {
d = new Date(post.pubDate);
return '<li><a href="' + post.link + '">' + post.title + '<span class="search__result-date">' + d.toUTCString().replace(/.*(\d{2})\s+(\w{3})\s+(\d{4}).*/,'$2 $1, $3') + '</span></a></li>';
}).join('');
}
lastSearchResultHash = currentResultHash;
});
})();
\ No newline at end of file
---
layout: null
---
<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ site.title | xml_escape }}</title>
<description>{{ site.description | xml_escape }}</description>
<link>{{ site.url }}{{ site.baseurl }}/</link>
<atom:link href="{{ "/sitemap.xml" | prepend: site.baseurl | prepend: site.url }}" rel="self" type="application/rss+xml"/>
<pubDate>{{ site.time | date_to_rfc822 }}</pubDate>
<lastBuildDate>{{ site.time | date_to_rfc822 }}</lastBuildDate>
<generator>Jekyll v{{ jekyll.version }}</generator>
{% for post in site.posts %}
<item>
<title>{{ post.title | xml_escape }}</title>
<description>{{ post.content | xml_escape }}</description>
<pubDate>{{ post.date | date_to_rfc822 }}</pubDate>
<link>{{ post.url | prepend: site.baseurl | prepend: site.url }}</link>
<guid isPermaLink="true">{{ post.url | prepend: site.baseurl | prepend: site.url }}</guid>
{% for tag in post.tags %}
<category>{{ tag | xml_escape }}</category>
{% endfor %}
{% for cat in post.categories %}
<category>{{ cat | xml_escape }}</category>
{% endfor %}
</item>
{% endfor %}
</channel>
</rss>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment