/****************************************************************************
Accessible News Slider

Author:
Brian Reindel, modified and adapted by Andrea Ferracani

Author URL:
http://blog.reindel.com, http://www.micc.unifi.it/ferracani

License:
Unrestricted. This script is free for both personal and commercial use.
*****************************************************************************/
(function( $ ){
$.fn.accessNews = function(settings){

var defaults = {
// title for the display
title: "Berita Terbaru :",
// subtitle for the display
subtitle: "",
// number of slides to advance when pagnating
slideBy: 4,
// the speed for the pagination
speed: "normal",
// slideshow interval
slideShowInterval: 5000,
// delay before slide show begins
slideShowDelay: 5000,
// theme
theme: "business_as_usual"
};

return this.each(function(){

settings = jQuery.extend(defaults, settings);
var _this = jQuery(this);
var stories = _this.children();
var intervalId = null;

var container = {

_wrapper: "<div class=\"accessible_news_slider " + settings.theme + "\"></div>",
_container: "<div class=\"container\"></div>",
_headline: jQuery("<div class='headline'></div>").html(["<p><strong>", settings.title, "</strong> ", settings.subtitle, "</p>"].join("")),
_content: jQuery("<div class='content'></div>"),
_first: jQuery(stories[0]),

init: function(){
// wrap the ul with our div class and assigned theme
_this.wrap(this._wrapper);
// our container where we show the image and news item
_this.before(this._container);
// set the width of the container
_this.css("width", (stories.length * this._first.width()));
this.append(this._headline);
this.append(this._content);
this.set(this._first);
},

append: function(content){
this.get().append(content);
},

// returns the main container
get: function(){
return _this.prev("div.container");
},

set: function(story){
var container = this.get();
var _content = jQuery("div.content", container);
var img = jQuery('<img width="435px" height="200px" ></img>');
var para = jQuery('<div></div>');
var title = jQuery('p.title a', story);
img.attr('src', jQuery('img', story).attr('src'));
title = title.attr('title') || title.text();
para.html("<h1>" + title + "</h1>" + "<p class='paraText'>" + jQuery('p.description', story).html() + "</p>");
stories.removeClass('selected');
story.addClass('selected');
_content.empty();
_content.append(img);
_content.append(para);
}

};

var pagination = {

loaded: false,
_animating: false,
_totalPages: 0,
_currentPage: 1,
_storyWidth: 0,
_slideByWidth: 0,
_totalWidth: 0,

init: function(){
if (stories.length > settings.slideBy) {
this._totalPages = Math.ceil(stories.length / settings.slideBy);
this._storyWidth = jQuery(stories[0]).width();
this._slideByWidth = this._storyWidth * settings.slideBy;
this._totalWidth = this._storyWidth * stories.length;
this.draw();
this.loaded = true;
}
},

draw: function(){

var _viewAll = jQuery("<div class=\"view_all\"></div>").html(["<div class=\"count\"><span class=\"startAt\">1</span> - <span class=\"endAt\">", settings.slideBy, "</span> of ", stories.length, " total</span></div><div class=\"controls\"><span class=\"back\"><a href=\"#\" title=\"Back\">&lt;&lt; Back</a></span><span class=\"next\"><a href=\"#\" title=\"Next\">Next &gt;&gt;</a></span></div>"].join(""));
_this.after(_viewAll);

var _next = jQuery(".next > a", _viewAll);
var _back = jQuery(".back > a", _viewAll);

_next.click(function(){

var page = pagination._currentPage + 1;
pagination.to(page);
return false;

});

_back.click(function(){

var page = pagination._currentPage - 1;
pagination.to(page);
return false;

});

},

to: function(page){

if(this._animating){
return;
}

var viewAll = _this.next(".view_all");
var startAt = jQuery(".startAt", viewAll);
var endAt = jQuery(".endAt", viewAll);

this._animating = true;

if(page >= this._totalPages)
{
page = this._totalPages;
}

if (page <= 1)
{
page = 1;
}

var _startAt = (page * settings.slideBy) - settings.slideBy;
var _left = parseInt(_this.css("left"));
var _offset = (page * this._slideByWidth) - this._slideByWidth;
startAt.html(_startAt + 1);
endAt.html(page * settings.slideBy);

_left = (_offset * -1);

_this.animate({
left: _left
}, settings.speed);

// when paginating set the active story to the first
// story on the page

container.set(jQuery(stories[_startAt]));

this._currentPage = page;
this._animating = false;

}

};

var slideshow = {

init: function(){
this.attach();
setTimeout(function(){
intervalId = "";
slideshow.on();
}, settings.slideShowDelay);
},

on: function(){
if (!intervalId) {
intervalId = setInterval(function(){
slideshow.slide();
}, settings.slideShowInterval);
}
},

off: function(){
if (intervalId) {
clearInterval(intervalId);
intervalId = null;
}
},

slide: function(){

var current = jQuery("li.selected", _this);
var next = current.next("li");
var page = 0;
var storyIndex = 0;
var storyMod = 0;

if (!next.length)
{
next = jQuery(stories[0]);
page = 1;
}

container.set(next);

if (pagination.loaded) {
storyIndex = stories.index(next);
storyMod = (storyIndex) % settings.slideBy;

if (storyMod === 0) {
page = (Math.ceil(storyIndex / settings.slideBy)) + 1;
}

if (page > 0) {
pagination.to(page);
}
}
},

attach: function(){

var that = jQuery(_this).parent("div.accessible_news_slider");
that.hover(function(){
// pause the slideshow on hover
slideshow.off();
}, function (){
// resume slideshow on mouseout
slideshow.on();
});

}

};

//setup the container
container.init();
// pagination setup
pagination.init();
// slideshow setup
slideshow.init();
// append hover every to each element to update container content
stories.hover(function(){
// set container contect to hovered li
container.set(jQuery(this));
}, function(){
// do nothing
});

});
};
})( jQuery );