ywidget: added config form (currently not functinoal)

git-svn-id: https://svn.berlios.de/svnroot/repos/yacy/trunk@4819 6c8d7289-2bf4-0310-a012-ef5d649a1542
yacy · May 17, 2008 · 9b686fe · 9b686fe
1 parent b5faea4
commit 9b686fe
Show file tree

Hide file tree

Showing 2 changed files with 92 additions and 15 deletions.
diff --git a/htroot/yacy/ui/css/ywidget.css b/htroot/yacy/ui/css/ywidget.css
@@ -3,16 +3,15 @@
 		width: 250px;
 	}
 	.ywidget div.items {
-		background-color: white;
-		margin-bottom : 10px;
-		border: none;	
 		margin: 0px;
 		padding: 10px;
+		background-color: white;
+		height: 200px;
+		overflow:hidden;
+		border: none;	
 		border: 1px solid black;
 		text-decoration: none;	
-		font-size: 0.7em;		
-		height: 200px;
-		overflow:hidden;	
+		font-size: 0.7em;	
 	}
 	.ywidget div.nav {
 		display:block;
@@ -27,7 +26,8 @@
 	}
 	.ywidget div.head {
 		display:block;
-		padding:3px 12px;
+		padding-left:5px;
+		padding-top:4px;
 		margin-top: 0;
 		margin-bottom: 0px;		
 		background: url(../img/box250.png) no-repeat;
@@ -52,6 +52,7 @@
 	  	margin-bottom:-0.5em;
 	}
 	.ywidget h4 {		
+		padding-top: 10px;
 		margin-bottom: -0.6em;
 	    line-height: 0.5em
 	    text-decoration: none;
@@ -62,10 +63,29 @@
 	}
 	.ywidget p.date {
 	  	line-height: 1.0em;
-	  	margin-bottom:0.8em;
+	  	margin-bottom:0.8em;	  	
 	  	color:#20A020;	  	
 	}
 	.ywidget img {
-		padding: 2px 2px 2px 2px;
+		padding: 4px 4px 4px 4px;
   		vertical-align: middle;  	
+	}
+	.ywidget img.clickable {
+		cursor:pointer;
+	}
+	.input {
+		width: 180px;  
+		margin-bottom: .5em;
+		padding: 2px 5px;
+		border: 1px solid #CCCCCC;
+		font: normal small Arial, Helvetica, sans-serif;
+		color: #999999;
+	}
+	.select {
+	  	width: 75px;  
+	  	margin-bottom: .5em;
+	  	padding: 2px 5px;
+	  	border: 1px solid #CCCCCC;
+	  	font: normal small Arial, Helvetica, sans-serif;
+	  	color: #999999;
 	}
diff --git a/htroot/yacy/ui/ywidget.html b/htroot/yacy/ui/ywidget.html
@@ -13,12 +13,23 @@
 <script src="js/jquery.serialScroll-min.js" type="text/javascript""></script>
 <script src="js/jquery.query-1.2.3.js" type="text/javascript""></script>
 <script type="text/javascript">
-jQuery(function() {
+$(document).ready(function() {
+    $('#settings').hide();
+    $('#info').bind('click', function() {
+    	$('.items').slideToggle('fast');
+    });
+    var url = $.query.get('rss');
+    if (url == '') {
+    	url = '/yacysearch.rss';
+    }
+    $.query.destructiveRemove("rss");    
     jQuery.getFeed({
-        url: '/yacysearch.rss' + $.query.toString(),
+        url: url + $.query.toString(),        
         success: function(feed) {
             jQuery('#result').prepend('<div class="head">'            
-            + '<img src="img-2/rss.png" alt="rss"/>'
+            + '<a href="http://www.yacy.net">'
+            + '<img src="img/yacy-logo.png" height="20" border="0" alt="YaCy"/>'
+            + '</a>'
             + ' <a href="'
             + feed.link
             + '">'
@@ -61,9 +72,55 @@
 <body>
 	<div id="result" class="ywidget">		
 		<div id="items" class="items"></div>
+		<div id="settings" class="items">
+			<label for="rss">RSS Feed:</label>
+			<br />
+			<input class="input" name="rss" value="" type="text" size="16" maxlength="80" />
+			<img src="img-2/question_blue.png" alt="help" title="help" />
+			<br />
+			<label for="query">Query:</label>
+			<br />
+			<input class="input" name="query" value="" type="text" size="16" maxlength="80" />
+			<img src="img-2/question_blue.png" alt="help" title="help" />
+			<br />
+			<table>
+				<tr>
+					<td>
+						<label for="interval">Scroll intervall:</label>
+						<br />
+						<input class="select" name="intervall" value="2000" type="text" size="8" maxlength="5" />						
+					</td>
+					<td>
+						<label for="duration">Scroll duration:</label>
+						<br />
+						<input class="select" name="duration" value="900" type="text" size="8" maxlength="5" />									
+					</td>
+				</tr>				
+				<tr>
+					<td style="width:55%">
+						<label for="cycle">Scroll cycle:</label>
+						<br />
+						<select class="select" id="cycle" name="cycle">
+							<option value="true" selected="selected">on</option>
+							<option value="false" >off</option>										
+						</select>							
+					</td>
+					<td>
+						<label for="step">Scroll step:</label>
+						<br />
+						<select class="select" id="step" name="step">
+							<option value="1" selected="selected">1</option>
+							<option value="2r" >2</option>
+							<option value="3" >3</option>
+							<option value="3" >4</option>										
+						</select>												
+					</td>
+				</tr>
+			</table>			
+		</div>			
 		<div id="nav" class="nav">
-			<img src="img-2/info.png" alt="Info" />			
-		</div>				
-	</div>
+			<img src="img-2/info.png" id="info" class="clickable" alt="Info" />			
+		</div>
+	</div>	
 </body>
 </html>