/*
	Copyright James Matteson 2011. All rights reserved.
*/
function storyCreator(storyContainer){
   var oThis = this;
   
   this.createStory = function(story, isAddOnly){
      /*
         <div id="story_id" class="story-wrapper">
            <p class="diggs"></p>
            <img class="add" src="images/add.png" />
            <img class="dismiss" src="images/dismiss.png" />
            <h3>Story Title</h3>
            <div class="detail">
               <div class="thumb">
                  <img />
               </div>
               <span class="domain">Domain</span>
               <p class="desc">Description</p>
               <div class="clear"></div>
               <div class="story-left">&nbsp;</div>
               <div class="story-right">&nbsp;</div>
            </div>
         </div>
      
      */   
      var wrapper = new Element('div', {
         'id': 'story_' + story.id,
         'class': 'story-wrapper'
      });
      
      // diggs
      var diggs = new Element('p', {
         'class': 'diggs'
      });
                  
      diggs.innerHTML = story.diggs;
      wrapper.insert(diggs);
      
      // add/dismiss
      var add = new Element('img', {
         'src': imgPath + 'add.png',
         'class': 'add'
      });
      var dismiss = new Element('img', {
         'src': imgPath + 'dismiss.png',
         'class': 'dismiss'
      });
      
      wrapper.insert(add);
      wrapper.insert(dismiss);
      
      // title
      var title = new Element('h3', {});
      
      title.innerHTML = story.title;
      wrapper.insert(title);
      
      // detail
      var detail = new Element('div', {
         'class': 'detail'
      });
      
      if (story.thumbnail != null){
         var thumb = new Element('div', {
            'class': 'thumb'
         });
         var img = new Element('img', {});
         
         img.src = story.thumbnail.src;
         thumb.insert(img);
         detail.insert(thumb);
      }
      
      // domain
      var domain = new Element('span', {
         'class': 'domain'
      });
      
      domain.innerHTML = story.domain + ' -- ';
      detail.insert(domain);
      
      // description
      var description = new Element('p', {
         'class': 'desc'
      });
      
      description.innerHTML = story.description;
      detail.insert(description);
      
      // clear
      detail.insert(new Element('div', {'class': 'clear'}));
      
      // actions
      var actionLeft = new Element('div', {
         'class': 'action-left'
      });
      var actionRight = new Element('div', {
         'class': 'action-right'
      });
      var fnFinally = function(){
         wrapper.hide();
         document.fire('stories:checkForMore');
      }
      var fnAddOnly = function(){
         myStories.addStory(story);
         dataLayer.dismissToRead(story.id);
      }
      
      actionLeft.observe('click', function(){
         if (isAddOnly){
            fnAddOnly();
         }else{
            myStories.addStory(story);
            dataLayer.enqueue(story.id);
         }         
         fnFinally();
      });
      actionLeft.observe('mouseover', function(){
         wrapper.addClassName('story-hover-add');
      });  
      actionLeft.observe('mouseout', function(){
         wrapper.removeClassName('story-hover-add');
      });  
      actionRight.observe('click', function(){
         if (isAddOnly){
            fnAddOnly();
         }else{
            dataLayer.dismiss(story.id);
         }         
         fnFinally();
      });
      actionRight.observe('mouseover', function(){
         if (isAddOnly){
            wrapper.addClassName('story-hover-add');
         }else{
            wrapper.addClassName('story-hover-dismiss');
         }
      });  
      actionRight.observe('mouseout', function(){
         wrapper.removeClassName('story-hover-add');
         wrapper.removeClassName('story-hover-dismiss');
      });  
            
      actionLeft.innerHTML = '&nbsp;';
      actionRight.innerHTML = '&nbsp;';
      detail.insert(actionLeft);
      detail.insert(actionRight);
      wrapper.insert(detail);
            
      // add story
      storyContainer.insert(wrapper);
      
      // preload image
      if (story.thumbnail != null){
         var temp = new Image();
         temp.src = story.thumbnail.src;
      }
   }
}
