///////////////////////////////////////////////////////////////
//
//  Script: Project Preview
//  Version: 02
//
//  Notes: This version includes the slider/scroller and more
//  options

if (!Ascribe) {
  var Ascribe = {};
}

if (typeof(Ascribe.ProjectPreview) == 'undefined') {
  Ascribe.ProjectPreview = function(config) {
    this.projectTitle = '';
		this.currentProjectTitle = '';
    this.projectTypeHeader = 'Project Type';
    this.projectType;
    this.projectLocationHeader = 'Project Location';
    this.projectLocation;
		this.projectThumbnailPath = '';
    this.projectPreviewPhotoLink = '';
    
		// id options
    this.projectTitleID = config.projectTitleID || 'project-title';
    this.projectTypeHeaderID = config.projectTypeHeaderID || 'project-type-header';
    this.projectTypeID = config.projectTypeID || 'project-type';
    this.projectLocationHeaderID = config.projectLocationHeaderID || 'project-location-header';
    this.projectLocationID = config.projectLocationID || 'project-location';
    this.projectPreviewPhotoID = config.projectPreviewPhotoID ||'project-preview-photo';
    this.projectPreviewPhotoLinkID = config.projectPreviewPhotoLinkID || 'project-preview-photo-link';
    this.loadingID = config.loadingID || 'loading';
    this.instructionsID = config.instructionsID || 'project-instructions';
    this.instructions = config.instructions || 'Click link to the left or image above for full details';
    this.ScrollerID = config.ScrollerID || 'portfolio-scroller';
		this.ScrollerTrackID = config.ScrollerTrackID || 'portfolio-scroller-track';
		this.ScrollerHandleID = config.ScrollerHandleID || 'portfolio-scroller-handle';
	  
	  // event handlers
	  Event.observe(window, 'load', function() {
      // initialize scroller
      this.slider1 = new Control.Slider(this.ScrollerHandleID, this.ScrollerTrackID, {
    		axis: 'vertical',
    		onSlide: function(v) {
    		  this.scrollVertical(v, $(this.ScrollerID), this.slider1);
    		}.bind(this),
    		onChange: function(v) {
    		  this.scrollVertical(v, $(this.ScrollerID), this.slider1);
    		}.bind(this)
    	});
      
      if ($(this.ScrollerID).scrollHeight <= $(this.ScrollerID).offsetHeight) {
    		this.slider1.setDisabled();
    		$(this.ScrollerTrackID).hide();
    	} else {
        $(this.ScrollerTrackID).style.visibility = 'visible';
      }
    }.bind(this));
    
    Event.observe(this.projectPreviewPhotoID, 'load', this.fadeProjectImage.bindAsEventListener(this));
  } // constructor
  
  Ascribe.ProjectPreview.prototype = {
    getProject: function(config) {
      this.projectTitle = config.projectTitle;
      if (config.projectType.empty() != true) {
        this.projectType = config.projectType;
      }
      else {
        this.projectType = 'n/a';
      }
      if (config.projectLocation && config.projectLocation.empty() != true) {
        this.projectLocation = config.projectLocation;
      }
      else {
        this.projectLocation = 'n/a';
      }
      this.projectThumbnailPath = config.projectThumbnailPath;
      this.projectPreviewPhotoLink = config.projectPreviewPhotoLink;
      if (this.currentProjectTitle == this.projectTitle) {
        return false;
      }
      this.currentProjectTitle = config.projectTitle;
      this.showProject();
    },
    
    showProject: function() {
      this.showLoadingIndicator();
      $(this.projectTitleID).innerHTML = this.projectTitle;      
      $(this.projectTypeHeaderID).innerHTML = this.projectTypeHeader; 
      $(this.projectTypeID).innerHTML = this.projectType; 
      $(this.projectLocationHeaderID).innerHTML = this.projectLocationHeader; 
      $(this.projectLocationID).innerHTML = this.projectLocation; 
			$(this.projectPreviewPhotoID).src = ''; // workaround for safari's onload timing issue. not loading from cache properly.
      $(this.projectPreviewPhotoID).src = this.projectThumbnailPath;
      $(this.projectPreviewPhotoID).style.opacity = 0;
      $(this.projectPreviewPhotoID).style.filter = 'alpha(opacity=0)';
      $(this.projectPreviewPhotoLinkID).href = this.projectPreviewPhotoLink;
      $(this.instructionsID).innerHTML = this.instructions;
    },
    
    fadeProjectImage: function(event) {
      this.hideLoadingIndicator();
      new Effect.Opacity(this.projectPreviewPhotoID, {
        from: 0,
        to: 1.0,
        duration: .5
      });
    },
    
    showLoadingIndicator: function() {
      $(this.loadingID).show();
    },
    
    hideLoadingIndicator: function() {
      $(this.loadingID).hide();
    },
    
    scrollVertical: function(value, element, slider) {
  		element.scrollTop = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));
  	}
  } // prototype
} // if typeof(Ascribe.ProjectPreview)