Skip to content
This repository has been archived by the owner on Jun 18, 2021. It is now read-only.

Commit

Permalink
Merge branch 'slim-jim'
Browse files Browse the repository at this point in the history
  • Loading branch information
@mmistakes
mmistakes committed Sep 3, 2015
2 parents 5ec435d + c2499a9 commit 6cddeac
Show file tree
Hide file tree
Showing 254 changed files with 4,791 additions and 8,047 deletions.
1 change: 0 additions & 1 deletion Gemfile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ source "https://rubygems.org"
gem "jekyll"
gem "jekyll-sitemap"
gem "sass"
gem "susy"
gem "breakpoint"
gem "jekyll-assets"
gem "uglifier"
Expand Down
3 changes: 0 additions & 3 deletions Gemfile.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,6 @@ GEM
sprockets-sass (1.3.1)
sprockets (~> 2.0)
tilt (~> 1.1)
susy (2.2.3)
sass (>= 3.3.0, < 3.5)
tilt (1.4.1)
timers (4.0.1)
hitimes
Expand All @@ -124,5 +122,4 @@ DEPENDENCIES
jekyll-sitemap
rouge
sass
susy
uglifier
25 changes: 21 additions & 4 deletions Gruntfile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,20 +35,37 @@ module.exports = function(grunt) {
dist: {
files: [{
expand: true,
cwd: 'images/',
cwd: '_svg/',
src: '{,*/}*.svg',
dest: 'images/'
dest: 'svg/'
}]
}
},
svgstore: {
options: {
prefix : 'icon-',
cleanup: false,
svg: {
style: 'display: none;'
}
},
default: {
files: {
'_includes/svg-icons.svg':
['svg/*.svg']
}
}
}
});

// Load tasks
grunt.loadNpmTasks('grunt-newer');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-svgmin');
grunt.loadNpmTasks('grunt-imgcompress');
grunt.loadNpmTasks('grunt-svgstore');
grunt.loadNpmTasks('grunt-svgmin');

// Register tasks
grunt.registerTask('images', ['newer:imgcompress', 'newer:svgmin']);
};
grunt.registerTask('svg', ['svgstore'])
};
29 changes: 29 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,3 +23,32 @@ Jekyll Assets is used to build, concatenate, MD5 fingerprint, and minify stylesh

1. Install dependencies `bundle install`
2. Run Jekyll server to preview `bundle exec jekyll serve --config _config.dev.yml --no-watch`. Good idea to disable auto-regeneration since the site is quite large and takes a few minutes to compile.

#### Home Page

The home page is made up of three parts:

`<root>/index.md`: here you will find the content that makes up the home page. It's 99% HTML to get the desired markup but the same result could probably be achieved with Kramdown if you add `{: .class-name}` to each of the required elements.

The *word slide* effect is achieved with some JavaScript and wrapping each of the adjectives in `<b></b>` elements inside of `.home__words-wrapper`. When JavaScript is disabled only the first word is visible.

`_layouts/home.html`: stripped down version of the default layout with the `.masthead` and `.colophon` removed.

`_sass/_home.scss`: home page specific styles.

#### Archives

To include the *Featured Posts* widget at the top of an archive page add the following to its YAML Front Matter and customize as necessary.

```
feature:
visible: true
headline: "Featured Articles"
category: articles
```

#### Posts and Pages

By default social sharing and Google AdSense are enabled on all posts and pages. To disable add `share: false` or `ads: false` to the YAML Front Matter.

Comments are disabled by default. To enable add `comments: true` to the YAML Front Matter.
276 changes: 193 additions & 83 deletions _assets/javascripts/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,202 @@

$(document).ready(function(){

// Off Canvas Sliding
// toggle menu, trigger, and screen on click
$('#js-menu-trigger,#js-menu-screen,#js-menu-close').on('click touchstart', function(e){
$('#js-menu,#js-menu-screen').toggleClass('is-visible');
$('#js-menu-trigger').toggleClass('close');
e.preventDefault();
});
// open/close primary navigation
$('.overlay__menu-trigger').on('click', function(){
// $('.cd-menu-icon').toggleClass('is-clicked');
// $('.cd-header').toggleClass('menu-is-open');

// in Firefox transitions break when parent overflow is changed, so we need to wait for the end of the transition to give the body an overflow hidden
if( $('.overlay__menu').hasClass('is--visible') ) {
$('.overlay__menu').removeClass('is--visible').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend',function(){
$('body').removeClass('overflow--hidden');
});
} else {
$('.overlay__menu').addClass('is--visible').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend',function(){
$('body').addClass('overflow--hidden');
});
}
});


