diff --git a/_data/locales/en.yml b/_data/locales/en.yml
index 98e2c1a..15e5831 100644
--- a/_data/locales/en.yml
+++ b/_data/locales/en.yml
@@ -56,6 +56,7 @@ post:
posted: Posted
updated: Updated
views: Views
+ likes: Likes
words: words
pageview_measure: views
read_time:
diff --git a/_includes/comments/remark42.html b/_includes/comments/remark42.html
index 47cecf9..0bd6edd 100644
--- a/_includes/comments/remark42.html
+++ b/_includes/comments/remark42.html
@@ -1,40 +1,4 @@
-
-
-
\ No newline at end of file
+
+
+
\ No newline at end of file
diff --git a/_includes/head.html b/_includes/head.html
new file mode 100644
index 0000000..ad7f878
--- /dev/null
+++ b/_includes/head.html
@@ -0,0 +1,96 @@
+
+
+
+
+
+
+
+
+
+
+ {% capture seo_tags %}
+ {% seo title=false %}
+ {% endcapture %}
+
+ {% if page.image %}
+ {% assign img = page.image.path | default: page.image %}
+
+ {% unless img contains '://' %}
+ {% assign img_path = page.img_path | append: '/' | append: img | replace: '//', '/' %}
+ {% capture target %}"{{ img | absolute_url }}"{% endcapture %}
+
+ {% if site.img_cdn contains '//' %}
+
+ {% capture replacement %}"{{ site.img_cdn }}{{ img_path }}"{% endcapture %}
+ {% else %}
+
+ {%- capture replacement -%}
+ "{{ site.img_cdn | append: '/' | append: img_path | replace: '//', '/' | absolute_url }}"
+ {%- endcapture -%}
+ {% endif %}
+
+ {% assign seo_tags = seo_tags | replace: target, replacement %}
+ {% endunless %}
+ {% endif %}
+
+ {{ seo_tags }}
+
+
+ {%- unless page.layout == 'home' -%}
+ {{ page.title | append: ' | ' }}
+ {%- endunless -%}
+ {{ site.title }}
+
+
+ {% include_cached favicons.html %}
+
+ {% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %}
+
+
+ {% else %}
+ {% for cdn in site.data.origin[type].cdns %}
+
+
+ {% endfor %}
+
+
+ {% endif %}
+
+
+ {% if jekyll.environment == 'production' and site.google_analytics.id != empty and site.google_analytics.id %}
+
+
+
+
+
+ {% endif %}
+
+
+
+
+
+
+
+
+
+ {% if site.toc and page.toc %}
+
+ {% endif %}
+
+ {% if page.layout == 'page' or page.layout == 'post' %}
+
+
+ {% endif %}
+
+
+
+
+ {% unless site.theme_mode %}
+ {% include mode-toggle.html %}
+ {% endunless %}
+
+ {% include metadata-hook.html %}
+
diff --git a/_includes/likes.html b/_includes/likes.html
new file mode 100644
index 0000000..4f52229
--- /dev/null
+++ b/_includes/likes.html
@@ -0,0 +1,7 @@
+
+
+{% include loader.html id="likes-loader" %}
+
+
+
\ No newline at end of file
diff --git a/_includes/loader.html b/_includes/loader.html
index cde5386..39ccaf0 100644
--- a/_includes/loader.html
+++ b/_includes/loader.html
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/_includes/post-counter.html b/_includes/post-counter.html
deleted file mode 100644
index 37335d7..0000000
--- a/_includes/post-counter.html
+++ /dev/null
@@ -1,35 +0,0 @@
-
-{% include loader.html id="postcountloader" %}
-
-
-
-
\ No newline at end of file
diff --git a/_includes/views.html b/_includes/views.html
new file mode 100644
index 0000000..ea3f645
--- /dev/null
+++ b/_includes/views.html
@@ -0,0 +1,8 @@
+
+{% include loader.html id="views-loader" style="margin-right: 12px" %}
+
+
+
+
\ No newline at end of file
diff --git a/_layouts/post.html b/_layouts/post.html
index 7a723cc..fed7154 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -34,8 +34,8 @@ tail_includes:
-
- {% include post-counter.html tooltip=true lang=lang %}
+ {% include views.html tooltip=true lang=lang %}
+ {% include likes.html tooltip=true lang=lang %}
diff --git a/assets/css/heart.css b/assets/css/heart.css
new file mode 100644
index 0000000..d1b05cc
--- /dev/null
+++ b/assets/css/heart.css
@@ -0,0 +1,21 @@
+.heart-icon {
+ margin-bottom: -41px;
+ margin-right: -38px;
+ display: inline-flex;
+ width: 46px;
+ height: 46px;
+ transform: translate(-50%, -50%);
+ background: url(/assets/img/custom/heart.png) no-repeat;
+ background-position: 0 0;
+ cursor: pointer;
+}
+
+.heart-icon.liked {
+ animation: like-anim 0.7s steps(28) forwards;
+}
+
+@keyframes like-anim {
+ to {
+ background-position: right;
+ }
+}
\ No newline at end of file
diff --git a/assets/img/custom/heart.png b/assets/img/custom/heart.png
new file mode 100644
index 0000000..42ddc26
Binary files /dev/null and b/assets/img/custom/heart.png differ
diff --git a/assets/js/comments/remark42.js b/assets/js/comments/remark42.js
new file mode 100644
index 0000000..37434e1
--- /dev/null
+++ b/assets/js/comments/remark42.js
@@ -0,0 +1,28 @@
+var remark_config = {
+ host: remark42Host,
+ site_id: siteId,
+ components: ['embed'],
+
+ max_shown_comments: 10,
+ theme: modeToggle.modeStatus,
+
+ locale: 'en',
+ show_email_subscription: false
+};
+
+(function (c) {
+ for (var i = 0; i < c.length; i++) {
+ var d = document, s = d.createElement('script');
+ s.src = remark_config.host + '/web/' + c[i] + '.js';
+ s.defer = true;
+ (d.head || d.body).appendChild(s);
+ }
+})(remark_config.components || ['embed']);
+
+var targetDiv = document.getElementById("sidebar").getElementsByClassName("mode-toggle")[0];
+
+if (targetDiv != null) {
+ targetDiv.addEventListener("click", () => {
+ window.REMARK42.changeTheme(modeToggle.modeStatus === 'light' ? 'dark' : 'light');
+ })
+}
\ No newline at end of file
diff --git a/assets/js/common.js b/assets/js/common.js
new file mode 100644
index 0000000..ba847be
--- /dev/null
+++ b/assets/js/common.js
@@ -0,0 +1,16 @@
+var serviceUrl = document.currentScript.getAttribute('serviceurl');
+var siteId = document.currentScript.getAttribute('siteid');
+var postId = document.currentScript.getAttribute('postid');
+var remark42Host = document.currentScript.getAttribute('remark42host');
+
+function ajax(url) {
+ return new Promise(function (resolve, reject) {
+ var xhr = new XMLHttpRequest();
+ xhr.onload = function () {
+ resolve(this.responseText);
+ };
+ xhr.onerror = reject;
+ xhr.open('GET', url);
+ xhr.send();
+ });
+ }
diff --git a/assets/js/likes.js b/assets/js/likes.js
new file mode 100644
index 0000000..907a8f7
--- /dev/null
+++ b/assets/js/likes.js
@@ -0,0 +1,41 @@
+const heartIcon = document.querySelector(".heart-icon");
+const likesCount = document.getElementById("likes-count");
+const likesLoader = document.getElementById("likes-loader");
+
+likesLoader.style.display = "none"
+
+let likesAmount = likesCount.innerHTML;
+
+function apiCall(url) {
+ ajax(url)
+ .then(function (result) {
+ console.log(result);
+ likesCount.innerHTML = result;
+ likesLoader.style.display = "none"
+ likesCount.style.display = "inline-flex";
+ heartIcon.style.pointerEvents = 'auto';
+ })
+ .catch(function () {
+ likesLoader.style.display = "none";
+ likesCount.style.display = "inline-block";
+ });
+}
+
+var apiUrl = serviceUrl + "/GetPostLikes?siteId=" + siteId + "&postId=" + postId;
+
+apiCall(apiUrl);
+
+heartIcon.addEventListener("click", () => {
+ likesLoader.style.display = "inline-flex"
+ likesCount.style.display = "none";
+ heartIcon.style.pointerEvents = 'none';
+
+ heartIcon.classList.toggle("liked");
+ if (heartIcon.classList.contains("liked")) {
+ apiUrl = serviceUrl + "/LikePost?siteId=" + siteId + "&postId=" + postId;
+ } else {
+ apiUrl = serviceUrl + "/DislikePost?siteId=" + siteId + "&postId=" + postId;
+ }
+
+ apiCall(apiUrl);
+});
\ No newline at end of file
diff --git a/assets/js/views.js b/assets/js/views.js
new file mode 100644
index 0000000..8659033
--- /dev/null
+++ b/assets/js/views.js
@@ -0,0 +1,16 @@
+const viewsCount = document.getElementById("views-count");
+const viewsLoader = document.getElementById("views-loader");
+
+viewsCount.style.display = "none";
+viewsLoader.style.display = "inline-block"
+
+ajax(serviceUrl + "/GetPostViews?siteId=" + siteId + "&postId=" + postId)
+ .then(function (result) {
+ viewsCount.innerText = result;
+ viewsLoader.style.display = "none";
+ viewsCount.style.display = "inline-block";
+ })
+ .catch(function () {
+ viewsLoader.style.display = "none";
+ viewsCount.style.display = "inline-block";
+ });
\ No newline at end of file