fee7225d5ab191997c86ce2bc50ebfb7916e471b
2 * Main JS file for Tawau
5 jQuery(document
).ready(function($) {
8 'share-selected-text': true,
10 'infinite-scroll': true,
11 'infinite-scroll-step': 3,
12 'disqus-shortname': 'hauntedthemes-demo',
13 'content-api-host': 'https://work.njae.me.uk',
14 'content-api-key': 'fef214bac9c7c7e49bcc56f57b',
17 var w
= Math
.max(document
.documentElement
.clientWidth
, window
.innerWidth
|| 0),
18 h
= Math
.max(document
.documentElement
.clientHeight
, window
.innerHeight
|| 0),
24 var ghostAPI
= new GhostContentAPI({
25 host
: config
['content-api-host'],
26 key
: config
['content-api-key'],
33 $(window
).on('load', function(event
) {
39 var pathname
= window
.location
.pathname
;
40 var $result
= $('.post');
43 // remove hash params from pathname
44 pathname
= pathname
.replace(/#(.*)$/g, '').replace('/\//g', '/');
46 if ($('body').hasClass('paged')) {
47 currentPage
= parseInt(pathname
.replace(/[^0-9]/gi, ''));
50 // Load more posts on click
51 if (config
['load-more']) {
53 $('#load-posts').addClass('visible');
55 $('#load-posts').on('click', function(event
) {
56 event
.preventDefault();
58 if (currentPage
== maxPages
) {
59 $('#load-posts').addClass('hidden');
68 if ($('body').hasClass('paged')) {
73 var nextPage
= pathname
+ 'page/' + currentPage
+ '/';
75 if ($this.hasClass('step')) {
76 setTimeout(function() {
77 $this.removeClass('step');
82 $.get(nextPage
, function (content
) {
84 var post
= $(content
).find('.post').addClass('hidden');
85 $('#content.loop').append( post
);
86 $.each(post
, function(index
, val
) {
88 var id
= $(this).attr('data-id');
89 $('#content.loop').imagesLoaded( function() {
90 $this.removeClass('hidden');
98 if (config
['infinite-scroll'] && config
['load-more']) {
99 var checkTimer
= 'on';
100 if ($('#load-posts').length
> 0) {
101 $(window
).on('scroll', function(event
) {
103 if (isScrolledIntoView('#load-posts') && checkTimer
== 'on' && step
< config
['infinite-scroll-step']) {
104 $('#load-posts').click();
106 timer
= setTimeout(function() {
108 if (step
== config
['infinite-scroll-step']) {
109 $('#load-posts').addClass('step');
119 // Add classes and attributes for Fluidbox library
120 $('.post-content img').each(function(index
, el
) {
121 if (!$(this).parent().is("a") && !$(this).hasClass('error')) {
122 $( "<a href='" + $(this).attr('src') + "' class='zoom'></a>" ).insertAfter( $(this) );
123 $(this).appendTo($(this).next("a"));
127 $('.zoom').fluidbox();
129 var shareHeight
= $('.content-inner .social-share').height();
130 $(window
).on('scroll', function(event
) {
131 $('.zoom').fluidbox('close');
135 $('.content-inner .kg-image-wide, .content-inner .kg-image-full').each(function(index
, el
) {
136 var scrollTop
= $(window
).scrollTop();
137 var elementOffset
= $(this).offset().top
;
138 var imgDistance
= (elementOffset
- scrollTop
);
139 var imgHeight
= $(this).height();
140 var shareDistance
= shareHeight
+ 100;
141 if (imgDistance
< shareDistance
&& (imgDistance
+ imgHeight
) > 100) {
146 if (checkShare
> 0) {
147 $('.content-inner .social-share').addClass('fade');
149 $('.content-inner .social-share').removeClass('fade');
154 // Initialize shareSelectedText
155 if (config
['share-selected-text']) {
156 shareSelectedText('.content-inner .post-content', {
165 // Position social share buttons inside a single post
166 var checkIfSticky
= 0;
172 // Initialize Disqus comments
173 if ($('#content').attr('data-id') && config
['disqus-shortname'] != '') {
175 $('.comments').append('<div id="disqus_thread"></div>')
177 var url
= [location
.protocol
, '//', location
.host
, location
.pathname
].join('');
178 var disqus_config = function () {
180 this.page
.identifier
= $('#content').attr('data-id');
184 var d
= document
, s
= d
.createElement('script');
185 s
.src
= '//'+ config
['disqus-shortname'] +'.disqus.com/embed.js';
186 s
.setAttribute('data-timestamp', +new Date());
187 (d
.head
|| d
.body
).appendChild(s
);
191 // Search and Menu triggers
192 $('.search-trigger, .nav-trigger').on('click', function(event
) {
193 event
.preventDefault();
195 var className
= event
.currentTarget
.className
;
197 if ($('body').hasClass('scroll') && !$('body').hasClass('overflow-y')) {
201 if ($('body, html').hasClass('end-search-trigger') && $(this).hasClass('nav-trigger')) {
202 $('body, html').removeClass('begin-search-trigger end-search-trigger').addClass('begin-nav-trigger end-nav-trigger');
206 if ($('body, html').hasClass('end-nav-trigger') && $(this).hasClass('search-trigger')) {
207 $('body, html').removeClass('begin-nav-trigger end-nav-trigger').addClass('begin-search-trigger end-search-trigger');
211 if (!$('body').hasClass('end')) {
212 if (!$('body').hasClass('begin')) {
213 morphStart(className
);
216 morphReverse(className
);
220 var ghostSearch
= new GhostSearch({
221 host
: config
['content-api-host'],
222 key
: config
['content-api-key'],
223 input
: '#search-field',
225 template: function(result
) {
226 let url
= [location
.protocol
, '//', location
.host
].join('');
227 return '<li><a href="' + url
+ '/' + result
.slug
+ '/">' + result
.title
+ '</a></li>';
231 // Validate Subscribe input
232 $('.gh-signin').on('submit', function(event
) {
233 var email
= $('.gh-input').val();
234 if (!validateEmail(email
)) {
235 $('.gh-input').addClass('error');
236 setTimeout(function() {
237 $('.gh-input').removeClass('error');
239 event
.preventDefault();
243 // Animation for shareSelectedText
244 $('.tooltip').prependTo('.share-selected-text-inner');
245 $('.share-selected-text-btn').prependTo('.tooltip-content');
247 const config_tooltip
= {
251 easing
: 'easeOutQuad',
262 easing
: 'easeOutElastic',
273 {value
: '-30%', duration
: 130, easing
: 'easeInQuad'},
274 {value
: ['30%','0%'], duration
: 900, easing
: 'easeOutElastic'}
277 {value
: 0, duration
: 130, easing
: 'easeInQuad'},
278 {value
: 1, duration
: 130, easing
: 'easeOutQuad'}
281 {value
: '#6fbb95', duration
: 1, delay
: 130, easing
: 'easeOutQuad'}
289 easing
: 'easeInQuad',
295 easing
: 'easeInQuad',
302 {value
: '-30%', duration
: 200, easing
: 'easeInQuad'},
303 {value
: ['30%','0%'], duration
: 200, easing
: 'easeOutQuad'}
306 {value
: 0, duration
: 200, easing
: 'easeInQuad'},
307 {value
: 1, duration
: 200, easing
: 'easeOutQuad'}
310 {value
: '#666', duration
: 1, delay
: 200, easing
: 'easeOutQuad'}
316 $('.tooltip').each(function(index
, el
) {
318 var base
= $(this).find('.tooltip-base')[0];
319 var content
= $(this).find('.tooltip-content')[0];
320 $('.content-inner .post-content').bind('mouseup', function(e
){
321 if (window
.getSelection
|| document
.selection
) {
322 var sel
= window
.getSelection();
323 $this.mouseTimeout
= setTimeout(function() {
324 $this.isShown
= true;
325 animateTooltip('in', base
, content
);
329 $('body').bind('mousedown', function(e
){
330 if (window
.getSelection
|| document
.selection
) {
331 clearTimeout($this.mouseTimeout
);
332 if( $this.isShown
) {
333 $this.isShown
= false;
334 animateTooltip('out', base
, content
);
340 if (typeof Object
.assign
!= 'function') {
341 Object
.assign = function(target
) {
343 if (target
== null) {
344 throw new TypeError('Cannot convert undefined or null to object');
347 target
= Object(target
);
348 for (var index
= 1; index
< arguments
.length
; index
++) {
349 var source
= arguments
[index
];
350 if (source
!= null) {
351 for (var key
in source
) {
352 if (Object
.prototype.hasOwnProperty
.call(source
, key
)) {
353 target
[key
] = source
[key
];
362 // On scroll check if header should be visible or not
363 $(window
).on('scroll', function(event
) {
367 setInterval(function() {
368 if (didScroll
&& checkMorph
== false) {
375 $(window
).on('resize', function () {
377 w
= Math
.max(document
.documentElement
.clientWidth
, window
.innerWidth
|| 0);
380 $('.content-inner .post-content .social-share').trigger("sticky_kit:detach");
383 if (checkIfSticky
== 0) {
395 // Check if element is into view when scrolling
396 function isScrolledIntoView(elem
){
397 var docViewTop
= $(window
).scrollTop();
398 var docViewBottom
= docViewTop
+ $(window
).height();
400 var elemTop
= $(elem
).offset().top
;
401 var elemBottom
= elemTop
+ $(elem
).height();
403 return ((elemBottom
<= docViewBottom
) && (elemTop
>= docViewTop
));
406 // Get first number of words from a string
407 function getWords(str
) {
408 return str
.split(/\s+/).slice(0,44).join(" ");
411 // Morph effect start
412 function morphStart(c
){
413 var morphing
= anime({
414 targets
: '#morphing .path',
416 { value
: 'M 10,0 L 10,0 C 10,0 10,0 5,0 C 0,0 0,0 0,0 L 0,0 Z' },
417 { value
: 'M 10,0 L 10,0 C 10,0 10,5 5,5 C 0,5 0,0 0,0 L 0,0 Z' },
418 { value
: 'M10 0 L10 10 C10 10 10 10 5 10 C0 10 0 10 0 10 L0 0 '}
420 easing
: 'easeInOutQuint',
425 morphing
.begin = function(){
426 $('body, html').addClass('overflow-y begin ' + 'begin-' + c
);
429 morphing
.complete = function(){
430 $('body, html').addClass('overflow-y end ' + 'end-' + c
);
431 setTimeout(function() {
432 $('#search-field').focus();
438 // Morph effect reverse
439 function morphReverse(c
){
440 var morphing
= anime({
441 targets
: '#morphing .path',
443 { value
: 'M10 0 L10 10 C10 10 10 10 5 10 C0 10 0 10 0 10 L0 0' },
444 { value
: 'M 10,0 L 10,0 C 10,0 10,5 5,5 C 0,5 0,0 0,0 L 0,0 Z' },
445 { value
: 'M 10,0 L 10,0 C 10,0 10,0 5,0 C 0,0 0,0 0,0 L 0,0 Z '}
447 easing
: 'easeInOutQuint',
452 morphing
.begin = function(){
453 $('body, html').removeClass('overflow-y end ' + 'end-' + c
);
457 morphing
.complete = function(){
458 $('body, html').removeClass('overflow-y begin ' + 'begin-' + c
);
464 // Validate email input
465 function validateEmail(email
) {
466 var re
= /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
467 return re
.test(email
);
471 function setMorphHeight(){
472 var headerContainerHeight
= $('header .header-container').outerHeight();
475 top
: headerContainerHeight
+ 'px',
476 height
: 'calc(100vh - '+ headerContainerHeight
+'px)'
480 // Animate tooltip for shareSelectedText
481 function animateTooltip(dir
, base
, content
){
482 if ( config_tooltip
[dir
].base
) {
484 var baseAnimOpts
= {targets
: base
};
485 anime(Object
.assign(baseAnimOpts
, config_tooltip
[dir
].base
));
487 if ( config_tooltip
[dir
].content
) {
488 anime
.remove(content
);
489 var contentAnimOpts
= {targets
: content
};
490 anime(Object
.assign(contentAnimOpts
, config_tooltip
[dir
].content
));
494 // Initialize stick_in_parent
496 $('.content-inner .post-content .social-share').stick_in_parent({
501 // Show/Hide menu on scroll
502 function hasScrolled() {
503 var st
= $(this).scrollTop();
505 if(Math
.abs(lastScrollTop
- st
) <= delta
)
508 if(st
<= 0 || lastScrollTop
<= 0){
509 console
.log('do this');
510 $('body').removeClass('scroll');
511 }else if (st
> lastScrollTop
){
512 $('body').addClass('scroll');
514 if(st
+ $(window
).height() < $(document
).height()) {
515 $('body').removeClass('scroll');
522 // Initialize Highlight.js
523 $('pre code').each(function(i
, block
) {
524 hljs
.highlightBlock(block
);
527 // Set the right proportion for images inside the gallery
528 function setGalleryRation(){
529 $('.kg-gallery-image img').each(function(index
, el
) {
530 var container
= $(this).closest('.kg-gallery-image');
531 var width
= $(this)[0].naturalWidth
;
532 var height
= $(this)[0].naturalHeight
;
533 var ratio
= width
/ height
;
534 container
.attr('style', 'flex: ' + ratio
+ ' 1 0%');