Event.observe(window, 'load', function() {
  if($('thumbnails')) { 
    Showcase = new SlideList($('thumb_list'), {onClick: function(ev, item) { Event.stop(ev) }});
    $('thumb_list').getElementsBySelector('li a').each(function(link) {
      link.observe('click', function() {
        var name = link.href.substring(link.href.indexOf('#')+1);
        if (clients[name]) new Stereo.Client(clients[name]).load();
      })
    })
  }
  var showMoreVisible = false;
  Event.observe($('feature_show_details'), 'click', function(event) {
    var details = $('feature_details');
    if (!showMoreVisible) newX = -592;
    else newX = 592;
    new Effect.Move(details, {x:newX, y:0, mode:'relative', transition: Effect.Transitions.sinoidal, duration: .3});
    event.stop();
    showMoreVisible = !showMoreVisible;
  });
  
  if ($('thumb_forward')) {
    Event.observe($('thumb_forward'), 'click', function(event) {
      var pos = $('thumb_list').positionedOffset();
      if (pos[0] > -300)
        new Effect.Move($('thumb_list'), {x: -110, mode:'relative', transition: Effect.Transitions.sinoidal, duration: .3});
      event.stop();
    })
  }
  if ($('thumb_back')) {
    Event.observe($('thumb_back'), 'click', function(event) {
      var pos = $('thumb_list').positionedOffset();
      if (pos[0] < 0)
        new Effect.Move($('thumb_list'), {x: 110, mode:'relative', transition: Effect.Transitions.sinoidal, duration: .3});
      event.stop();
    })
  }
});

var Stereo = {};
Stereo.Client = Class.create({
  initialize: function(attributes) {
    this.attributes = attributes;
  },
  
  load: function() {
    $('showcase_image').src = '/images/showcase/'+this.attributes.images.main;
    $H(this.attributes).each(function(pair) {
      if ($('showcase_'+pair[0])) $('showcase_'+pair[0]).update(pair[1]);
    });
    if (this.attributes.url) {
      var link = new Element('a').update(this.attributes.title);
      link.href = this.attributes.url;
      $('showcase_subtitle').update(link);
    } else {
      $('showcase_subtitle').update(this.attributes.title);
    }

    this.populateFeatures(this.attributes.features);
  },
  
  populateFeatures: function(features) {
    if (!$('showcase_feature_list')) return;    
    $('showcase_feature_list').update();
    features.each(function(feature) {
      $('showcase_feature_list').insert(new Element('li').update(feature))
    });
  }
});

