/*
 
**Roll Over Links**
 
Original Author: Yafully Zhao
Original Date: 09.9.17
MIT license
 
Modified By: Wowenkho
Date Modified: 09.10.24
 
Usage Modifications:
* constructor now accepts, instead of an object, a string of the element ID or Element, where the <a> links are contained.
e.g. new ScrollMenu('menu') or new ScrollMenu($('menu'));
 
* instead of having to manually and ultimately set the height of the links in this class,
the height of the rollover links is now automatically derived from the computed height of each link.
this gives way to the class's effects becoming implementable to links of different heights.
 
* the text of the link when rolled over still comes from the title of the link,
however, if there is no title, the text is derived from the rel attribute.
if rel is also not present, the URL in the href attribute becomes the text.
 
*some syntactic modifications here and there.
 
*/
 
var Scrollmenu = new Class(
{
	initialize: function(linkContainer)
	{
		this.linkContainer = $(linkContainer);
		
		if($defined(this.linkContainer))
		{
			this.initLinks();
			this.initEvents();
		}
	},

	initLinks: function()
	{
		this.linkContainer.getElements('a').each(function(i)
		{
			var text = i.get('text'),
				height = i.getSize().y,
				title = $pick(i.get('title'),i.get('rel'),i.get('href'));

			i.empty();

			this.linksp = new Element('span', {
				'styles': {
					'display':'block',
					'position':'relative',
					'height': height,
					'width':'100%',
					'overflow':'hidden',
					'cursor': 'pointer'
				}
			}).inject(i,'top');
           
			this.linkem = new Element('em', {
			'class':'ems',
			'styles': {
				'display':'block',
				'position':'absolute',
				'left':0,
				'top':-height,
				'width':'100%',
				'line-height':height,
				'font-style':'normal'
			}
			}).set('html','<span>'+title+'</span>'+'<br/>'+text)
				.store('text',text)
				.store('height',height)
				.store('title',title)
				.inject(this.linksp);

		},this);
	},

	initEvents: function()
	{
		this.linkContainer.getElements('em.ems').set('tween', {duration: 400, transition:'back:out', link: 'cancel'}).addEvents(
		{
			'mouseenter': function(e)
			{
				this.tween('top', 0);
			},

			'mouseleave': function(e)
			{
				this.tween('top', -this.retrieve('height'));
			}
		});
	}
});
 
//usage
window.addEvent('domready',function()
{
    new Scrollmenu('sidebar_last_articles');
    new Scrollmenu('sidebar_popular_articles');
    new Scrollmenu('sidebar_sections');
});