$(document).ready(function() {

    // alle links mit class "zoom" umwandeln
    zoomlinks_update();

	$( ".accordion" ).accordion({
		autoHeight: false,
		collapsible: true,
		active: false,
		change: function(event, ui) {
			var newlogo = ui.newContent.attr('data-logo');
			$('#logo').hide();
			if (newlogo != "") {
				$('#logo').css({backgroundImage: 'url(bilder/logo_'+ newlogo +'.jpg)'}).delay(100).fadeIn(300);
			}
		}
	}).show();
	
	$( ".foto100" ).draggable({
			revert: "invalid", // when not dropped, the item will revert back to its initial position
			containment: "document", // stick to demo-frame if present
			helper: "clone",
			cursor: "move",
			zIndex: 999,
			start: function() {
				merkliste_show();
			},
			stop: function() {
				merkliste_hide();
			}
	});
	
	$( "#merkliste" ).droppable({
			//accept: "#bildbox > img",
			activeClass: "merkliste-aktiv",
			accept: ":not(.ui-sortable-helper)",
			drop: function( event, ui ) {
				$( this ).find( ".placeholder" ).remove();
				merkliste_add( ui.draggable );
			}
	}).sortable({
		/*placeholder: "ui-state-highlight"*/
		items: "div:not(.placeholder)",
		sort: function() {
			// gets added unintentionally by droppable interacting with sortable
			// using connectWithSortable fixes this, but doesn't allow you to customize active/hoverClass options
			$( this ).removeClass( "ui-state-default" );
		}
	});
	
	
	function merkliste_add(image) {
		var remove_icon = $("<div class='foto-remove'></div>");
		var foto_clone = image.clone();
		foto_clone.removeClass("foto100").addClass("foto50");
		foto_clone.append(remove_icon);
		remove_icon.click(function(){
			merkliste_remove(foto_clone);
		});
		$( "#merkliste" ).append(foto_clone);
		zoomlinks_update();
	}
	
	
	function merkliste_remove(image) {
		$(image).remove();
	}
	
	function merkliste_show() {
		$( "#merkliste" ).fadeIn(400 );
	}
	
	function merkliste_hide() {
		if ($( "#merkliste" ).find(".placeholder").size()) {
			$( "#merkliste" ).fadeOut(400 );
		}
	}
	
	
	
	function zoomlinks_update() {
		$("a.zoom").fancybox({
			'transitionIn'  :   'elastic',
			'transitionOut'	:   'elastic',
			'speedIn'       :   600,
			'speedOut'      :   200,
			'overlayShow'   :   true,
			'overlayOpacity':   1,
			'overlayColor'  :   '#CCC',
			'autoScale'     :   false,
			'titlePosition'	:   'over',
			'onComplete'    :   function() {
				$("#fancybox-wrap").hover(
					function() {
						$("#fancybox-title").show();
					}, function() {
						$("#fancybox-title").hide();
					}
				);
			}
		});
	}
	
});