// move table of contents from post body to sidebar
$(".post__body .js-toc").appendTo($(".toc--sidebar"));


// animate home page words

//set animation timing
var animationDelay = 2500,
//loading bar effect
barAnimationDelay = 3800,
barWaiting = barAnimationDelay - 3000, //3000 is the duration of the transition on the loading bar - set in the scss/css file
//letters effect
lettersDelay = 50,
//type effect
typeLettersDelay = 150,
selectionDuration = 500,
typeAnimationDelay = selectionDuration + 800,
//clip effect
revealDuration = 600,
revealAnimationDelay = 1500;

initHeadline();

function initHeadline() {
//insert <i> element for each letter of a changing word
singleLetters($('.home__excerpt.letters').find('b'));
//initialise headline animation
animateHeadline($('.home__excerpt'));
}

function singleLetters($words) {
$words.each(function(){
var word = $(this),
letters = word.text().split(''),
selected = word.hasClass('is--visible');
for (i in letters) {
if(word.parents('.rotate-2').length > 0) letters[i] = '<em>' + letters[i] + '</em>';
letters[i] = (selected) ? '<i class="in">' + letters[i] + '</i>': '<i>' + letters[i] + '</i>';
}
var newLetters = letters.join('');
word.html(newLetters);
});
}

function animateHeadline($headlines) {
var duration = animationDelay;
$headlines.each(function(){
var headline = $(this);

if(headline.hasClass('loading-bar')) {
duration = barAnimationDelay;
setTimeout(function(){ headline.find('.home__words-wrapper').addClass('is--loading') }, barWaiting);
} else if (headline.hasClass('clip')){
var spanWrapper = headline.find('.home__words-wrapper'),
newWidth = spanWrapper.width() + 10
spanWrapper.css('width', newWidth);
} else if (!headline.hasClass('type') ) {
//assign to .home__words-wrapper the width of its longest word
var words = headline.find('.home__words-wrapper b'),
width = 0;
words.each(function(){
var wordWidth = $(this).width();
if (wordWidth > width) width = wordWidth;
});
headline.find('.home__words-wrapper').css('width', width);
};

//trigger animation
setTimeout(function(){ hideWord( headline.find('.is--visible').eq(0) ) }, duration);
});
}

function hideWord($word) {
var nextWord = takeNext($word);

if($word.parents('.home__excerpt').hasClass('type')) {
var parentSpan = $word.parent('.home__words-wrapper');
parentSpan.addClass('selected').removeClass('waiting');
setTimeout(function(){
parentSpan.removeClass('selected');
$word.removeClass('is--visible').addClass('is--hidden').children('i').removeClass('in').addClass('out');
}, selectionDuration);
setTimeout(function(){ showWord(nextWord, typeLettersDelay) }, typeAnimationDelay);

} else if($word.parents('.home__excerpt').hasClass('letters')) {
var bool = ($word.children('i').length >= nextWord.children('i').length) ? true : false;
hideLetter($word.find('i').eq(0), $word, bool, lettersDelay);
showLetter(nextWord.find('i').eq(0), nextWord, bool, lettersDelay);

} else if($word.parents('.home__excerpt').hasClass('clip')) {
$word.parents('.home__words-wrapper').animate({ width : '2px' }, revealDuration, function(){
switchWord($word, nextWord);
showWord(nextWord);
});

} else if ($word.parents('.home__excerpt').hasClass('loading-bar')){
$word.parents('.home__words-wrapper').removeClass('is--loading');
switchWord($word, nextWord);
setTimeout(function(){ hideWord(nextWord) }, barAnimationDelay);
setTimeout(function(){ $word.parents('.home__words-wrapper').addClass('is--loading') }, barWaiting);

} else {
switchWord($word, nextWord);
setTimeout(function(){ hideWord(nextWord) }, animationDelay);
}
}

