$(document).ready(function(){
  // Highlight code
  $('pre.code').highlight({source:0, zebra:1, indent:'space', list:'ol'});
  
  $.foobar({
    "positioning" : "fixed",
    "backgroundColor": "#6c9e00",
    "display" : "collapsed",
    "messages": [ // The messages to display in the bar. If only 1 message it will be displayed permanently otherwise the messagesDelay value is used to cycle through the array.
      "Đóng góp ý kiến xây dựng Docx.Vn phiên bản 2 <a href='http://docx.vn/donggop/ykien.php'><b>Đóng góp ý kiến</b></a>"
    ]
  });
  
  $('.demo-fixed').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#800",
      "messages": ["This foobar is fixed. It will be visible at the top of the page"]
    });
    $('.in-action').css({'position':'fixed'});
    $(this).addClass('demo-current');
  });

  $('.demo-inline').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "inline", 
      "backgroundColor" : "#080",
      "messages": ["This foobar is inline. It will scroll out of view"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'absolute'});
    $('html, body').animate({scrollTop:0}, 'slow');
  });
  
  $('.demo-expanded').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed",
      "display" : "expanded",
      "backgroundColor" : "#4141b2",
      "messages": ["This foobar is in an expanded (or open) state when the page loads"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });
  
  $('.demo-collapsed').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "display" : "collapsed",
      "backgroundColor" : "#088",
      "messages": ["This foobar is in a collapsed state when the page loads"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });
  
  $('.demo-delay').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "display" : "delayed",
      "displayDelay" : 2000,
      "backgroundColor" : "#880",
      "messages": ["This foobar is only shown 2 seconds after the page loads"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
    alert('Wait 2 seconds...');
  });         
  
  $('.demo-onscroll').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "display" : "onscroll",
      "displayDelay" : 2000,
      "backgroundColor" : "#808",
      "messages": ["This foobar is only shown 2 seconds after the page is scrolled"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
    alert('Scroll the page and wait 2 seconds...');
  });     
  
  $('.demo-rss').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#424242",
      "rss":{
            "enabled": true, // If messages can be populated using an RSS feed
            "googleAPIKey": "ABQIAAAAWQfxE_ARsBpyZX6Nw5lIjBRGBTFdlkaF2_VaRwZe9El1psia0BSdIhY19VttHlkxFoyUrIAQA9vByA", // Your Google API key, that is needed in order to pull RSS feed results
            "url": "http://feeds.feedburner.com/themergency?format=xml", // The URL to the RSS feed
            "maxResults":5 //The maximum number of RSS feed resuls to display as messages
            }
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });  
  
  $('.demo-shuffle').toggle(function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#888",
      "messages": ["The social and close area have been switched!"],
      "positionClose": "left",
      "positionSocial": "right",
      "social": {
        "profiles": [{
            "name": "delicious",
            "url": "#foobar-delicious",
            "image": "images/social/delicious.png"
          },{
            "name": "facebook",
            "url": "#foobar-facebook",
            "image": "images/social/facebook.png"
          },{
            "name": "twitter",
            "url": "#foobar-twitter",
            "image": "images/social/twitter.png"
        }]
      }
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  },function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#888",
      "messages": ["The social and close area have been switched!"],
      "positionClose": "right",
      "positionSocial": "left",
      "social": {
        "profiles": [{
            "name": "delicious",
            "url": "#foobar-delicious",
            "image": "images/social/delicious.png"
          },{
            "name": "facebook",
            "url": "#foobar-facebook",
            "image": "images/social/facebook.png"
          },{
            "name": "twitter",
            "url": "#foobar-twitter",
            "image": "images/social/twitter.png"
        }]
      }
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  },function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#888",
      "messages": ["The social and close area have been switched!"],
      "positionClose": "left",
      "positionSocial": "left",
      "social": {
        "profiles": [{
            "name": "delicious",
            "url": "#foobar-delicious",
            "image": "images/social/delicious.png"
          },{
            "name": "facebook",
            "url": "#foobar-facebook",
            "image": "images/social/facebook.png"
          },{
            "name": "twitter",
            "url": "#foobar-twitter",
            "image": "images/social/twitter.png"
        }]
      }
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  },function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#888",
      "messages": ["The social and close area have been switched!"],
      "positionClose": "right",
      "positionSocial": "right",
      "social": {
        "profiles": [{
            "name": "delicious",
            "url": "#foobar-delicious",
            "image": "images/social/delicious.png"
          },{
            "name": "facebook",
            "url": "#foobar-facebook",
            "image": "images/social/facebook.png"
          },{
            "name": "twitter",
            "url": "#foobar-twitter",
            "image": "images/social/twitter.png"
        }]
      }
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });
  
  $('.demo-themes').toggle(function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({"positioning" : "fixed", 
      "backgroundColor" : "Brown",
      "buttonTheme" : "long-arrow",
      "messages": ["Check out the different arrows! (long-arrow)"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  },function() {
    $('.demo-current').removeClass('demo-current');
    $.foobar({"positioning" : "fixed", 
      "backgroundColor" : "FireBrick",
      "buttonTheme" : "small-white-arrow",
      "messages": ["Check out the different arrows! (small-white-arrow)"]
    });
    $('.in-action').css({'position':'fixed'});
  },function() {
    $('.demo-current').removeClass('demo-current');
    $(this).addClass('demo-current');
    $.foobar({"positioning" : "fixed", 
      "backgroundColor" : "Crimson",
      "buttonTheme" : "triangle-arrow",
      "messages": ["These are the default arrows! (triangle-arrow)"]
    });    
    $('.in-action').css({'position':'fixed'});
  });  

  $('.demo-long-message').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "backgroundColor" : "#424242",
      "messages" : ["This is a very long message which will most likely not be fully displayed within your browser unless you are running a very high resolution. Foobar will automatically scroll this message into view to allow full reading of it's contents."],
      "messagesScrollSpeed": 50,
      "messagesScrollDelay": 3000
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });
  
  $('.demo-bounce').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "positioning" : "fixed", 
      "display" : "collapsed",
      "speed" : 400,                
      "easing" : "easeOutBounce",
      "backgroundColor" : "#880",
      "messages": ["This foobar bounces when displayed"]
    });
    $(this).addClass('demo-current');
    $('.in-action').css({'position':'fixed'});
  });
  
  $('.demo-custom-html').click(function(e) {
    e.preventDefault();
    $('.demo-current').removeClass('demo-current');
    $.foobar({
      "height" : 80,
      "positioning" : "fixed", 
      "backgroundColor" : "#888",
      "buttonTheme" : "small-white-arrow",
      "messages": ["<span style='color:#D00'>WARNING! custom HTML, WARNING!</span>",
          "<a href='http://bit.ly/getfoobar' title='Buy it now from CodeCanyon!'><img src='images/foobar-590x75.jpg' alt='Buy the FooBar now' /></a>",
          "We can put any HTML here : <input type='text' value='hello' /> <input type='checkbox' />",
          "Or even show flash : <iframe width='300' height='75' src='http://www.youtube.com/embed/BriU4G33Hd0?rel=0' frameborder='0' allowfullscreen></iframe>"]
    });
    $('.in-action').css({'position':'fixed'});
    $(this).addClass('demo-custom-html');
  });  

});