<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="sitemesh" uri="http://www.opensymphony.com/sitemesh/decorator" %>
<%@ include file="../includes/include.jsp" %>

<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	
	<title><sitemesh:title default="ArtGasmator"></sitemesh:title></title>
	
	<sitemesh:head></sitemesh:head>
	
	<link href="${ctx}/css/artgasmator.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/menu.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/extruder.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/musicplayer.css" rel="stylesheet"  type="text/css"/>
	<link href="${ctx}/css/tabs.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/scroller.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/mb.scrollable.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/slider/jslider.round.plastic.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/slider/jslider.css" rel="stylesheet" type="text/css"/>
	<link rel="stylesheet" type="text/css" href="${ctx}/css/dateinput.css"/>
	<link href="${ctx}/css/textboxlist.css" rel="stylesheet" type="text/css"/>
	<link href="${ctx}/css/textboxlist.autocomplete.css" rel="stylesheet"  type="text/css"/>
	
	<script type="text/javascript" src="${ctx}/js/jquery-1.6.4.min.js"></script>
	<script type="text/javascript" src="${ctx}/js/mbMenu.js"></script>
	<script type="text/javascript" src="${ctx}/js/mbExtruder.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.hoverIntent.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.metadata.js"></script>
	<script type="text/javascript" src="${ctx}/js/artgasmator.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.jplayer.js"></script>
	<script type="text/javascript" src="${ctx}/js/ttw-music-player.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.tools.min.js"></script>
	<script type="text/javascript" src="${ctx}/js/reflection.js"></script>
	<script type="text/javascript" src="${ctx}/js/mbScrollable.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.slider.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.dependClass.js"></script>
	<script type="text/javascript" src="${ctx}/js/textboxlist.js"></script>
	<script type="text/javascript" src="${ctx}/js/textboxlist.autocomplete.js"></script>
	<script type="text/javascript" src="${ctx}/js/growing.input.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.filestyle.js"></script>
	
	
	
	
	<script type="text/javascript">
	
		 $(document).ready(function() {

	     createMenu();
         createExtruder();

        
         new $.TextboxList('#labels',  {unique: false, plugins: {autocomplete: {
				minLength: 2,
				queryRemote: true,
				placeholder:'Empiece a escribir para obtener sugerencias',
				remote: {url: '/artgasmator/artists/labels'}
				
		 }}});
        
         $("input[type=file]").filestyle({ 
             imageheight : 29,
             imagewidth : 121,
             width : 100
         });
        

         $("#nav ul").tabs("#panes > div", {effect: 'fade', fadeOutSpeed: 400});
         $("#scroller").scrollable({circular:true});
         $("#genre-year-slider").slider({ from: 1900, to: 2011, step: 1, smooth: true, round: 0, dimension: "&nbsp;", skin: "plastic" });
         $("#artist-years-active").slider({ from: 1950, to: 2012, step: 1, smooth: true, round: 0, dimension: "&nbsp;", skin: "plastic" });

        
         renderMusicPlayer();

         $("#jobboard").mbScrollable({
             width:274,
             elementsInPage:1,
             elementMargin:0,
             height:"auto",
             controls:"#controls",
             slideTimer:600,
             autoscroll:true,
             scrollTimer:4000
           });
        
 		 $("#member-date").dateinput({selectors:true});
    

      });
	</script>

</head>

<body>
	
	<table width="100%" cellpadding="0" cellspacing="0">
		<tr>
			<td>
				<div id="header" class="header-bkg">
					<table cellpadding="0" cellspacing="0">
						<tr>
							<td>
								<div class="logo" onclick="location.href='${ctx}/home'"></div>
							</td>
							<td>
								<table>
									<tr>
										<td>
											<img style="margin-left:80px" src="${ctx}/images/query-box.png"></img>
										</td>
										<td>
											<img style="margin-left:-5px" src="${ctx}/images/query-btn.png"></img>
										</td>
									</tr>
									<tr>
										<td>
											
										</td>
									</tr>
								</table>
							</td>
							<td>
								<jsp:include page="../includes/header.jsp"></jsp:include>
							</td>
							
						</tr>
					</table>
				</div>
			</td>
		</tr>
		<tr>
			<td>
				<div id="menu">
					<jsp:include page="../includes/menu.jsp"></jsp:include>
				</div>
			</td>
		</tr>
		
		<tr>
			<td>
				<div id="body">
					<sitemesh:body></sitemesh:body>
				</div>
			</td>
		</tr>
		
		
		<tr>
			<td>
				<div id="footer" class="footer-bkg">
					<jsp:include page="../includes/footer.jsp"></jsp:include>
				</div>
			</td>
		</tr>
	 
	 </table>
	
	
	 <div id="extruder" class="{title:''}">
		<div class="voice {}"><a class="label">Eventos</a></div>
		<div class="voice {}">Evento 1</div>
		<div class="voice {}">Evento 2</div>
		<div class="voice {}">Evento 3</div>
	</div>

</body>

</html>