var cssfile=document.createElement("link")
cssfile.setAttribute("rel", "stylesheet")
cssfile.setAttribute("type", "text/css")
cssfile.setAttribute("href", 'http://rouxbe.com/stylesheets/widget-reset.css')
document.getElementsByTagName("head")[0].appendChild(cssfile)

var jQueryPresent = false;
var Rouxbe = {};
Rouxbe.Widget = {
  
  utm_and_affiliate_codes: function(question)
  {
    var utm = "utm_source="+window.location.hostname+"&utm_medium=quiz_widget&utm_content="+question.id+"&utm_campaign=full-lesson-quiz"
    if(options.affiliate != undefined){ utm += ("&affiliate_tracking_code="+options.affiliate) }
    return utm;
  },

  apply_styles: function(options)
  {
    var w = jQuery('#rouxbe-quiz-widget')
    w.attr('style',"font-size:12px;font-family:helvetica, arial,sans-serif; width:"+options.width+"px;border:1px #"+options.border+" solid;background:#"+options.background+";")
    
    // Misc
    jQuery('.rouxbe-widget-link').attr('style', "color:#"+options.getWidgetColor+";font-style:normal;font-size:8px;font-family:helvetica, arial, sans-serif;margin:0;padding:0;text-align:left")
    w.find('.clear-right').attr('style',"clear:right")
       
    // Upgrade
    w.find('p.upgrade').attr('style',"margin:0;padding:0;padding-bottom: 10px")
    w.find('div.upgrade-float').attr('style',"float:right;text-align:right")

    //Questions
    w.find('.rouxbe-wop').attr('style', "padding:"+options.outerPadding+"px;")
    w.find('.rouxbe-quiz-header').attr('style', "padding:0;margin:0;border:none")
    w.find('.rouxbe-quiz-header h2').attr('style', "background:none;text-transform:none;text-decoration:none;border:none;border-bottom:none;font-style:normal;text-align:center;letter-spacing:normal;font-family:helvetica, arial,sans-serif;font-size:12px;font-weight:bold;padding:0;margin:0;line-height:18px;color:#"+options.color+"")
    w.find('.rouxbe-quiz-header h3').attr('style', "background:none;text-transform:none;text-decoration:none;border:none;border-bottom:none;font-style:normal;text-align:center;letter-spacing:normal;font-family:helvetica, arial,sans-serif;font-size:12px;font-weight:bold;padding:0;margin:0;color:#"+options.color+"")
    w.find('.rouxbe-wip').attr('style', "font-size:11px;padding:"+options.innerPadding+"px;background:#fff; border:1px #"+options.border+" solid; margin-bottom: 10px;")
    w.find('.rouxbe-quiz-loading').attr('style', "text-align:center")
    w.find('.rouxbe-quiz-answers').attr('style', "text-align:left;padding:0; margin: 0;list-style:none;line-height: 1.8em;left:0")
    w.find('.rouxbe-quiz-answers li.rouxbe-quiz-answer').attr('style', "border:none;text-align:left;padding:0;margin:0;font-style:normal;text-indent: 0px;position:relative; margin: 5px 0; padding:0; list-style:none;color:#555;padding-left: 20px;")
    w.find('.rouxbe-quiz-answers li.rouxbe-quiz-answer img.error').attr('style', "border:none;padding:0;margin:0;display:none;position:absolute;top: 0px;left:3px")
    w.find('.rouxbe-quiz-answers li.rouxbe-quiz-answer input').attr('style', "position:absolute;top: 0;left:3px;margin:0;padding:0")
    w.find('.rouxbe-quiz-answers li.rouxbe-quiz-answer .question').attr('style', "text-align:left;color:#555;padding:0;line-height:1.2em;margin:0")
    w.find('.rouxbe-quiz-question').attr('style',"color:#555;text-decoration:none;margin:0;text-align:left;padding:0;font-weight: bold;margin: 0 0 5px 0;font-size:11px;padding-bottom: 5px;")
    w.find('.widget-logo').attr('style', "float:right;text-align:right;padding:0;margin:0")
    
    // Correct
    w.find('.correct-image img').attr('style', "border:none;width:121px;height:83px;padding:0;margin:0;background:transparent")
    w.find('.correct-firstp').attr('style', "font-size:11px; text-decoration:none;padding:0;margin:0;text-align:center;margin-top: 10px;line-height:13px")
    w.find('.correct-secondp').attr('style', "font-size:11px;text-decoration:none;padding:0;margin:0;text-align:center;width:100%;line-height:16px")
    w.find('.correct-link').attr('style', "font-size:11px;color:#555;font-weight:bold;")
  },
  
  upgrade_jquery: function(question){
    return "<div id='rouxbe-quiz-widget'> \
      <p class='upgrade'>Please upgrade your jQuery version to 1.3.2 or higher to use this widget. <br /> <a href='http://jquery.com/'>Get jQuery Here</a></p> \
      <div class='upgrade-float'> \
        <img src='http://rouxbe.com/images/widget/logo.png' /> \
      </div> \
      <div class='clear-right'></div> \
    </div> \
    "
  },
  
  correct: function(lesson, question){
    return "<div class='rouxbe-quiz-question'> \
      Bingo! Nice work. \
    </div> \
    <div class='correct-image'> \
      <center> \
      <a href='"+lesson.quiz_url+"?"+Rouxbe.Widget.utm_and_affiliate_codes(question)+"' target='_blank'> \
        <img src='http://rouxbe.com/images/transparent.gif' /> \
      </a> \
      </center> \
    </div> \
    <p class='correct-firstp'>Why not take the full online quiz for this lesson: \
    <p class='correct-secondp'> \
    <a class='correct-link' href='"+lesson.quiz_url+"?"+Rouxbe.Widget.utm_and_affiliate_codes(question)+"' target='_blank'> \
      "+lesson.name+" \
    </a></p> \
    "
  },
  
  html: function()
  {
    return " \
      <div id='rouxbe-quiz-widget' style='display:none'> \
      \
        <div class='rouxbe-wop'> \
          \
          <div class='rouxbe-quiz-header'> \
            <h2 class='rouxbe-htc'>Cooking School</h2> \
            <h3 class='rouxbe-htc'>Daily Quiz Question</h3> \
          </div> \
          \
          <div class='rouxbe-quiz-question-box rouxbe-wip'> \
          \
            <div class='rouxbe-quiz-loading'> \
              <img src='http://rouxbe.com/images/spinner.gif' />\
            </div> \
            <div class='rouxbe-quiz-question'> \
            </div> \
            <ul class='rouxbe-quiz-answers'> \
            </ul> \
            \
          </div> \
          \
          <div class='widget-logo'> \
            <img src='http://rouxbe.com/images/widget/logo.png' /> \
          </div> \
          \
          <div class='clear-right'></div> \
        </div> \
      </div>\
      <a href='http://rouxbe.com/widgets' class='rouxbe-widget-link' target='_blank' style='display:none'>Get This Widget</a> \
    "
  }
}

