Skip to content

Instantly share code, notes, and snippets.

Avatar

Sander Moolin SaFrMo

View GitHub Profile
@SaFrMo
SaFrMo / InfiniteScrollCheck.js
Created Jun 21, 2016
Infinite scroll on Teller
View InfiniteScrollCheck.js
// if not currently loading AND page has teaser AND page is scrolled to teaser area
var teaserHeight = 250;
if ( !jt2016.loadingPost && jQuery('.teaser').length && (jQuery('.teaser').offset().top < jt2016.sTop + jQuery(window).height() - teaserHeight) ) {
// get url from teaser element
var url = jQuery('.teaser').data('url');
// make new promise
jt2016.loadingPost = jQuery.ajax(url, {dataType: 'html'}).promise().done(function(data){
View iframe-fullscreen-sizer.js
// Make sure that iframe resizes correctly on fullscreen exit
// (ie, make Vimeo or YouTube videos return to the iFrame bounds on fullscreen exit)
var isFullscreen = false;
var videoSizer = null;
function onFullscreenToggle(){
var isFullscreen = document.fullscreenElement ||
document.webkitFullscreenElement ||
document.mozFullScreenElement ||
View sequential-fade.js
jQuery('SELECTOR').each(function(i) {
setTimeout(function() {
// ADD CALLBACK HERE
}.bind(this), i * 100);
});
View scroll-percentage.js
var windowHeight = jQuery(window).height();
var docHeight = jQuery(document).height();
var scrollTop = jQuery(window).scrollTop();
var trackLength = docHeight - windowHeight;
var amountScrolled = scrollTop / trackLength || 0;
View drop.js
https://drive.google.com/open?id=0B6nljQYu8gAsRlYxNDhZb3pFekE - individual
https://drive.google.com/open?id=0B6nljQYu8gAsNHFsTjI3R0Y1R28 - folder
@SaFrMo
SaFrMo / sizeImages.js
Created May 10, 2017
Given `container`, find dimensions of `content`. Mimics background-position `contain` or `cover`.
View sizeImages.js
// Given `container`, find dimensions of `content`. Mimic either CSS background-position `contain` or `cover`.
// Both `container` and `content` must have height and width attributes.
// aspect ratio > 1: image is portrait
// aspect ratio < 1: image is landscape
const contain = ( contents, container ) => {
// thanks to http://stackoverflow.com/questions/27939971/difference-between-background-sizecover-and-background-sizecontain
@SaFrMo
SaFrMo / 3am-readme.md
Last active Jun 21, 2017
Info for 3AM
View 3am-readme.md

Structure

  • Front Page/News (news pulls from Home Page category on posts)
    • Campaign
    • Campaign
    • ...
  • Work Grid
    • All
      • Work Detail
      • Work Detail
      • ...
View mv-readme.md

Notes

Front Page

  • The first, second, and third children of the front page will become the top left, bottom left, and portrait right images on the front page (just below the hero).
  • The three latest posts with the "Front Page" category will be rendered on the front page.

Work Grids

  • The first child of any given work grid will be rendered in the featured spot for that work grid.

Bios on About page

View carbon-readme.md

Notes

  • Add a child to a work-detail page to make it a campaign - the campaign's body will be in the child
  • Maria Carretero page has a few special details:
    • "Color" category is structured like this:
      * Color
          * Maria Carretero
              * First Block Title - Second Block Title
              * Other Spots
              * ...