https://somethingsplendid.com/static/scripts/site.js

1var is_touch = (typeof Touch == "object");
2
3(function() {
4  var resize_timer;
5
6  var d,
7      w,
8      header_strip,
9      header,
10      tracer;
11
12  var page,
13      mode,
14      modes = {
15        1: 'large',
16        2: 'medium',
17        3: 'small'
18      };
19
20  var banner_heights = {
21        'large' : 366,
22        'medium': 306,
23        'small': 241
24      };
25
26  var BANNER_WIDTH = 1488,
27      BANNER_HEIGHT = 330,
28      CONDENSED_BANNER_HEIGHT = 135;
29
30  var logo_visible = true;
31
32  var kickstart = function() {
33    var width = parseInt(tracer.css('width'), 10);
34    if (width == 0) {
35      setTimeout(kickstart, 50);
36    }
37    else {
38      init();
39    }
40  }
41
42  var init = function() {
43    d = $(document);
44    w = $(window);
45    header_strip = $('#header-strip');
46    header = $('#header');
47    page = $('body').attr('id');
48
49    if (page == 'home') logo_visible = false;
50
51    w.resize(function() {
52      clearTimeout(resize_timer);
53      resize_timer = setTimeout(resize, 250);
54    });
55    resize();
56
57    w.scroll(scroll);
58  }
59
60  var resize = function() {
61    var old_mode = mode;
62    mode = modes[parseInt(tracer.css('width'), 10)];
63
64
65    if (old_mode != mode) {
66      $(document).trigger('splendid.size_change', mode);
67    };
68
69    var w_width = document.documentElement.clientWidth;
70
71    if (BANNER_WIDTH < w_width) {
72      b_width = w_width;
73    }
74    else {
75      b_width = BANNER_WIDTH;
76    }
77
78    var b_height = BANNER_HEIGHT;
79
80    if (mode == 'medium') {
81      b_height = banner_heights['medium'] - 36;
82      b_width = b_height * BANNER_WIDTH / BANNER_HEIGHT;
83    }
84
85    if (mode == 'small') {
86      b_height = banner_heights['small'] - 36;
87      b_width = b_height * BANNER_WIDTH / BANNER_HEIGHT;
88    }
89
90    if (b_width > BANNER_WIDTH) {
91      b_height = b_width * BANNER_HEIGHT / BANNER_WIDTH;
92    }
93
94    $('#header-strip-image img').css({ 
95      left: px((w_width - b_width) / 2),
96      width: px(b_width),
97      height: px(b_height)
98    });
99    scroll();
100  }
101
102  var scroll = function() {
103    if (is_touch) return;
104
105    if (mode == 'small') {
106      header_strip.css({ height: px(banner_heights['small'] - 36) }); 
107      header.css({ height: px(banner_heights['small'] - 36)});
108      return; 
109    }
110    var offset = w.scrollTop();
111    
112    if (offset < 0) offset = 0;
113    var h = banner_heights[mode];
114    var new_height = h - offset;
115    if (new_height < CONDENSED_BANNER_HEIGHT) new_height = CONDENSED_BANNER_HEIGHT;
116
117    header_strip.css({ height: px(new_height) }); 
118    header.css({ height: px(new_height - 36)}); 
119
120    var logo_was_visible = logo_visible;
121    logo_visible = (new_height == CONDENSED_BANNER_HEIGHT);
122
123    if (page == 'home' && logo_was_visible != logo_visible) {
124      opacity = (logo_was_visible) ? 0 : 1;
125      $('h1').stop(true, false).animate({ opacity: opacity }, 500);
126    }
127  }
128
129  // Bindings
130
131  $(function() {
132    tracer = $('#tracer');
133    kickstart();
134    
135    var email_form = $('#email-form');
136    
137    email_form.find('span').on('click', function() {
138      email_form.submit();
139    });
140    
141    email_form.on('submit', function() {
142      var email = email_form.find('input').val();
143      var data = { 'cm-yhktn-yhktn' : email };
144      $.ajax({
145        type: 'POST',
146        url: 'http://somethingsplendid.createsend.com/t/r/s/yhktn/',
147        data: data
148      });
149      
150      email_form.find('p.signup').animate({ opacity: 0 }, 500, function() {
151        $(this).remove();
152        email_form.find('p.thanks').css({ opacity: 0, display: 'block' }).animate({ opacity: 1 }, 500);
153      })
154      return false;
155    });
156    
157  });
158
159})();
160
161// Here be helpers
162
163var px = function(x) { return x + 'px' }
164 
165function relative_time(t) {
166  /*
167   * JavaScript Pretty Date
168   * Copyright (c) 2008 John Resig (jquery.com)
169   * Licensed under the MIT license.
170   */
171
172  time = t;
173  
174  var date = new Date(time),
175    diff = (((new Date()).getTime() - date.getTime()) / 1000),
176    day_diff = Math.floor(diff / 86400);
177
178  if ( isNaN(day_diff) || day_diff < 0 )
179    return;
180          
181  return day_diff == 0 && (
182      diff < 60 && "just now" ||
183      diff < 120 && "1 minute ago" ||
184      diff < 3600 && Math.floor( diff / 60 ) + " minutes ago" ||
185      diff < 7200 && "1 hour ago" ||
186      diff < 86400 && Math.floor( diff / 3600 ) + " hours ago") ||
187    day_diff == 1 && "Yesterday" ||
188    day_diff < 7 && day_diff + " days ago" ||
189    Math.ceil( day_diff / 7 ) + " weeks ago";
190}
191