function loadjQuery() 
{    
  if(typeof(jQuery) == 'undefined')
  {    
    if(!jQueryPresent)
    {
      jQueryPresent = true;
      document.write("<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>");
    }
    setTimeout("loadjQuery()", 50);
  } 
  else 
  {
    
    // We have jQuery!
    jQuery(function($) 
    {
      
      /*
       *  beResetCSS 0.1 - jQuery plugin
       *  written by Benjamin Mock
       *  http://benjaminmock.de/jquery-css-reset-plugin/
       *
       *  Copyright (c) 2009 Benjamin Mock (http://benjaminmock.de)
       *  Dual licensed under the MIT (MIT-LICENSE.txt)
       *  and GPL (GPL-LICENSE.txt) licenses.
       *
       *  Built for jQuery library
       *  http://jquery.com
       *
       */
      $.fn.beResetCSS = function(){
        resetStyles(this);
        return this;
      };

      function resetStyles( element ) {
        var tagName = $(element)[0].tagName.toLowerCase();

        var elements = new Array();
        var styles = new Array();

        elements[0] = [ 'html', 'body', 'div', 'span', 'applet', 'object', 'iframe',
                'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'blockquote', 'pre',
                'a', 'abbr', 'acronym', 'address', 'big', 'cite', 'code',
                'del', 'dfn', 'em', 'font', 'img', 'ins', 'kbd', 'q', 's', 'samp',
                'small', 'strike', 'strong', 'sub', 'sup', 'tt', 'var',
                'b', 'u', 'i', 'center',
                'dl', 'dt', 'dd', 'ol', 'ul', 'li',
                'fieldset', 'form', 'label', 'legend',
                'table', 'caption', 'tbody', 'tfoot', 'thead', 'tr', 'th', 'td'];

        var s = {
          margin: '0',
          padding: '0',
          border: 'none',
          outline: '0',
          fontSize: '100%',
          verticalAlign: 'baseline',
          background: 'transparent',
          'background-color': 'transparent',
          'background-image': 'none',
          color:'#000',
          'font-family': 'sans-serif',
          'text-decoration': 'none'
        };
        styles[0] = s;

        elements[1] = ['body'];
        s = {
          lineHeight: '1'
        };
        styles[1] = s;

        elements[2] = ['ol', 'ul'];
        s = {
          listStyle: 'none'
        }
        styles[2] = s;

        elements[3] = ['blockquote', 'q'];
        s = {
          quotes: 'none'
        }
        styles[3] = s;

        elements[4] = ['ins'];
        s = {
          textDecoration: 'none'
        }
        styles[4] = s;

        elements[5] = ['del'];
        s = {
          textDecoration: 'line-through'
        }
        styles[5] = s;

        elements[6] = ['table'];
        s = {
          borderCollapse: 'collapse',
          borderSpacing: '0'
        }
        styles[6] = s;

        elements[7] = ['li'];
        s = {
          border: 'none'
        }
        styles[7] = s;

        // resetting styles
        $(elements).each(function(i){
          $(this).each(function(k){
            if(tagName == this){
              addStyles(element, styles[i]);
            }
          });
        });
      }

      function addStyles( element, styles ) {
        for(key in styles)
        {
          $(element).css(key, styles[key]);
        }
      }

      if(options.selector == undefined){ options.selector = '.rouxbe-quiz'}
            
      if (/1\.(0|1|2|3)\.(0|1)/.test($.fn.jquery) 
                          || /^1.1/.test($.fn.jquery) 
                          || /^1.2/.test($.fn.jquery)) 
      {
        $(options.selector).html(Rouxbe.Widget.upgrade_jquery())
        return 0;
      }
      
      $(options.selector).html(Rouxbe.Widget.html())
      
      var url = "http://rouxbe.com/cooking-school/questions/daily.json?"
      if(options.question_id != undefined)
      { url += "question_id="+options.question_id+"&callback=?" }
      else
      { url += "callback=?" }
      
      $.getJSON(url, function(data)
      {
        $(options.selector).find('.rouxbe-quiz-question').html(data.question.text)
        
        var number_of_answers = data.answers.length;
        for(var i=0; i < number_of_answers; i++)
        {
          var answer = data.answers[i];
          var class_name = 'rouxbe-quiz-answer-'+i;
          $(options.selector).find('.rouxbe-quiz-answers').append("<li class='"+class_name+" rouxbe-quiz-answer'><img class='error' src='http://rouxbe.com/images/icons/incorrect_bullet.gif' /><input type='radio' name='answer' /><div class='question'>"+answer.text+"</div></li>")
          
          $(options.selector).find('.'+class_name+' input').data('correct', answer.correct)
          $(options.selector).find('.'+class_name+' input').change(function(){

            if($(this).data('correct') == true)
            {                
              // Correct
              $(this).closest('.rouxbe-quiz-question-box').html(
                Rouxbe.Widget.correct(data.lesson, data.question)
              );
                          
              $(options.selector).beResetCSS();
              Rouxbe.Widget.apply_styles(options)
              
              $(options.selector).find('.rouxbe-quiz-question').attr('style',"padding-bottom: 5px;font-weight:bold; color:#a3a60f; text-align:center; font-size:12px")
              $('.correct-image').attr('style', "padding:0;margin:0;overflow:hidden;background:url("+data.lesson.image+") no-repeat 50% 0;height:83px")
              $(options.selector).find('.rouxbe-lesson-link').attr('href', data.lesson.url+"?"+Rouxbe.Widget.utm_and_affiliate_codes(data.question))
            }
            else
            {
              // Wrong
              $(this).closest('li').find('img.error').show();
              $(this).closest('li').find('div').css('color', '#c00')
              $(this).closest('li').find('div').css('text-decoration', 'line-through')
              $(this).hide()
            }
          }) 
        }
        
        $('.rouxbe-quiz *, .rouxbe-widget-link').beResetCSS();
        Rouxbe.Widget.apply_styles(options)
        var w = $(options.selector).find('.rouxbe-quiz-question').width();
        $('li.rouxbe-quiz-answer').css('width', w - 20)
        
        $('#rouxbe-quiz-widget').show()
        $('.rouxbe-quiz-loading').hide();
      })
      
    });
  }
}


loadjQuery();