Changeset 225:80ae3df02781

Timestamp:

08/28/09 17:07:03 (4 years ago)

Author:

tgambet

Branch:

default

convert_revision:

svn:cdcfb263-7567-472c-a848-e2c2df3466e7/trunk@226

Message:

updated result page for javascript

Location:

WebContent

Files:

• WEB-INF/resources/templates/xhtml10.vm (modified) (1 diff)
• images/arrow_green_closed.png (added)
• images/arrow_green_open.png (added)
• images/arrow_red_closed.png (added)
• images/arrow_red_open.png (added)
• images/arrow_white_closed.png (added)
• images/arrow_white_open.png (added)
• images/arrow_yellow_closed.png (added)
• images/arrow_yellow_open.png (added)
• scripts/w3c_unicorn_results.js (modified) (2 diffs)
• style/base_ucn.css (modified) (4 diffs)

WebContent/WEB-INF/resources/templates/xhtml10.vm

@@ -25 +25 @@
         <h2>
                 <span class="icons">
-                        #if ($infoCount && $infoCount > 0)<img src="images/icone_info.png" alt="info icon" /><span>$infoCount</span> #end
-                        #if ($errorCount && $errorCount > 0)<img src="images/icone_error.png" alt="error icon" /><span>$errorCount</span> #end
-                        #if ($warningCount && $warningCount > 0)<img src="images/icone_warning.png" alt="warning icon" /><span>$warningCount</span> #end
+                        #if ($infoCount && $infoCount > 0)<img src="images/icone_info.png" alt="Infos" title="Infos" /><span>$infoCount</span> #end
+                        #if ($errorCount && $errorCount > 0)<img src="images/icone_error.png" alt="Errors" title="Errors" /><span>$errorCount</span> #end
+                        #if ($warningCount && $warningCount > 0)<img src="images/icone_warning.png" alt="Warnings" title="Warnings" /><span>$warningCount</span> #end
                 </span>
                 #if($observation.isPassed())

WebContent/scripts/w3c_unicorn_results.js

@@ -6 +6 @@
                 W3C.Links.each(function(link) {
                         link.addClass('pointer');
-                });
-                
-                //$merge($$('h2'), $$('h3')).addClass('pointer');
-                
-                W3C.Observers = $$('div.observer');
-                
-                W3C.Observers.each(function(observer) {
-                        observer.getElement('h2').addEvent('click', function(event) {
-                                observer.getElement('div.results').slide('toggle');
-                        });
+                        link.addClass('toggles');
                 });
                 
@@ -21 +12 @@
                 if ($$('div.observer.invalid').length > 0)      
                         $$('div.observer.valid').getElement('div.results').slide('hide');
+                else
+                        $$('div.observer.valid').getElement('h2').addClass('toggled');
+                
+                $$('div.observer.invalid').getElement('h2').addClass('toggled');
+                $$('div.errors').getElement('h3').addClass('toggled');
+                $$('div.infos').getElement('h3').addClass('toggled');
+                
+                $$('div.observer').each(function(observer) {
+                        observer.getElement('h2').addEvent('click', function(event) {
+                                observer.getElement('div.results').slide('toggle');
+                                this.toggleClass('toggled');
+                        });
+                });
                 
                 W3C.ResultBlock = $$('div.errors').concat($$('div.infos'), $$('div.warnings')); 
-                
                 W3C.ResultBlock.each(function(results) {
                         results.getElement('h3').addEvent('click', function(event){
                                 results.getElement('div.result').slide('toggle');
                                 results.getParent('div').getParent('div').setStyle('height', 'auto');
+                                this.toggleClass('toggled');
                         });
                 });
                 
-                
         }
-        
 };
 

WebContent/style/base_ucn.css

@@ -367 +367 @@
 .warnings h3  {
         color: #b48700;
-        
 }
 #observations h3 {
@@ -386 +385 @@
 #observations table {
         border-collapse:collapse;
-        /*border-right:1px solid #CCCCCC;
-        border-top:1px solid #CCCCCC !important;
-        line-height:100%;*/
         width:100%;
 }
@@ -433 +429 @@
         clear:left;
         padding:4.1em 10px;
-        /*border-right:thin solid #DDDDDD;*/
 }
 div.observer.css-validator div.infos code, div.observer.css1-validator div.infos code, div.observer.css2-validator div.infos code, div.observer.css21-validator div.infos code, div.observer.css3-validator div.infos code {
@@ -442 +437 @@
 }
 
+div.errors h3.toggles {
+        background: url(../images/arrow_red_closed.png) no-repeat left 4px ;
+        padding-left:12px !important;
+}
+div.errors h3.toggled {
+        background: url(../images/arrow_red_open.png) no-repeat left 4px ;
+        padding-left:12px !important;
+}
+div.infos h3.toggles {
+        background: url(../images/arrow_green_closed.png) no-repeat left 4px ;
+        padding-left:12px !important;
+}
+div.infos h3.toggled {
+        background: url(../images/arrow_green_open.png) no-repeat left 4px ;
+        padding-left:12px !important;
+}
+div.warnings h3.toggles {
+        background: url(../images/arrow_yellow_closed.png) no-repeat left 4px ;
+        padding-left:12px !important;
+}
+div.warnings h3.toggled {
+        background: url(../images/arrow_yellow_open.png) no-repeat left 4px;
+        padding-left:12px !important;
+}
+div.observer h2.toggles {
+        background: url(../images/arrow_white_closed.png) no-repeat 4px 12px;
+        padding-left:15px !important;
+}
+div.observer h2.toggled {
+        background: url(../images/arrow_white_open.png) no-repeat 4px 12px;
+        padding-left:15px !important;
+}