Imrpovements on the wiring editor CSS and the logicGates example

Author: ericabouaf

VERSION.txt

@@ -2,6 +2,20 @@
 To get the latest version, please visit http://javascript.neyric.com/wireit
 ---------------------------------------------------------------------------
 
+Version 0.6.0
+Not released yet
+
+Changeset:
+
+	* WiringEditor:
+		* AccordionView on left panel for module categories
+		* Toolbar
+
+	* Wires:
+		* Label for wires (beta)
+
+----------------------------------------------------
+
 Version 0.5.0
 August 10, 2009
 

backend/php/WiringEditor.php

@@ -58,7 +58,8 @@ public function saveWiring($language, $name, $working) {
     }
 
     public function listWirings($language) {
-         $query = sprintf("SELECT * from wirings WHERE `language`='%s'", mysql_real_escape_string($language) );
+	
+	     $query = sprintf("SELECT * from wirings WHERE `language`='%s'", $language );
          $wirings = $this->queryToArray( $query );
          return $wirings;
     }

css/WireItEditor.css

@@ -6,6 +6,30 @@ body {
 }
 
 
+/* YUI layout */
+.yui-skin-sam .yui-layout .yui-layout-hd {
+	background-position: 0 -1300px;
+}
+.yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-hd h2 {
+	color: black;
+}
+/* Accordion View */
+.yui-skin-sam .yui-accordionview li.yui-accordion-panel a.yui-accordion-toggle.active {
+	border-left: 0;
+	border-right: 0;
+	border-color: #808080;
+	color: black;
+	background-position: 0 -1300px;
+}
+.yui-skin-sam .yui-accordionview li.yui-accordion-panel a.yui-accordion-toggle {
+	font-size: 13px;
+	height: 13px;
+}
+.yui-skin-sam .yui-accordionview li.yui-accordion-panel a.yui-accordion-toggle.active:hover {
+	background-position: 0 -1500px;
+}
+
+
 /**
  * TOP
  */
@@ -21,17 +45,24 @@ body {
 #top .logo {
    /*font-family: cursive;
    color:  #3366CC;*/
-   font-size: 30px;
+	height: 25px;
+   font-size: 16px; /*30px;*/
    font-weight: bold;
    padding-left: 10px;
    padding-top: 4px;
+
+	border-bottom: 1px solid #808080;
+	background: transparent url(../lib/yui/assets/skins/sam/sprite.png) repeat-x scroll 0 -1300px;
 }
 
 /* Toolbar */
 #toolbar {
-   position: absolute;
+   /*position: absolute;
    top: 10px;
-   left: 300px;
+   left: 300px;*/
+	width: 100%;
+	height: 23px;
+	position: relative;
 }
 
 #toolbar .yui-button {
@@ -68,9 +99,9 @@ body {
 div.savedStatus {
 	color:orange;
 	font-size:27pt;
-	left:650px;
+	left:400px;
 	position:absolute;
-	top:10px;
+	/*top:10px;*/
 }
 
 /**
@@ -88,17 +119,23 @@ div.savedStatus {
 
 .WiringEditor-module {
    cursor: move;
-   background-color: #AADDDD;
-   margin: 5px;
+   /*background-color: #AADDDD;*/
+   margin: 1px;
    padding: 2px;
    font-size: 9pt;
    -moz-border-radius: 2px;
-   height: 16px;
+   /*height: 16px;*/
    text-align: left;
+
+	background-color:#F6F6F6;
+	border:1px solid #F1F1F1;
 }
 
 #left .WiringEditor-module:hover {
-   color: red;
+   /*color: red;*/
+
+	background-color:#DDECFE;
+	border:1px solid #C3DAF9;
 }
 
 .WiringEditor-module img {
@@ -132,12 +169,16 @@ div.savedStatus {
 }
 
 #layerMap {
-   width: 80%;
+   /*width: 80%;*/
+	width: 100%;
 }
 
 #layerMap canvas.WireIt-LayerMap {
 	position: relative;
 	/*width: 250px; Don't put any width or it breaks the layerMap */
+	
+	border: 0;
+	width: 100%;
 }
 
 #propertiesForm div.inputEx-Group div.inputEx-label {