<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Pragma" content="no-cache" />
  <meta http-equiv="Expires" content="-1" />

  <title>YaCy - Peer-to-Peer Search Network</title>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="Content-Language" content="English, Englisch" />
  
  <link media="screen" type="text/css" href="css/base.css" rel="stylesheet" />
  <link media="screen" type="text/css" href="css/jquery.flexigrid.css" rel="stylesheet" />	
  <link media="screen" type="text/css" href="css/jquery.treeview.css" rel="stylesheet" /> 
  
  <link media="screen" type="text/css" href="css/themes/start/ui.all.css" rel="stylesheet" title="start"/>
  <link media="screen" type="text/css" href="css/themes/humanity/ui.all.css" rel="alternate stylesheet" title="humanity"/>	
  <link media="screen" type="text/css" href="css/themes/cupertino/ui.all.css" rel="alternate stylesheet" title="cupertino"/>	
  <link media="screen" type="text/css" href="css/themes/redmond/ui.all.css" rel="alternate stylesheet" title="redmond"/>	
  <link media="screen" type="text/css" href="css/themes/smoothness/ui.all.css" rel="alternate stylesheet" title="smoothness"/>	
  <link media="screen" type="text/css" href="css/themes/ui-darkness/ui.all.css" rel="alternate stylesheet" title="ui-darkness"/>
  <link media="screen" type="text/css" href="css/themes/ui-lightness/ui.all.css" rel="alternate stylesheet" title="ui-lightness"/>
  
  <script src="js/jquery-1.3.1.min.js" type="text/javascript"></script>    
  <script src="js/jquery.ui.all.min.js" type="text/javascript"></script>
    
  <script src="js/jquery.dimensions.min.js" type="text/javascript"></script>  
  <script src="js/jquery.metadata.min.js" type="text/javascript"></script>
  
  <script src="js/jquery.form.js" type="text/javascript"></script>
  <script src="js/jquery.field.min.js" type="text/javascript"></script>
  
  <script src="js/jquery-faviconize-1.0.js" type="text/javascript"></script>  
  <script src="js/jquery-flexigrid.js" type="text/javascript"></script>
    
  <script src="js/jquery.treeview.min.js" type="text/javascript"></script>
  <script src="js/jquery.treeview.async.js" type="text/javascript"></script>
  
  <script type="text/javascript">
   //<![CDATA[	
	HTMLenc = function(s) {
		return $('<div/>').text(s).html();			
	}
	String.prototype.startsWith = function(str) {
		return (this.match("^"+str)==str)
	}
	String.prototype.trim = function() {
		return (this.replace(/^[\s\xA0]+/, "").replace(/[\s\xA0]+$/, ""))
	}
	String.prototype.endsWith = function(str) {
		return (this.match(str+"$")==str)
	}	
	$(function() {		
		theme = "start";
		qtag = "";
		flex = {};
		bmk_tab = 2;
		tabid = "#Welcome";
		
		$(window).resize(function(){
  			var width = document.documentElement.clientWidth;
			if (width > 800) width = width - 290;
            else width = width - 20;
			$("#tabs-container").width(width);
		});
		$(window).trigger("resize");
		
		$.ajaxSetup({
			timeout: 10000,
			cache: false
		})		
		
		/* Initialize Tabs and set up close function */
		$tabs = $('#tabs-container').tabs({
			// tabs options
		});
		/* $tabs.tabs().find(".ui-tabs-nav").sortable(); */
		$tabs.bind('tabsadd', function(event, ui) {
            	var li = $(ui.tab).parents('li:eq(0)')[0];
                $('a', li).attr('style','float:left');
                var close = $('<span style="float: right" class="ui-icon ui-icon-close" role="button" unselectable="on">close</span>').appendTo(li);
                close.bind('click', function() {
					$tabs.tabs('remove', $('li', $tabs).index(li));						
				});
				close.bind('mouseover', function() {
					close.toggleClass("ui-icon-closethick");					
				});
				close.bind('mouseout', function() {
					close.toggleClass("ui-icon-closethick");					
				});
				var search = $("#searchbox input[name='search']").getValue();
				var contentdom = $("#searchbox input[name='contentdom']").getValue();
				var count = $("#searchbox select[name='itemsPerPage']").getValue();
				var offset = 0;
				var resource = $("#searchbox select[name='resource']").getValue();
				var constraint= $("#yoptions select[name='constraint']").getValue();
				var prefermaskfilter = $("#yoptions input[name='prefermaskfilter']").getValue();				
				var urlmaskfilter = $("#yoptions input[name='urlmaskfilter']").getValue();
				var language = $("#searchbox select[name='language']").getValue();
				
				tabid = "#"+ui.panel.id;
				$(tabid).attr('search', search);
				$(tabid).attr('contentdom', contentdom);
				$(tabid).attr('count', count);
	        	$(tabid).attr('offset', offset);
				$(tabid).attr('resource', resource);
				$(tabid).attr('constraint', constraint);
	        	$(tabid).attr('prefermaskfilter', prefermaskfilter);
				$(tabid).attr('urlmaskfilter', urlmaskfilter);
				$(tabid).attr('language', language);		
		});
		$tabs.bind('tabsselect', function(event, ui) {
			/* 
		    Objects available in the function context:
			    ui.tab     - anchor element of the selected (clicked) tab
			    ui.panel   - element, that contains the selected/clicked tab contents
			    ui.index   - zero-based index of the selected (clicked) tab
		    */
	    	tabid = "#"+ui.panel.id;
			if (ui.index == bmk_tab) {
				$("#searchbox select[name='resource']").setValue('ymarks');
				$("#searchbox input[name='contentdom']").setValue('text');
				$("#searchbox input[name='search']").setValue(qtag);
			} else if (ui.index > bmk_tab) {
				var search = $(tabid).attr('search');
				var contentdom = $(tabid).attr('contentdom');
				var resource = $(tabid).attr('resource');
				var constraint= $(tabid).attr('constraint');
				var prefermaskfilter = $(tabid).attr('prefermaskfilter');
				var urlmaskfilter = $(tabid).attr('urlmaskfilter');
				var language = $(tabid).attr('language');
				
				$("#searchbox input[name='search']").setValue(search);
				$("#searchbox input[name='contentdom']").setValue(contentdom);
				$("#yoptions select[name='constraint']").setValue(constraint);
				$("#yoptions input[name='prefermaskfilter']").setValue(prefermaskfilter);
				$("#yoptions input[name='urlmaskfilter']").setValue(urlmaskfilter);
				$("#searchbox select[name='language']").setValue(language);
				$('#yoptions').trigger('update');
			}
			return true;
		});
		
		/* Initialize Bookmark Dialog */		
		$("#bmadd").dialog({			
			autoOpen: false,
			height: 400,
			width: 300,
			position: ['top',100],
			modal: true,			
			resizable: false,
			buttons: { 
        		OK: bookmark,
        		Cancel: function() { $("#bmadd").dialog("close"); }
    		} 
		});
		/* Select Theme Dialog */		
		$("#theme_select").dialog({			
			autoOpen: false,
			height: 270,
			width: 275,
			position: ['top',200],
			modal: true,
			resizable: false,
			buttons: { 
        		OK: function() { 
        			var rel = $("#theme").getValue();
        			switchStylestyle(rel);
        			$("#theme_select").dialog("close");
        		},
        		Cancel: function() { $("#theme_select").dialog("close"); }
    		} 
		});
		$("#theme").change(function() { 
			var src = "img/themes/"+$("#theme").getValue()+".png";
			$("#theme_preview").attr("src", src).trigger("update");
		});
		/* Initialize Edit Tags Dialog */		
		$("#tagedit").dialog({			
			autoOpen: false,
			height: 250,
			width: 250,
			position: ['top',100],
			modal: true,
			resizable: false,
			buttons: { 
        		Add: function() {
					data = {
						selectTag: $("input[name='tag1']").getValue(),
						addTag: $("input[name='tag2']").getValue()
					};
					$.ajax({
						type: "GET",
						url: "/api/bookmarks/tags/addTag_p.xml",
						data: data,			
						dataType: "xml",
						success: function(xml) {
							alert($(xml).find('result').text());
							loadTagCloud();
							reloadBM();
							$("#tagadd").dialog('close');							
						}					
					});
        		},
        		Edit: function() {
					data = {
						"old": $("input[name='tag1']").getValue(),
						"new": $("input[name='tag2']").getValue()
					};
					$.ajax({
						type: "GET",
						url: "/api/bookmarks/tags/editTag_p.xml",
						data: data,			
						dataType: "xml"				
					});
					loadTagCloud();
					reloadBM();
					$("#tagedit").dialog('close');
        		},
        		Cancel: function() { $("#tagedit").dialog("close"); }
    		} 
		});
		/* Initialize Add Tags Dialog */		
		$("#tagadd").dialog({			
			autoOpen: false,
			height: 225,
			width: 250,
			position: ['top',100],
			modal: true,
			resizable: false,
			buttons: { 
        		Add: function() { 
					$('.trSelected',flex).each(function() {
						data = {
							urlhash: $(this).find('td :first').text(),
							addTag: $("input[name='tag']").getValue()
						};					
						$.ajax({
							type: 'POST',
							url: "/api/bookmarks/tags/addTag_p.xml",
							data: data,			
							dataType: 'xml'
						}); // close $.ajax(					
					}); //close each(
					loadTagCloud();
					reloadBM();
					$("#tagadd").dialog("close");	 
        		},
        		Cancel: function() {
        			$("input[name='tag1']").setValue("cancel");
        			$("#tagadd").dialog("close"); 
        		}
    		} 
		});  
		/* Load Sidebar */
		$("#side1").load("sidebar/sidebar_1.html");
		$("#side2").load("sidebar/sidebar_2.html");
		$tabs.tabs('select',1);
	});	
   	function bookmark() {
		var url = $("input[name='bm_url']").getValue();
        var title = $("input[name='bm_title']").getValue();
        var desc = $("textarea[name='bm_desc']").getValue();            		
        var tags = $("input[name='bm_tags']").getValue()
        var path = $("input[name='bm_path']").getValue();
        var pub = $("select[name='bm_public']").getValue();
        $.ajax({
			type: "POST",
			url: "/api/bookmarks/posts/add_p.xml",
			data: "url="+url+"&title="+title+"&desc="+desc+"&tags="+tags+"&folders="+path+"&public="+pub,						
			dataType: "xml",
			success: function(xml) {
         		$('#bmaddform').resetForm();
         		$("#bm_url").unbind('blur');
         		$("#bmadd").dialog("close");				
				loadTagCloud();
				reloadBM();
   			}
   		});	 
	}
	function reloadBM() {
		$('#ymarks').flexOptions({
			query: qtag,
			qtype: "tags"
		});
		$('div.ftitle').empty().html('YaCy Bookmarks: ' + HTMLenc(qtag));
		$('#ymarks').flexReload();
	}
	function switchStylestyle(styleName) {
		$('link[rel*=style][title]').each(function(i) 
		{
			this.disabled = true;
			if (this.getAttribute('title') == styleName) this.disabled = false;
		});
	}
	//]]>	
  </script>  
