$(document)
		.ready(
				function() {
					var frame_img = $('#patron_pics').find('div.frame');
					if (frame_img.size() > 1) {
						var frame = frame_img.eq(0);
						frame.insertAfter($('div.logo'));
						frame.after('<br style="clear: both;">');
						frame.css('margin-left',
								frame_img.get(1).clientWidth + 50 + 'px');
					}

					var cur_item = 0;
					var $section_view = $("#section_view");
					if ($section_view.size()) {
						var $ul_list = $("#subdiv_item");
						var stop_pos = $ul_list.parent().height()
								- $ul_list.height();
						var animate_speed = 0.100;
						var $view_section = $("#view_section");

						function start_scroll(direction) {

							var cur_pos = $ul_list.position();
							var top_target;

							if (direction == "up") {
								top_target = 0;
							} else if (direction == "down") {
								top_target = stop_pos;
							} else {
								return false;
							}

							var animate_time = Math.abs(Math.abs(top_target)
									- Math.abs(cur_pos.top))
									/ animate_speed;

							$ul_list.animate( {
								top : top_target + "px"
							}, {
								duration : animate_time,
								complete : setup_scroll_button()
							});
						}

						function stop_scroll() {
							$ul_list.stop();
							setup_scroll_button();
						}

						function setup_scroll_button() {
							var cur_pos = $ul_list.position();

							if (cur_pos.top == 0) {

								$("#a_up").css( {
									visibility : "hidden"
								});
								$("#a_down").css( {
									visibility : "visible"
								});

							} else if (cur_pos.top == stop_pos) {

								$("#a_down").css( {
									visibility : "hidden"
								});
								$("#a_up").css( {
									visibility : "visible"
								});

							} else {
								$("#a_up, #a_down").css( {
									visibility : "visible"
								});
							}
						}

						$("#subdiv_item").parent().css( {
							overflow : "hidden"
						});
						if (stop_pos < 0) {
							$("#a_down").css( {
								visibility : "visible"
							});
						}

						$("#a_up").hover(function() {

							stop_scroll();
							start_scroll("up");

						}, function() {
							stop_scroll();
						});

						$("#a_down").hover(function() {

							stop_scroll();
							start_scroll("down");
						}, function() {
							stop_scroll();
						});

						$("#subdiv_item li a")
								.hover(
										function() {
											var item_id = parseInt($(this)
													.attr("id").replace(
															"item_", ""));
											var new_item = section_list[item_id];
											if (cur_item == new_item)
												return false;

											$view_section
													.children()
													.fadeOut(
															"fast",
															function() {

																$view_section
																		.find(
																				"h3.title")
																		.text(
																				new_item.title)
																		.end()

																		.find(
																				"div.picture img")
																		.attr(
																				"src",
																				new_item.icon)
																		.attr(
																				"alt",
																				new_item.title)
																		.end()

																;

																var new_visir_html = "";
																for ( var idx in new_item.visir) {
																	new_visir_html += "<li><img src='"
																			+ new_item.visir[idx].icon
																			+ "' alt='"
																			+ new_item.visir[idx].name
																			+ "' /><span>"
																			+ new_item.visir[idx].name
																			+ "</span>";
																}
																$("#visir ul")
																		.empty()
																		.html(
																				new_visir_html);

																var new_color_html = "";
																for ( var idx in new_item.color)
																	new_color_html += "<li>"
																			+ new_item.color[idx]
																			+ "</li>";
																$("#color ul")
																		.empty()
																		.html(
																				new_color_html);

																$view_section
																		.children()
																		.fadeIn(
																				"slow");
															});

										}, function() {
										});

					}

					var $pane_tabs = $("#content ul.tabs");
					if ($pane_tabs.size()) {
						$pane_tabs.tabs("div.panes > div", {
							tabs : "li"
						});
					}
				});