function showWord($word, $duration) {
if($word.parents('.home__excerpt').hasClass('type')) {
showLetter($word.find('i').eq(0), $word, false, $duration);
$word.addClass('is--visible').removeClass('is--hidden');

} else if($word.parents('.home__excerpt').hasClass('clip')) {
$word.parents('.home__words-wrapper').animate({ 'width' : $word.width() + 10 }, revealDuration, function(){
setTimeout(function(){ hideWord($word) }, revealAnimationDelay);
});
}
}

function hideLetter($letter, $word, $bool, $duration) {
$letter.removeClass('in').addClass('out');

if(!$letter.is(':last-child')) {
setTimeout(function(){ hideLetter($letter.next(), $word, $bool, $duration); }, $duration);
} else if($bool) {
setTimeout(function(){ hideWord(takeNext($word)) }, animationDelay);
}

if($letter.is(':last-child') && $('html').hasClass('no-csstransitions')) {
var nextWord = takeNext($word);
switchWord($word, nextWord);
}
}

function showLetter($letter, $word, $bool, $duration) {
$letter.addClass('in').removeClass('out');

if(!$letter.is(':last-child')) {
setTimeout(function(){ showLetter($letter.next(), $word, $bool, $duration); }, $duration);
} else {
if($word.parents('.home__excerpt').hasClass('type')) { setTimeout(function(){ $word.parents('.home__words-wrapper').addClass('waiting'); }, 200);}
if(!$bool) { setTimeout(function(){ hideWord($word) }, animationDelay) }
}
}

function takeNext($word) {
return (!$word.is(':last-child')) ? $word.next() : $word.parent().children().eq(0);
}

function takePrev($word) {
return (!$word.is(':first-child')) ? $word.prev() : $word.parent().children().last();
}

function switchWord($oldWord, $newWord) {
$oldWord.removeClass('is--visible').addClass('is--hidden');
$newWord.removeClass('is--hidden').addClass('is--visible');
}


// FitVids init
$("#main").fitVids();

// Fix widows in headlines
$('.entry-title').widowFix();

// smooth scroll init
$("a").smoothScroll({offset: -20});

// Add lightbox class to all image links

// bigfoot footnotes settings
var bigfoot = $.bigfoot(
{
deleteOnUnhover: false,
preventPageScroll: false,
activateOnHover: true
}
);


// add lightbox class to all image links
$("a[href$='.jpg'],a[href$='.png'],a[href$='.gif']").addClass("image-popup");


Expand Down Expand Up @@ -53,82 +235,10 @@ $(document).ready(function(){
});


// Lazy Load
// lazy load settings
$("img.load").show().lazyload({
effect: "fadeIn",
skip_invisible: false
});


// FitVids
// Target your .container, .wrapper, .post, etc.
$("#main").fitVids();


// Add anchor links after headlines
var anchorForId = function (id) {
var anchor = document.createElement("a");
anchor.className = "header-link";
anchor.href = "#" + id;
anchor.innerHTML = "<i class=\"fa fa-link\"></i>";
return anchor;
};

var linkifyAnchors = function (level, containingElement) {
var headers = containingElement.getElementsByTagName("h" + level);
for (var h = 0; h < headers.length; h++) {
var header = headers[h];

if (typeof header.id !== "undefined" && header.id !== "") {
header.appendChild(anchorForId(header.id));
}
}
};

document.onreadystatechange = function () {
if (this.readyState === "complete") {
var contentBlock = document.getElementsByClassName("page-content")[0];
if (!contentBlock) {
return;
}
for (var level = 1; level <= 6; level++) {
linkifyAnchors(level, contentBlock);
}
}
};


// Social share popup
function windowPopup(url, width, height) {
// Calculate the position of the popup so
// it’s centered on the screen.
var left = (screen.width / 2) - (width / 2),
top = (screen.height / 2) - (height / 2);

window.open(
url,
"",
"menubar=no,toolbar=no,resizable=yes,scrollbars=yes,width=" + width + ",height=" + height + ",top=" + top + ",left=" + left
);
}

$(".js-social-share").on("click", function(e) {
e.preventDefault();
windowPopup($(this).attr("href"), 500, 300);
});


// Smooth scroll
$('a').smoothScroll({offset: -20});


// footnotes
var bigfoot = $.bigfoot(
{
deleteOnUnhover: false,
preventPageScroll: false,
activateOnHover: true
}
);

});
Loading

0 comments on commit 6cddeac

Please sign in to comment.