</head>

<body>
	<div id="sidebar" class="sidebar">
		<div class="basic" id="side0">
			<img alt="YaCy Logo" title="YaCy Logo" class="logo" src="img/kaskelix.png" />	
		</div>
		<div id="side1"></div>
		<div id="side2"></div>
	</div>
	<div id="tabs-container" class="main">
		<ul>
			<!-- initial tabs only, dynamic tabs are loaded via jQuery -->
			<li><a href="yacyui-welcome.html" title="About YaCy-UI"><span>About YaCy-UI</span></a></li>
			<li><a href="yacyui-admin.html" title="Admin Console"><span>Admin Console</span></a></li>						
			<li><a href="yacyui-bookmarks.html" title="Bookmarks"><span>Bookmarks</span></a></li>
			<li><a href="yacyui-view-log.html" title="Server Log"><span>Server Log</span></a></li>			
		</ul>		
	</div>
	<div id="dialog-container">
		<!-- Bookmarks Edit Dialog -->	
		<div id="bmadd" class="bm_dialog" title="YaCy Bookmarks">
			<p style="margin-top: -8px;">			
			<img src="img-1/Star.png" style="padding-right: 6px; vertical-align: middle;" alt=""/>
			Add or edit bookmark
			</p>			
			<form id="bmaddform" method="post" accept-charset="UTF-8" action="jQuery"><div>
				<label for="bm_url">URL:</label>
				<br />					
				<input type="text" name="bm_url" id="bm_url" class="bm_input" size="80" />
				<br />
				<label for="bm_title">Title:</label>
				<br />
				<input type="text" name="bm_title" id="bm_title" class="bm_input" size="80" />
				<br />
				<label for="bm_desc">Description:</label>
				<br />
				<textarea name="bm_desc" id="bm_desc" class="bm_input" rows="3" cols="20">
				</textarea>		
				<br />
				<label for="bm_path">Folder (/folder/subfolder):</label>
				<br />
				<input type="text" name="bm_path" id="bm_path" class="bm_input" size="80" />
				<br />
				<label for="bm_tags">Tags (comma separated):</label>
				<br />
				<input type="text" name="bm_tags" id="bm_tags" class="bm_input" size="80" />
				<br />
				<label for="bm_public">Public:</label>
				<br />
				<select name="bm_public" id="bm_public" class="bm_select">
					<option value="public">yes</option>
					<option value="private">no</option>
				</select>
			</div></form>
		</div>
		<!-- Tag Edit Dialog -->	
		<div id="tagedit" title="YaCy Bookmark Edit Tags">
			<p>This dialog lets you rename (edit) tag names. You can also add a new tag to all bookmarks tagged with old tag. 
			</p>
			<form id="tageditform" method="post" accept-charset="UTF-8" action="jQuery"><div>
				<label for="tag1">Old Tag:</label>
				<br />					
				<input type="text" name="tag1" id="tag1" class="filter" size="80" />
				<br />
				<label for="tag2">New Tag:</label>
				<br />					
				<input type="text" name="tag2" id="tag2" class="filter" size="80" />
				<br />		
			</div></form>
		</div>
		<!-- Tag Add Dialog -->	
		<div id="tagadd" title="YaCy Bookmark Add Tags">
			<p>This dialog lets you add tags or folders to the selected bookmarks.</p>
			<form id="tagaddform" method="post" accept-charset="UTF-8" action="jQuery"><div>
				<label for="tag">Tag Name:</label>
				<br />					
				<input type="text" name="tag" id="tag" class="filter" size="80" />
			</div></form>
		</div>
		<!-- Theme Select Dialog -->	
		<div id="theme_select" title="Select YaCy-UI Theme">
			<p>This dialog lets you select an alternate theme/skin for YaCy-UI.</p>
			<form method="post" accept-charset="UTF-8" action="jQuery">
				<div>	
					<select id="theme" name="theme" class="selector">
						<option value="start" selected="selected">Base Theme</option>
						<option value="redmond" >Redmond</option>
						<option value="cupertino" >Cupertino</option>
						<option value="smoothness" >Smoothness</option>
						<option value="ui-darkness" >UI Darkness</option>
						<option value="ui-lightness" >UI Lightness</option>
						<option value="humanity" >Humanity</option>
						<option value="custom" >Custom Theme</option>
					</select>
					<img id="theme_preview" src="img/themes/start.png" style="padding-left: 10px;" alt=""/>
					<p>You can <a href="http://jquery-ui.googlecode.com/files/jquery-ui-themes-1.7.zip">
					download</a> ready made themes or <a href="http://jqueryui.com/themeroller/">create</a> 
					your own custom theme. Themes are installed into<br/>DATA/HTDOCS/yacy/ui/css/themes/</p>
				</div>
			</form>
		</div>
	</div>		
</body>
</html>