/*
* Girlfriend
* presents:
*
* Gant, developed for Monolith NYC
*/
(function($, o){
// create overscroll
o = $.fn.overscroll = function(options) {
return this.each(function(){
o.init($(this), options);
});
};
$.extend(o, {
// events handled by overscroll
events: {
wheel: "mousewheel DOMMouseScroll",
start: "select mousedown touchstart",
drag: "mousemove touchmove",
end: "mouseup mouseleave touchend",
scroll: "scroll",
ignored: "dragstart drag"
},
// to save a couble bits
div: "",
// constants used to tune scrollability and thumbs
constants: {
scrollDuration: 800,
captureThreshold: 4,
wheelDeltaMod: -18,
scrollDeltaMod: 5.7,
thumbThickness: 8,
thumbOpacity: 0.7,
boundingBox: 1000000
},
// main initialization function
init: function(target, options, data) {
data = {
sizing: o.getSizing(target)
};
// gesture detect
var el = document.createElement('div');
el.setAttribute('ongesturestart', 'return;');
if(typeof el.ongesturestart == "function"){
o.touchEvents = true;
}
options = $.extend({}, (options || {}));
target.css({"overflow": "hidden"})
.bind(o.events.wheel, data, o.wheel)
.bind(o.events.start, data, o.start)
.bind(o.events.end, data, o.stop)
.bind(o.events.ignored, function(){return false;}); // disable proprietary drag handlers
target.bind(o.events.ignored, function(){return false;});
target.bind(o.events.start, function(){return false;});
data.target = target;
if( options.scrollBar ) {
if( options.scrollBar.horizontal ) {
data.$horizontal = options.scrollBar.horizontal;
data.$horizontal_track = options.scrollBar.horizontal.parent();
data.$horizontal.bind(o.events.ignored, function(){return false;});
data.$horizontal.bind(o.events.start, function(){return false;});
data.$horizontal_track.bind(o.events.ignored, function(){return false;});
data.$horizontal_track.bind(o.events.start, function(){return false;});
};
if( options.scrollBar.vertical ) {
data.$vertical = options.scrollBar.vertical;
data.$vertical_track = data.$vertical.parent();
data.$vertical.bind(o.events.ignored, function(){return false;});
data.$vertical.bind(o.events.start, function(){return false;});
data.$vertical_track.bind(o.events.ignored, function(){return false;});
data.$vertical_track.bind(o.events.start, function(){return false;});
}
// setup the scrollbars
if( options.scrollBar.horizontal || options.scrollBar.vertical ) {
target.bind(o.events.scroll, data, o.scroll);
o.setupScrollBars(data);
}
}
if( options.scroll ) {
data.scroll = options.scroll;
}
data.options = options;
},
// handles mouse wheel scroll events
wheel: function(event, delta) {
if ( event.wheelDelta ) { delta = event.wheelDelta/12000; }
if ( event.detail ) { delta = -event.detail/3; }
// stop animate
event.data.target.stop(true, true);
if( event.data.$vertical ) {
/* event.data.target.animate({
'scrollTop': (event.data.target.scrollTop() + (delta * o.constants.wheelDeltaMod))
}); */
event.data.target.scrollTop( event.data.target.scrollTop() + (delta * o.constants.wheelDeltaMod) );
} else {
/* event.data.target.animate({
'scrollLeft': (event.data.target.scrollLeft() + (delta * o.constants.wheelDeltaMod))
}); */
event.data.target.scrollTop( (event.data.target.scrollTop() + (delta * o.constants.wheelDeltaMod)) );
}
// event.data.target.scrollLeft(event.data.target.scrollLeft() + (delta * o.constants.wheelDeltaMod));
// event.data.target.scrollTop(event.data.target.scrollTop() + (delta * o.constants.wheelDeltaMod));
return false;
},
// starts the drag operation and binds the mouse move handler
start: function(event) {
var pageX = o.getPageX(event);
var pageY = o.getPageY(event);
event.data.target.bind(o.events.drag, event.data, o.drag).stop(true, true);
event.data.position = {};
event.data.position.x = pageX;
event.data.position.y = pageY;
event.data.capture = {};
event.data.isDragging = false;
return false;
},
// updates the current scroll location during a mouse move
drag: function(event) {
var pageX = o.getPageX(event);
var pageY = o.getPageY(event);
this.scrollLeft -= (pageX - event.data.position.x);
this.scrollTop -= (pageY - event.data.position.y);
event.data.position.x = pageX;
event.data.position.y = pageY;
if (typeof event.data.capture.index === "undefined" || --event.data.capture.index === 0 ) {
event.data.isDragging = true;
event.data.capture = {
x: pageX,
y: pageY,
index: o.constants.captureThreshold
};
}
return true;
},
// called after a scroll event, moves the thumbs
// whenever it scrolls ( called 100x in a scroll -- and while its slowing down! )
scroll: function(event, ml, mt, left, top) {
left = event.data.target.scrollLeft();
top = event.data.target.scrollTop();
// update the bars
// this also handles it when it's slowing down + animating
if( event.data.$horizontal ) {
var pX = o.calculatePercentX( left, event.data.sizing.container.scrollWidth );
event.data.$horizontal.css('left', pX + '%');
}
// addition for the bars
if( event.data.$vertical ) {
var pY = o.calculatePercentY( top, event.data.sizing.container.scrollHeight );
event.data.$vertical.css('top', pY + '%');
}
if( event.data.scroll ) {
event.data.scroll();
}
},
// ends the drag operation and unbinds the mouse move handler
stop: function(event, dx, dy) {
var pageX = o.getPageX(event);
var pageY = o.getPageY(event);
if( typeof event.data.position !== "undefined" ) {
event.data.target.unbind(o.events.drag, o.drag);
if ( event.data.isDragging ) {
dx = o.constants.scrollDeltaMod * (pageX - event.data.capture.x);
dy = o.constants.scrollDeltaMod * (pageY - event.data.capture.y);
event.data.target.stop(true, true).animate({
scrollLeft: this.scrollLeft - dx,
scrollTop: this.scrollTop - dy
}, {
queue: false,
duration: o.constants.scrollDuration,
easing: "cubicEaseOut",
complete: function() {}
});
}
event.data.capture = event.data.position = undefined;
}
return !event.data.isDragging;
},
// gets sizing for the container and thumbs
getSizing: function(container, sizing) {
sizing = {};
sizing.container = {
width: container.width(),
height: container.height()
};
// set the scroll left to a crazy number (like 1000000000) and then get the max scrollLeft. Duh!
container.scrollLeft(o.constants.boundingBox).scrollTop(o.constants.boundingBox);
sizing.container.scrollWidth = container.scrollLeft();
sizing.container.scrollHeight = container.scrollTop();
container.scrollTop(0).scrollLeft(0);
return sizing;
},
calculatePercentX: function( scrollLeft, scrollWidth ) {
return ( scrollLeft / scrollWidth ) * 100;
},
calculatePercentY: function( scrollTop, scrollHeight ) {
return ( scrollTop / scrollHeight ) * 100;
},
getPageX: function(event) {
return ( o.touchEvents ? event.originalEvent.changedTouches[0].pageX : event.pageX );
},
getPageY: function(event) {
return ( o.touchEvents ? event.originalEvent.changedTouches[0].pageY : event.pageY );
},
// major
setupScrollBars: function(data) {
var mousedown_vertical = false;
var mousedown_horizontal = false;
if( data.$horizontal ) {
data.$horizontal.bind(o.events.start, function() {
mousedown_horizontal = true;
return false;
});
}
if( data.$vertical ) {
data.$vertical.bind(o.events.start, function() {
mousedown_vertical = true;
return false;
});
}
$(document).bind('mouseup', function() {
mousedown_horizontal = false;
mousedown_vertical = false;
return false;
});
// this handles scrollbar top,left position.
$(document).bind('mousemove', function(e) {
// if( !mousedown ) { return false; }
// manage the bar
var bar_dimension = 36;
var compensate_for_bar = bar_dimension/2;
//////////////////////////////
if( mousedown_horizontal ) {
if( e.target != data.$horizontal ) { e.offsetX = e.pageX - data.$horizontal_track.offset().left; }
var left = e.offsetX - compensate_for_bar;
var max = data.$horizontal.parent().width();
var min = 0;
if( left > max ) {
left = max;
} else if( left < min ) {
left = min;
}
data.$horizontal.css({ 'left': left + 'px' });
data.target.scrollLeft( data.sizing.container.scrollWidth * ( left / data.$horizontal.parent().width() ) );
}
//////////////////////////////
if( mousedown_vertical ) {
if( e.target != data.$vertical ) { e.offsetY = e.pageY - data.$vertical_track.offset().top; }
var top = e.offsetY - compensate_for_bar;
var max = data.$vertical.parent().height();
var min = 0;
if( top > max ) {
top = max;
} else if( top < min ) {
top = min;
}
data.$vertical.css({ 'top': top + 'px' });
data.target.scrollTop( data.sizing.container.scrollHeight * ( top / data.$vertical.parent().height() ) );
}
//////////////////////////////
});
}
});
// jQuery adapted Penner animation
// created by Jamie Lemon
$.extend($.easing, {
cubicEaseOut: function(p, n, firstNum, diff) {
var c = firstNum + diff;
return c*((p=p/1-1)*p*p + 1) + firstNum;
}
});
})(jQuery);
/*
* gant.js
*
* Girlfriend LLC
*/
var gant = {}; // WOOO!!!
gant.page = {};
gant.data = {};
gant.page.blog = function() {
var last_clicked;
// $('.gallery-item a').unbind('click').bind('click', function() {
// last_clicked = $(this);
//
// $.facebox({'image': $(this).attr('href')});
// $('#facebox').unbind('click').bind('click', function() {
// var i = last_clicked.parents('dl.gallery-item').index('dl.gallery-item');
// $('dl.gallery-item').eq(i+1).find('a').trigger('click');
// });
//
// return false;
// });
$('#fancybox-left, #fancybox-right').attr('href', window.location.hash.substr(1));
$('.gallery-item a').unbind('click').attr({
'rel': 'gant-lightbox',
'title': ''
}).fancybox({
'titleShow': false,
'overlayColor': '#fff'
});
}
gant.page.photo_album = function() {
$('#photo-album').overscroll(); // that's it!
};
gant.page.in_the_atelier = function() {
$('#in_the_atelier').overscroll();
};
gant.page.brand_history = function() {
$('#gant #scrollbar .previous').bind('click', function() {
gant.overscroll.go( $('#gant .content'), 'previous' );
return false;
});
$('#gant #scrollbar .next').bind('click', function() {
gant.overscroll.go( $('#gant .content'), 'next' );
return false;
});
$('#gant .content').overscroll({
scrollBar: {
vertical: $('#scrollbar .track .bar')
}
});
};
// helper functions
gant.overscroll = {};
gant.overscroll.go = function(elem, mode) {
var $e = elem;
var scrollTop = $e.scrollTop();
$e.animate({
'scrollTop': scrollTop + ( mode == 'next' ? 100 : -100 )
});
}
gant.page.contact = function() {
$('form').validate();
$('a[rel="facebox"]').click(function() {
var selector = $(this).attr('href');
$.facebox({'div': selector });
$('a[rel="close"]').click(function() {
$.facebox.close();
return false;
});
return false;
});
};
/*
* gant.lookbook.js
*
* Girlfriend LLC
*/
gant.page.collection = function( preCollection ) {
// this runs a lot.
// it returns the center 'look'
var current = -1;
var imgs_loaded = 0;
var isPrecollection = ( preCollection != undefined )
var figure_out_center = function(){
var ret = null;
$('#collection #overscroll .look').each(function(n) {
var $this = $(this);
var offset = $this.offset();
var left = offset.left;
var width = $this.width();
var $window = $(window);
var window_width = $window.width();
var center = window_width / 2;
if( left < center && center < left+width ) {
if( current != n ) {
current = n;
$('#meta').children().remove();
$this.find('.info').clone().appendTo( $('#meta') );
}
var index = ( $this.index('#collection #overscroll .look') + 1 );
/* if( last_hash != '' && ( imgs_loaded == $('#overscroll img').length ) ) {
if( !isPrecollection )
window.location.hash = '#/collection/look/' + index;
else
window.location.hash = '#/precollection/look/' + index;
} */
ret = $(this);
}
});
return ret;
};
// not relevant
// but figure i'd throw it in anyway
// http://www.thehoodinternet.com/2008/04/webbie-vs-black-moth-super-rainbow.html
// the big boy function
$('#collection #overscroll').overscroll({
scrollBar: {
horizontal: $('#scrollbar .track .bar')
},
scroll: function() {
figure_out_center();
}
});
// previous
// next
$('#collection #scrollbar .previous').bind('click', function() {
figure_out_center().prev().trigger('dblclick');
return false;
});
$('#collection #scrollbar .next').bind('click', function() {
figure_out_center().next().trigger('dblclick');
return false;
});
// handle the double click of each element
$('#collection .look').bind('dblclick', function() {
$this = $(this);
// if the image is in the center, and double clicked
// then open the lightbox
if( $this.get(0) == figure_out_center().get(0) ) {
var img = $this.find('img').attr('large');
// $.facebox({'image':img});
$.fancybox(img, {
showCloseButton: false,
type: 'image'
})
return false;
}
var offset = $this.offset();
var left = offset.left;
var width = $this.width();
var $window = $(window);
var window_width = $window.width();
var center = window_width / 2;
var $overscroll = $('#collection #overscroll');
$overscroll.animate({
'scrollLeft': ( $overscroll.scrollLeft() - ( center - left - ( width / 2 ) ) )
});
});
// evaluate
var look_url;
if( !isPrecollection )
look_url = window.location.href.split('/#/collection/look/');
else
look_url = window.location.href.split('/#/precollection/look/');
if( look_url.length > 1 && look_url[1] != 1 ) {
$('#overscroll img').unbind('load').load(function() {
imgs_loaded++;
if( imgs_loaded == $('#overscroll img').length ) {
if( !isPrecollection )
$('#collection .look').eq( parseInt(look_url[1]) - 501 ).trigger('dblclick');
else
$('#collection .look').eq( parseInt(look_url[1]) - 401 ).trigger('dblclick');
}
});
} else {
// OH + or + display the first one
figure_out_center();
// $('#collection .look').trigger('mousedown');
// $('#collection .look').eq(0).trigger('click');
$('#meta').html( $('.look:first .info').html() )
}
};
// end collection
/*
* gant-stores.js
*
* Girlfriend LLC
*/
gant.page.stores = function() {
var sort_select = function(selector) {
var mylist = $(selector);
var listitems = mylist.children('option').get();
listitems.sort(function(a, b) {
var compA = $(a).text().toUpperCase();
var compB = $(b).text().toUpperCase();
return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });
};
var parseFeed = function(data) {
var data = $.xml2json(data);
var countries = new Array();
var stores = {};
// go through items.
for (var i = data.item.length - 1; i >= 0; i--){
var item = data.item[i];
if( !stores[ item.country ] ) { stores[ item.country ] = {}; }
if( !stores[ item.country ][ item.city ] ) { stores[ item.country ][ item.city ] = new Array(); }
stores[ item.country ][ item.city ].push( item );
};
// go through the countries.
for( store in stores ) {
countries.push( store );
$('#country').append('');
}
$('#country').bind('change', function() {
var $this = $(this);
var val = $this.val();
$('#city').children().remove();
$('#city').append('');
for( city in stores[ val ] ) {
$('#city').append('');
}
sort_select('#city');
});
sort_select('#country');
$('#city').bind('change', function() {
var $this = $(this);
var city = $this.val();
var $country = $('#country');
var country = $country.val();
$('#stores-view').children().remove();
for (var i = stores[country][city].length - 1; i >= 0; i--){
var store = stores[country][city][i];
var $template = $( store_template );
var find_replace = {
'store-name': store.storename,
'street-address': store.streetaddress,
'locality': store.city,
'region': store.state,
'postal-code': store.postalcode,
'country-name': store.country,
'phone-number': store.phone,
'website': ( store.web ? 'Visit Website' : false ),
'google-map': ( store.gmap ? 'View Map' : false )
};
for( find in find_replace ) {
var val = find_replace[ find ];
if( val != '' ) {
$template.find( '.' + find ).html( val );
} else {
$template.find( '.' + find ).remove();
}
}
$('#stores-view').append( $template );
};
});
var store_template = '
,
'
// save this information
// gant.data.stores = stores;
};
$.ajax({
url: '/xml/rugger-stores/gant_rugger_stores.xml',
success: parseFeed
});
};
/*
* gant.friends.js
*
* Girlfriend LLC
*/
gant.page.friend = function() {
$('#gant #scrollbar .previous').bind('click', function() {
var scrollTop = $('#friend .content').scrollTop();
$('#gant .content').animate({
'scrollTop': scrollTop - 100
});
return false;
});
$('#gant #scrollbar .next').bind('click', function() {
var scrollTop = $('#friend .content').scrollTop();
$('#gant .content').animate({
'scrollTop': scrollTop + 100
});
return false;
});
$('#navigation li a').bind('click', function() {
gant.page.show_friend( $(this).attr('id').substr(7) );
return false;
});
// fade in
$(window).load(function() {
$('#gant .content,#gant #header').animate({'opacity':1});
gant.page.show_friend('john');
});
}; // end friend
gant.page.show_friend = function( friend ) {
$('#navigation li a').removeClass('active');
$('#friend_' + friend).addClass('active');
var friend = gant.data.friends[ friend ];
var bg = friend.image;
var content = friend.content;
var title = friend.title;
var $friend = $('#friend');
var $content = $friend.find('.content');
var $title = $friend.find('h1');
var $bg = $('#background');
var $img = $('');
$img.css({
'position': 'absolute',
'top': '0px',
'left': '0px',
'opacity': '0'
});
$img.bind('load', function() {
$(this).animate({'opacity':1}, 'fast');
})
$bg.append( $img );
$content.html( content );
$title.html( title );
$('#gant .content').overscroll({
scrollBar: {
vertical: $('#scrollbar .track .bar')
}
});
};
/*
* friends.js
*
* This contains friends data
*/
gant.data.friends = {
'john': {
'title': 'John: Lead singer of U.S. Royalty',
'content': '
John is one part of Washington D.C. based alternative rock band U.S. Royalty. The band formed in 2007 and has been rapidly growing in popularity since their initial tours of the D.C. and Baltimore region. John's got that effortless cool that embodies American heritage sportswear. He's also a pretty nice guy.
I know you're an East Coast boy John. Where exactly are you from? - Southern Maryland is where I grew up and my grandparents have a farm in West Virginia. My family is pretty involved in history, I always thought if I didn't do music I'd be a history professor.
Do you have a musical family? - Yeah, my dad played in a band growing up around Maryland. When I was in seventh grade and my brother in fifth grade he got me a drum set for Christmas and I got him a bass guitar. [John laughs] So we started out as a bassist and a drummer.
U.S. Royalty is based in Washington D.C. How's that going? - D.C. is a cool city but it's small. You can only play there so many times. We'll play there once a month and then hit other places. We started playing New York, just at a party or jumping on a show with somebody else. It just takes time to build it up and get people out.
What other cities are you hitting? - Chicago's been great. Miami, kind of a fluke thing there, but it has proved to be one of our favorites. Chris, our manager, got us a gig during Art Basel for Vice Magazine. The reception was totally unexpected because it's more of a club scene there at the moment.
You seem to get around a bit? - Yeah, my brother and I kind of put off more traveling plans to focus on the band. But growing up, travel was a big family thing. I remember when I was 13, Mum and Dad took us on a two-week tour of the West: Montana, Wyoming and Idaho. Seems crazy now, driving around with the family on these mountain roads and not being able to find a motel, and a broken-down car with 3 kids. At the time, I was just thinking where's the next rock hill I can climb or pool I can swim in. We'd always stop for the landmarks and battlefields. My family has a respect for history and both of my grandfathers were active in WWII.
What's it like traveling with the band? - Band traveling, it's mainly about getting from A to B. Getting as much sleep as possible and still being sort of on time. But I remember, we went down to the South by Southwest festival (SXSW) last year and had some time, so we booked a random show in Kentucky. We rode bikes and painted a little with my cousin who lives there. In Nashville, we found a studio that we could rent by the day for 50 bucks. We tried to sleep there; the owner didn't like that too much! We started paying a tour manager after a while. He's also a friend who is not in the band which brings a nice balance to things, especially when we have our petty arguments [John laughs]. Kinda nice having that external element.
Are U.S. Royalty into supporting other bands? There's a trading system going on with bands in supporting up and-coming talent, right? - Yeah, we like to support bands because we go from town to town and are kind of riding coat-tails. We're pretty lucky because we've been really compatible with the bands we have supported in the past; that's important. I think it's pretty rad to support the up-and-coming talent.
I'd imagine riding on coat-tails is half the fun? - [John laughs] Totally. We played at the 9:30 club with The Bravery in D.C. We set it up the same day. I'd hung out with the bassist a few times. He called me when they arrived in D.C. that afternoon and the other supporting band had their van stolen in Philly the night before. We ended up opening for them in front of a full house of about 1200 people. We didn't even use any of our own equipment because we did a block party at 6pm, packed our gear up and ran over.
How do you get inspired? - I'll tend to read. Whether it be magazines or books. I am into short stories at the moment. H.P. Lovecraft has been interesting. Also, revisiting stories I read as a child, like Washington Irving's "Rip Van Winkle." Also I find Hemingway, Tolstoy, and artbooks on the hard-edge movement in art in the '50s and '60s to be inspirational reads.
Finally, what's on repeat on your iPod at the moment? - A lot of '70s punk: MC5, Death, guys that were really ahead of their time. Some newer groups like Local Natives (LA), SEAS (D.C. Band) and Wild Nothing (VA). Also a lot of Swedish groups like Air France, Studio and El Perro Del Mar. Always Fleetwood Mac and Bruce Springsteen.
Hugh Mackie is known as the gentleman responsible for the second coming of Triumph motorcycles around the '80s in the New York region. It was then he bought up the majority of Triumph motorcycles around the northern East Coast and began his workshop: 6th Street Specials.
How did Triumph first start out? - Post WWII Europe was a mess and Britain realized the only way to turn the economy around was to export. The motto was 'Export or Die', generating employment, GDP and getting the country back on its feet. So, when all the G.I.s were coming back to the States they were bringing tons of British stuff back.
What were guys riding in the US at that time? - At that time, the guys had a limited choice of, perhaps, Harleys and Indians. In Europe, from both a civilian and military perspective, they were riding Triumphs and BSA motorcycles. A lot of the G.I.s brought the bikes back to the US. The US market was the biggest market right after the war. This is, of course, pre-Honda, Suzuki and Kawasaki. Japan had just been totaled. From the '50s the popularity of Triumph kept growing and growing until Triumph became the biggest manufacturer in the world. Predominantly, selling over here in the US and Australia.
How was Triumph different from the Harleys and Indians? - Triumphs were very different from what Harley or Indian made. They were light, fast and sporty motorcycles that were good for the terrain over here. America really didn't have a whole load of roads at that point. Most post-war riding was off-road. Triumphs were great for all terrain. Desert racing on the west coast and giant hill climbs in the Midwest. On the east coast there were a lot of motocross and scrambling races. Everybody was buying them, competing and winning, which ultimately led to more sales.
What contributed to Triumph's downfall? - By the time you got to the '70s in Britain the political climate had gone completely conservative and the factories wouldn't reinvest in tooling, update and modernize. Britain went into a depression. All the huge companies like Triumph and BSA went belly up. At the same time, Japan had got back on their feet. The reinvestment in Japan was heavy from Europe and the US, building new infrastructure. Japan got to the point where they could come over here, take a product back to Japan and manufacture it ten times better. Including the Triumph motorcycle. Japanese manufacturers took the Triumph 650, put disc brakes on, an electric starter and all the modern conveniences. The British industry never modernized the range. They got complacent.
How could the Japanese do this at an affordable level? - The Japanese bikes were subsidized to get a solid marketshare. People were looking at a 1969 Honda: 4-cylinder, disc brakes and an electric starter. Every bell and whistle you need and it was cheaper than a Triumph Bonneville that had none of those things. Mentality changed and the leaders of the pack had Hondas. Honda started making a wide product range, 50cc and 125cc bikes. Honda understood brand loyalty and the Brits didn't. If you're 16 and you get on a 50cc, likelihood has it you're going to step up the Honda range.
When did Triumph make its come-back? - Well, the '60s were great Triumph bikes. Made from great metal and still successful in racing into the 80's and a lot of people started to dig them out their garages again. Reliving their youth. - A resurgence started then and when I came to New York, I noticed everybody had a Triumph tucked away in the garage and only used the Harley. We went around, purchased these Triumphs and fixed them up. It started a scene around the cafes in the East Village. We got a map, put a hundred mile radius circle around NYC and put adverts in all the local papers for Triumphs.
How did it turn out? - [Hugh laughs] I ended up with a whole business going and I've been at the current location since '86. The club scene really took off in the 80's in New York with huge mega-nightclubs: The Palladium, Area and Danceteria. It was the beginning of door people that were 'god.' All that crap. But you could pull up to the club on a Triumph and get to walk straight in!
We also interviewed Triumph Specialist Neil Fenton (see opposite page). Didn't you sell him his first Triumph? - Yeah, about 12 years ago. Guys like Neil are going to the next level and making them custom. This shop is just about servicing Triumphs.
How can Triumph's impact on motorcycle manufacturing be seen today? - Motorcycles have gone a full circle and now every company makes a modern version of an old Triumph. Ducati makes an air-cooled V-twin. The new Bonneville is a copy of the old. Every manufacturer got rid of that wrapped-up race bike look. The '80s and '90s thing was multicylinder race replicas. Now, every one of those companies makes what we call 'naked bikes'. The basic motorcycle is getting back to what it was in the '60s.
6TH STREET SPECIALS 703 EAST 6TH STREET NEW YORK NY 10009
',
'image': '/gantrugger/images/friends/hugh.jpg'
},
'neil': {
'title': 'Neil Fenton: Triumph Recycled - the new vintage movement',
'content': '
As I stepped out of the subway at Morgan Avenue in Brooklyn and walked along Johnson Avenue to Neil's shop, the perfect white snow had turned into a dirty sludge. I ducked under his garage door and Neil greeted me with a smile and those trademark glasses. In his hand he had a Gant advert. He threw it in front of me across the table and lit a cigarette. It was himself, Neil Fenton, modeling in the Gant campaign five years or so back. Since his Gant days he turned to customizing Triumphs. Representing the new generation of passionate mechanics that are artists in their own right. He shares a workshop with a small group of like-minded guys on Johnson Avenue in Brooklyn and was sold his first Triumph by none other than Mr. Hugh Mackie (see opposite page).
How have classic Triumphs gained such a cult status? - Before the Japanese took over the market the Triumph was the most sold bike. I think more were shipped here than stayed in England. They're easy to work with and parts are readily available. The original sports bike. People were also making Café racers out of the Triumphs.
People like Steve McQueen really seemed to push the brand to the next level. Why did Triumph have that allure? - They were fast and light mainly. Don't get me wrong, there are other cool English bikes, but the parts for Triumphs are so available. I've customized everything on a Triumph; hand-made gas tanks to frames and handlebars.
We use a 1971 Triumph in our fall campaign. What a machine! - [Pulls out an iPhone picture] Yeah, I know that bike. John, who's part of the co-op that is our shop, rebuilt that bike twice.
Small world! How come Triumphs are such great city bikes? - Triumphs are small and we tend to keep the handlebars small so you can fly between the traffic across the Williamsburg Bridge [Neil laughs]. They never get stolen really too. More joy-ridden for a week or two then you find them somewhere down by the Projects.
Do you work with the new ('80s onwards) Triumphs? - The Speed Triple is a really fun bike. There's a movement beginning in customizing the new ones now; making new frames and popping up the engine for dirt track racing.
Are there other customization trends going on? - People are really into choppers again. Ten years ago, there were not too many Triumphs for sale and everyone made choppers out of them. There's always a reaction to the previous movement and eventually, I'm sure people will want to restore the chopper Triumphs back again.
Why choppers? - Motorcycle shows mainly.
Are you devaluing a bike by customizing it? - It depends. If I build a chopper and add a hard-tail section by welding it on, yeah. You can take it apart again, it just takes a lot of work to cut off all the welds. A lot of my bikes have had 3 lives; the appearance and everything is reversible.
What is your process when designing customizations? - I look through a lot of my old race bike magazines and books. Hugh had this old book of boys racing BSAs that I liked. I copy inspirations from here and there. Kind of what fashion does; buy it, copy it, sell it!
Seems like there are no boundaries with customization? - Yeah, all us boys are friends but we're competing for sure. Trying to outdo each other and you know everyone is judging it. Kind of like surfing or skating, we all have our different styles. Mine is dirt track racing because of my BMX background. My first bike was a '65 Vespa.
Where do you buy your bikes? - A lot from CraigsList. Got one a couple of years ago from a guy in New Jersey. He refused to sell it to the two people before me because he didn't like them. I mean, if it's got original parts and matching numbers, I'm not going to hack it apart.
',
'image': '/gantrugger/images/friends/neil.jpg'
}
};
/*
* Facebox (for jQuery)
* version: 1.2 (05/05/2008)
* @requires jQuery v1.2 or later
*
* Examples at http://famspam.com/facebox/
*
* Licensed under the MIT:
* http://www.opensource.org/licenses/mit-license.php
*
* Copyright 2007, 2008 Chris Wanstrath [ chris@ozmm.org ]
*
* Usage:
*
* jQuery(document).ready(function() {
* jQuery('a[rel*=facebox]').facebox()
* })
*
* Terms
* Loads the #terms div in the box
*
* Terms
* Loads the terms.html page in the box
*
* Terms
* Loads the terms.png image in the box
*
*
* You can also use it programmatically:
*
* jQuery.facebox('some html')
* jQuery.facebox('some html', 'my-groovy-style')
*
* The above will open a facebox with "some html" as the content.
*
* jQuery.facebox(function($) {
* $.get('blah.html', function(data) { $.facebox(data) })
* })
*
* The above will show a loading screen before the passed function is called,
* allowing for a better ajaxy experience.
*
* The facebox function can also display an ajax page, an image, or the contents of a div:
*
* jQuery.facebox({ ajax: 'remote.html' })
* jQuery.facebox({ ajax: 'remote.html' }, 'my-groovy-style')
* jQuery.facebox({ image: 'stairs.jpg' })
* jQuery.facebox({ image: 'stairs.jpg' }, 'my-groovy-style')
* jQuery.facebox({ div: '#box' })
* jQuery.facebox({ div: '#box' }, 'my-groovy-style')
*
* Want to close the facebox? Trigger the 'close.facebox' document event:
*
* jQuery(document).trigger('close.facebox')
*
* Facebox also has a bunch of other hooks:
*
* loading.facebox
* beforeReveal.facebox
* reveal.facebox (aliased as 'afterReveal.facebox')
* init.facebox
* afterClose.facebox
*
* Simply bind a function to any of these hooks:
*
* $(document).bind('reveal.facebox', function() { ...stuff to do after the facebox and contents are revealed... })
*
*/
(function($) {
$.facebox = function(data, klass) {
$.facebox.loading()
if (data.ajax) fillFaceboxFromAjax(data.ajax, klass)
else if (data.image) fillFaceboxFromImage(data.image, klass)
else if (data.div) fillFaceboxFromHref(data.div, klass)
else if ($.isFunction(data)) data.call($)
else $.facebox.reveal(data, klass)
}
/*
* Public, $.facebox methods
*/
$.extend($.facebox, {
settings: {
opacity : 0.8,
overlay : true,
loadingImage : 'images/loading.gif',
closeImage : 'closelabel.gif',
imageTypes : [ 'png', 'jpg', 'jpeg', 'gif' ],
faceboxHtml : '\
