Anatomical “fugitive sheets” are illustrations of the body designed to display internal organs and structures using paper flaps. Their name arose from the frequency with which the accompanying sheets were torn or misplaced. This site reimagines the fugitive sheet as a misplaced code-snippet, framed within a randomly generated cut-out.
(function($) { $.fn.flowtype = function(options) { // Establish default settings/variables // ==================================== var settings = $.extend({ maximum : 9999, minimum : 1, maxFont : 9999, minFont : 1, fontRatio : 35 }, options), // Do the magic math // ================= changes = function(el) { var $el = $(el), elw = $el.width(), width = elw > settings.maximum ? settings.maximum : elw < settings.minimum ? settings.minimum : elw, fontBase = width / settings.fontRatio, fontSize = fontBase > settings.maxFont ? settings.maxFont : fontBase < settings.minFont ? settings.minFont : fontBase; $el.css('font-size', fontSize + 'px'); }; // Make the magic visible // ====================== return this.each(function() { // Context for resize callback var that = this; // Make changes upon resize $(window).resize(function(){changes(that);}); // Set changes on load changes(this); }); }; }(jQuery)); ;jQuery(function($) { //AJAX Filtering //Builds up the HTML for the product to be rendered. var productBuilder = function (product){ var productHTML = "<article>"; productHTML = productHTML + "<a href='/products/"+ product.handle +"'>"; productHTML = productHTML + "<img src='"+ product.images[0].src +"'/>"; productHTML = productHTML + "<h2>"+ product.title +"</h2>"; productHTML = productHTML + product.price; productHTML+="</a>"; productHTML+="</article>"; return productHTML; }; $('.filter__link').on('click', function(event){ event.preventDefault(); //We Slide back up the filter list filterList.removeClass('filter__list--show'); //We replace the title $('h1').html($(this).html()); //We grab the JSON url for the relevant collection var url = $(this).attr('href'); var jsonUrl = url + "/products.json"; $.ajax({ type: 'GET', url: jsonUrl, success: function(response){ window.history.pushState('', '', url); $('.product-list').html(""); $.each(response.products, function(){ var builtProduct = productBuilder(this); $('.product-list').append(builtProduct); }); } }); window.onpopstate = function() { $('body').load(location.href) }; }); }); ;var filterList = jQuery('.filter__list'); jQuery(function($) { /* Remove SVG images to avoid broken images in all browsers that don't support SVG. */ /*==========================*/ var supportsSVG = function() { return document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#Image', '1.1'); }; if (!supportsSVG()) { $('img[src*=".svg"]').remove(); } // Reveals truncated product description $('.read-more').on('click', function(event){ event.preventDefault(); $('.description__short').toggle(); $('.description__full').toggle(); }); // Check if slide-up input is empty $('.input-group input').keyup(function(){ if ($(this).val() != ""){ $(this).addClass('input--filled'); } else { $(this).removeClass('input--filled'); } }); $('.filter button').click(function(){ filterList.toggleClass('filter__list--show'); }); //$('article').flowtype({ // minimum : 500, // maximum : 1800, // minFont : 16, // maxFont : 20, // fontRatio : 30 //}); //var addToCartModal = function (response) { //}; $('.add-to-cart').on('click', function(event){ event.preventDefault(); Shopify.addItem($('.product__variant input').filter(':checked').val(), 1, function(response){ var getItemCount = $('.site-header__cart-link span'); var getItemCountHTML = getItemCount.html(); getItemCountHTML++; getItemCount.html(getItemCountHTML); var modalHTML = "<div class='cart-modal'><div class='cart-modal__inner'>"; modalHTML+="<span class='close-button'></span>"; modalHTML+="<h3>Added to Cart:</h3>"; modalHTML+=response.title; modalHTML = modalHTML + "<p>$" + response.price/100 + "</p>"; modalHTML+="<p><a class='button button--hl' href='/cart'>View Cart / Checkout</a></p>"; modalHTML+="</div></div>"; $('main').append(modalHTML); $('.cart-modal').click(function(){ $(this).hide(); }); }); }); }); ;jQuery(function($) { if($('body').hasClass('template-page-contact')){ $('.map--static').remove(); $('.maps').append('<div class="map--dynamic"></div>'); var map, center, bounds, geocoder; var isDraggable = $(document).width() > 480 ? true : false; var styles = [ { stylers: [ { hue: "#F6983D" } ] },{ featureType: "road", elementType: "geometry", stylers: [ { lightness: 100 }, { visibility: "simplified" } ] },{ featureType: "poi", stylers: [ { visibility: "off" } ] } ]; function initialize() { map = new google.maps.Map(document.querySelector('.map--dynamic'), { center: { lat: 39.899746, lng: -75.074360000000016}, zoom: 17, disableDefaultUI: true, scrollwheel: false, draggable: isDraggable, styles: styles } ); geocoder = new google.maps.Geocoder(); bounds = new google.maps.LatLngBounds(); } function addMarkerToMap(location){ var marker = new google.maps.Marker({map: map, position: location}); bounds.extend(location); } initialize(); var getAddress = $('.address').text(); geocoder.geocode({address: getAddress}, function(results, status){ if(status == google.maps.GeocoderStatus.OK){ addMarkerToMap(results[0].geometry.location); } }); google.maps.event.addDomListener(map, 'idle', function(){ center = map.getCenter(); }); $(window).resize(function(){ map.setCenter(center); }); } }); ;jQuery(function($) { var siteNavToggle = $('#sitenav__toggle'); var siteNavLabel = $('.sitenav__label'); // Changes hamburger into a 'x' var toggleActiveMenu = function () { siteNavLabel.toggleClass('sitenav__label--active'); }; // Close menu on-click $('.sitenav__menu, .sitenav__overlay').click(function(){ siteNavToggle.prop('checked', false); siteNavLabel.removeClass('sitenav__label--active'); }); siteNavLabel.click(function(){ toggleActiveMenu(); }); // Close menu on scroll //$(window).scroll(function (){ // if(siteNavLabel.hasClass('sitenav__label--active')){ // siteNavToggle.prop('checked', false); // toggleActiveMenu(); // } //}); });