var clients = {
  threeonethird: {
    images: { thumb: '313rd.png', main: '313rd.jpg'},
    title:  '313rd.com',
    date:   '2007 - 2008',
    city:   'Detroit, MI',
    company: '313rd',
    description: 'The only way to Detroit Nightlife',
    features: ['design', 'xhtml/css', 'php', 'MySQL', 'javascript'],
    url:    'http://313rd.com'
  },
  aboveground: {
    images: { thumb: 'aboveground.png', main: 'aboveground.jpg'},
    title:  'Above Ground Hair Studio',
    date:   'November 2006',
    city:   'Ann Arbor, MI',
    company: 'Above Ground Hair Studio',
    description: 'The goal at Above Ground Hair Studio is to create a place that is just as unique as the stylists themselves.',
    features: ['design', 'xhtml/css'],
    url:    'http://abovegroundhairstudio.com'
  },
  acss: {
    images: { thumb: 'acss.png', main: 'acss.jpg'},
    title:  'Authentic Coaching',
    date:   'November 2006',
    city:   'Ann Arbor, MI',
    company: 'Authentic Coaching and Synergistic Solutions, LLC',
    description: 'ACSS provides an ongoing professional relationship that helps prople produce extraordinary results in their lives, careers, businesses, or organizations.',
    features: ['design', 'xhtml/css', 'blog'],
    url:    'http://acssgroup.net'
  },
  amvest: {
    images: { thumb: 'amvest.png', main: 'amvest.jpg'},
    title:  'Amvest Properties',
    date:   'June 2006',
    city:   'Ann Arbor, MI',
    company: 'Amvest Property Management, Inc',
    description: 'mvest Properties offers Ann Arbor the highest quality in commercial real estate services. Our team manages, develops and rehabilitates some of the most exquisite property in Ann Arbor.',
    features: ['design', 'xhtml/css', 'ajax', 'cms'],
    url:    'http://amvestproperty.com'
  },
  btb: {
    images: { thumb: 'btb.png', main: 'btb.jpg'},
    title:  'BTB Burrito',
    date:   'March 2006',
    city:   'Ann Arbor, MI',
    company: 'BTB Burrito',
    description: 'BTB Burrito is a counter-service restaurant, providing good tasting, healthy, and inexpensive burritos, tacos, and quesadillas in a college atmosphere. ',
    features: ['design', 'xhtml/css', 'blog', 'photo management'],
    url:    'http://btbburrito.com'
  },
  ctd: {
    images: { thumb: 'ctd.png', main: 'ctd.jpg'},
    title:  'Custom Tee Designs',
    date:   'June 2007',
    city:   'Holly, MI',
    company: 'Custom Tee Designs',
    description: 'Get what you have to say off your chest and onto a T-shirt, and put it right back on your chest.',
    features: ['design', 'xhtml/css', 'php', 'javascript', 'blog'],
    url:    'http://formyodds.com'
  },
  formyodds: {
    images: { thumb: 'thumb1.png', main: 'feature.jpg'},
    title:  'For My Odds Website',
    date:   'February 2008',
    city:   'Chicago, IL',
    company: 'For My Odds, Inc',
    description: 'This site provides families with important fertility information and provides custom reports analyzing an individuals statistical liklihood of conception.',
    features: ['design', 'xhtml/css...', 'database integration'],
    url:    'http://formyodds.com'
  },
  charleys: {
    images: { thumb: 'charleys.png', main: 'charleys.jpg'},
    title:  'Good Time Charleys',
    date:   'February 2008',
    city:   'Ann Arbor, MI',
    company: 'Good Time Charleys',
    description: '',
    features: ['menu design', 'table tents', 'website'],
    url:    'http://goodtimecharleys.com'
  },
  fourelements: {
    images:     { thumb: 'fourelements.png', main: 'fourelements.jpg'},
    title:      'Four Elements',
    date:       'November 2007',
    city:       'Ann Arbor, MI',
    company:    'Four Elements School of Adventure',
    description: 'Four Elements is a non-profit organization started in 2006 to provide young adults the opportunity to participate in high adventure activities, which focus on personal growth, team building, developing consciousness and experiential learning. ',
    features:   ['design', 'xhtml/css', 'paypal integration'],
    url:        'http://schoolofadventure.org'
  },
  leaflit: {
    images:     { thumb: 'leaflit.png', main: 'leaflit.jpg'},
    title:      'LeafLit',
    date:       'July 2006',
    city:       'New York, NY',
    company:    'PARRx, LLC',
    description: 'LeafLit is dedicated to helping people manage medical debt. LeafLit works with medical providers to reduce one\'s overall medical debt by actively engaging in settlement negotiations.',
    features:   ['design', 'illustration', 'xhtml/css'],
    url:        'http://leaflit.com'
  },
  pagecaufield: {
    images:     { thumb: 'page.png', main: 'page.jpg'},
    title:      'Page Caufield Design',
    date:       'January 2007',
    city:       'Ann Arbor, MI',
    company:    'Page Caufield Design',
    description: 'Highly customized architectual design and construction.',
    features:   ['design', 'flash'],
    url:        'http://pagecaufielddesign.com'
  },
  safetysystems: {
    images:     { thumb: 'safteysystems.png', main: 'safetysystems.jpg'},
    title:      'Safety Systems',
    date:       'February 2007',
    city:       'Canton MI',
    company:    'Safety Systems of America, Inc',
    description: 'Specializes in designing and installing engineered fall protection systems for industrial, commercial and governmental clients throughout the U.S.',
    features:   ['design', 'xhtml/css'],
    url:        'http://safe-t-systems.com'
  },
  santiago: {
    images:     { thumb: 'santiago.png', main: 'santiago.jpg'},
    title:      'Santiago Photography',
    date:       'February 2007',
    city:       'Canton MI',
    company:    'Alfredo J Santiago Photography',
    description: 'Flash website showcasing the works of Alfredo J Santiago.',
    features:   ['design', 'flash'],
    url:        'http://santiagoweddings.com/'
  },
  thehills: {
    images:     { thumb: 'thehills.png', main: 'thehills.jpg'},
    title:      'The Hills Bar & Grille',
    date:       'October 2007',
    city:       'Rochester Hills, MI',
    company:    'The Hills Bar & Grille',
    description: 'The landmark location for Michigan\'s newest premium sports bar & grille. The site design mimics the premium dining experience with wood and granite textures and an advanced integrated click-to-edit content management system.',
    features:   ['design', 'xhtml/css', 'custom cms'],
    url:        'http://schoolofadventure.org'
  },
  wwm: {
    images:     { thumb: 'wwm.png', main: 'wwm.jpg'},
    title:      'Wilson White Management',
    date:       'July 2007',
    city:       'Ann Arbor, MI',
    company:    'Wilson White Management',
    description: 'Wilson White Management is a professional, personable property management and leasing company of long standing, dedicated to providing clean, convenient and comfortable accomidations for apartment residents and commercial tenants.',
    features:   ['design', 'xhtml/css', 'cms', 'google maps integration', 'custom property management system'],
    url:        'http://wilsonwhitemanagement.com'
  },
  gm: {
    images:     { thumb: 'gm.png', main: 'gm.jpg'},
    title:      'GM Supplier Diversity',
    date:       'March 2006',
    city:       'Detroit, MI',
    company:    'General Motors',
    description: 'Website supporting diversity efforts in the General Motors supply chain.',
    features:   ['design', 'xhtml/css', 'dhtml'],
    url:        'http://gmmsd.com'
  },
  varsity: {
    images:     { thumb: 'varsity.png', main: 'varsity.jpg'},
    title:      'Varsity Management',
    date:       'July 2006',
    city:       'Ann Arbor, MI',
    company:    'Varsity Management',
    description: 'Campus management company in Ann Arbor, MI.',
    features:   ['design', 'xhtml/css', 'google maps', 'property search'],
    url:        'http://varsitymanagement.com'
  }
  
};