Clean up unneeded alt txt; rework "Add to my list"
authorRick Scott <rick@shadowspar.dyndns.org>
Wed, 29 Jun 2011 18:31:28 +0000 (14:31 -0400)
committerRick Scott <rick@shadowspar.dyndns.org>
Wed, 29 Jun 2011 18:31:28 +0000 (14:31 -0400)
1: Set blank alt text attrib on non-functional images; also remove
alt text on images that's duplicated by adjacent link text.
This reduces clutter text browser and screen reader users.  More:
http://universalusability.com/access_by_design/images/irrelevant.html

2: Make "Add to my list" use a styled link instead of an image & button,
like the "Place Hold" link next to it.  This lets us remove the duplicate
alt text, makes the two items operate in the same way, and makes the
presentation code more similar between table.tt2 & record/summary.tt2.

Open-ILS/web/templates/default/opac/parts/printnav.tt2
Open-ILS/web/templates/default/opac/parts/record/summary.tt2
Open-ILS/web/templates/default/opac/parts/result/table.tt2
Open-ILS/web/templates/default/opac/parts/searchbar.tt2

index 580c0d6..d0f0a41 100644 (file)
@@ -1,7 +1,7 @@
 <div class="big-block">
     <div class="float-right">
         <div class="pos-rel">
-            <img src="[% ctx.media_prefix %]/images/utils-corner-left.png" class="float-left" />
+            <img src="[% ctx.media_prefix %]/images/utils-corner-left.png" class="float-left" alt="" />
             <div class="left-corner"> 
                 <a href="javascript:history.go(-1)"
                     id="util_back_btn"><img alt="[% l('Back') %]"
@@ -19,7 +19,7 @@
                     id="util_forw_btn"><img alt="[% l('Forward') %]"
                     src="[% ctx.media_prefix %]/images/tool_forward.png" /></a>
             </div>
-            <img src="[% ctx.media_prefix %]/images/utils-corner-right.png" class="float-left" />
+            <img src="[% ctx.media_prefix %]/images/utils-corner-right.png" class="float-left" alt="" />
         </div>
     </div>
 </div>
index 4dbfadc..2fdd9fd 100644 (file)
                             [% END %]
                         </td>
                         <td align="right" valign="top" nowrap="nowrap" style="white-space:nowrap;">
-                            <div style="width:230px;text-align:left;margin-top:3px;">
+                            <div style="width:280px;text-align:left;margin-top:3px;">
                                 <div style="float:right;">
                                     <div class="rdetail_aux_utils opac-auto-010">
                                         <a href="[% ctx.opac_root %]/place_hold[%-
                                             propagator; propagator.length > 1 ? "&amp;" : ""; %]hold_target=[% ctx.bre_id %]&amp;hold_type=T" id="rdetail_place_hold" class="no-dec"><img
-                                            src="[% ctx.media_prefix %]/images/green_check.png" alt="[% l('place hold') %]" /><span 
+                                            src="[% ctx.media_prefix %]/images/green_check.png" alt="" /><span 
                                                 style="position:relative;top:-3px;left:3px;">[% l('Place Hold') %]</span></a>
                                     </div>
                                     <div class="rdetail_aux_utils opac-auto-121">
                                             operation = ctx.mylist.grep(ctx.bre_id).size ? "delete" : "add";
                                             label = (operation == "add") ? l("Add to my list") : l("Remove from my list"); 
                                         %]
-                                        <form action="[% ctx.opac_root %]/mylist/[% operation %]" method="POST">
-                                            <input type="hidden" name="record" value="[% ctx.bre_id %]" />
-                                            <div class="pos-abs">
-                                                <div class="opac-auto-149">
-                                                    <input type="submit" title="[% label %]" value="[% label %]" class="subtle-button" />
-                                                </div>
-                                            </div>
-                                            <input type="image" alt="[% label %]"
-                                                src="[% ctx.media_prefix %]/images/clipboard.png" />
-                                        </form>
+                                        <a href="[% ctx.opac_root %]/mylist/[% operation %]?record=[% ctx.bre_id %]" class="no-dec">
+                                            <img src="[% ctx.media_prefix %]/images/clipboard.png" alt="" />
+                                            [% label %]
+                                        </a>
                                     </div>
                                 </div>
                                 <div style="float:right;margin-right:17px;">
index 6fc3b2e..3b8dbb7 100644 (file)
                                                                 href="[% ctx.opac_root %]/place_hold[% propagator; propagator.length > 1 ? "&amp;" : ""; %]hold_target=[% rec.id %]&amp;hold_type=T" 
                                                                     name="place_hold_link" class="no-dec"><img
                                                                 src="[% ctx.media_prefix %]/images/green_check.png"
-                                                                alt="[% l('Place hold') %]"/><span style="position:relative;top:-3px;left:3px;">[% l('Place Hold') %]</span></a>
+                                                                alt=""/><span style="position:relative;top:-3px;left:3px;">[% l('Place Hold') %]</span></a>
                                                         </div>
                                                         <div class="results_aux_utils opac-auto-011">
-                                                            [%  operation = ctx.mylist.grep(rec.id).size ? "delete" : "add";
-                                                                label = (operation == "add") ? l("Add to") : l("Remove from"); %]
-                                                            <form action="[% ctx.opac_root %]/mylist/[% operation %]" method="POST">
-                                                                <input type="hidden" name="record" value="[% rec.id %]" />
-                                                            <div style="position:absolute;">
-                                                                <div style="position:relative;top:5px; left: 25px;">
-                                                                    <input type="submit" title="[% l(label _ ' my list') %]" value="[% l(label _ ' my list') %]" class="subtle-button" />
-                                                                </div>
-                                                            </div>
-                                                                <input type="image"
-                                                                alt="[% l(label _ ' my list') %]"
-                                                                src="[% ctx.media_prefix %]/images/clipboard.png" />
-                                                        </form>
+                                                            [%  
+                                                                operation = ctx.mylist.grep(rec.id).size ? "delete" : "add";
+                                                                label = (operation == "add") ? l("Add to my list") : l("Remove from my list");
+                                                            %]      
+                                                            <a href="[% ctx.opac_root %]/mylist/[% operation %]?record=[% rec.id %]" class="no-dec">
+                                                                <img src="[% ctx.media_prefix %]/images/clipboard.png" alt="" />
+                                                                [% label %]
+                                                            </a>
                                                         </div>
                                                         <!-- <div style="padding-top:7px;" class="results_aux_utils">
                                                             <a title="Reviews and More" target="_blank" class="no-dec"
index 433ce68..d6c4eb3 100644 (file)
@@ -39,7 +39,7 @@
                             onmouseover="this.src='[% ctx.media_prefix %]/images/go-btn-hover.png';"
                             onmouseout="this.src='[% ctx.media_prefix %]/images/go-btn.png';" 
                             onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden"}, 2000)'/>
-                        <img id='search-submit-spinner' src='/opac/images/progressbar_green.gif' style='height:16px;width:16px;' class='hidden'/>
+                        <img id='search-submit-spinner' src='/opac/images/progressbar_green.gif' style='height:16px;width:16px;' class='hidden' alt=''/>
                     </div>
                 </div>
             </td>