opac/skin/css_alt/xml/myopac/myopac_summary.xml

   1 \r
   2 \r
   3 <![CDATA[<!-- ****************** myopac_summary.xml ***************************** -->]]>\r
   4 <div id='myopac_summary_div' xmlns:xi="http://www.w3.org/2001/XInclude" style="padding:5px;">\r
   5  <div id="acct_sum">\r
   6   <div style="width:662px;">\r
   7         <div class="header_left"></div>\r
   8         <div class="header_middle">Account Summary</div>\r
   9         <div class="header_right"></div>\r
  10   </div>\r
  11   \r
  12   <div style="clear:both;width:662px;">\r
  13         <div style="float:left;">\r
  14           <div style="padding:10px 15px;" id="myopac_sum_name"></div>\r
  15           <div class="acct_sum_row"><table width="100%" cellspacing="0" cellpadding="0"><tr><td>Items Currently Checked out <span id="myopac_sum_checked" class="view_link">(0)</span></td><td align="right" class="view_link"><a href="javascript:;" onclick="swapTabs($('acct_checked_out'));myOPACChangePage('checked');" rel="myopac_checked_div">View All</a></td></tr></table></div>\r
  16           <div class="acct_sum_row"><table width="100%" cellspacing="0" cellpadding="0"><tr><td>Items Currently on Hold <span id="myopac_sum_holds" class="view_link">(0)</span></td><td align="right" class="view_link"><a href="javascript:;" onclick="swapTabs($('acct_holds'));myOPACChangePage('holds');" rel="myopac_holds_div">View All</a></td></tr></table></div>\r
  17           <div class="acct_sum_row"><table width="100%" cellspacing="0" cellpadding="0"><tr><td>Items ready for pickup <span id="myopac_sum_pickup" class="view_link">(0)</span></td><td align="right" class="view_link"><a href="javascript:;" onclick="swapTabs($('acct_holds'));myOPACChangePage('holds');" rel="myopac_holds_div">View All</a></td></tr></table></div>\r
  18           <div class="acct_sum_row" id="myopac_sum_fines_slim"><table width="100%" cellspacing="0" cellpadding="0"><tr><td>Fees &amp; Fines</td><td align="right" class="view_link"><a id="show_fines_link" href="javascript:;" onclick="showFinesDiv(this);">Show Overdue Materials</a></td></tr></table></div>\r
  19         </div>\r
  20         <div style="float:left;padding:10px 25px;" class="" id="myopac_sum_fines">\r
  21           Fines: <span id="myopac_sum_fines_bal">$0.00</span><br />\r
  22           <a href="javascript:;" onclick="showPaymentForm();"><img alt="Pay Fines" src="/opac/skin/kcls/graphics/pay-fines-btn.png" style="position:relative;top:5px;" /></a>\r
  23         </div>\r
  24   </div>\r
  25  <div style="clear:both;"></div>\r
  26  <div id='myopac_fines_div' xmlns:xi="http://www.w3.org/2001/XInclude" >\r
  27         <table width='100%' class='data_grid data_grid_center'>\r
  28                 <thead class='color_3'>\r
  29                         <tr><td colspan='3' style='padding: 6px'><b>&myopac.fines.title;</b></td></tr>\r
  30                         <tr>\r
  31                                 <td width='33%'>&myopac.fines.owed;</td>\r
  32                                 <td width='33%'>&myopac.fines.paid;</td>\r
  33                                 <td width='33%'>&myopac.fines.balance;</td>\r
  34                         </tr>\r
  35                 </thead>\r
  36 \r
  37                 <tbody id='myopac_fines_summary_tbody'>\r
  38                         <tr id='myopac_fines_summary_loading'><td>&myopac.fines.status;</td></tr>\r
  39                         <tr id='myopac_fines_summary_row' class='hide_me'>\r
  40                                 <td id='myopac_fines_summary_total' >&common.currency;</td>\r
  41                                 <td id='myopac_fines_summary_paid' >&common.currency;</td>\r
  42                                 <td id='myopac_fines_summary_balance' style='color:red;font-weight: bold;'>&common.currency;</td>\r
  43                         </tr>\r
  44                 </tbody>\r
  45         </table>\r
  46 \r
  47         <!--\r
  48         <div id='accrue_explanation' class='hide_me'>\r
  49                 <span>Transactions whose balances are marked with a</span>\r
  50                 <span style='color:red; font-weight: bold'>*</span>\r
  51                 <span>will continue to accrue fines until the checked out item is returned.</span>\r
  52         </div>\r
  53         -->\r
  54 \r
  55 \r
  56         <!-- Table for circulation transactions only -->\r
  57         <div id='myopac_circ_trans_div' class='hide_me'>\r
  58                 <br/><hr/><br/>\r
  59                 <table width='100%' class='data_grid data_grid_center' id='myopac_circ_trans_table'>\r
  60                         <thead>\r
  61                                 <!--<tr><td colspan='10' style='padding: 6px'><b>&myopac.fines.overdue;</b></td></tr>-->\r
  62                                 <tr><td colspan='10' style='padding: 6px'><b>Fines</b></td></tr>\r
  63                                 <tr>\r
  64                                         <td>&common.title;</td>\r
  65                                         <td>&common.author;</td>\r
  66                                         <td>&myopac.fines.checkout;</td>\r
  67                                         <td>&myopac.fines.due;</td>\r
  68                                         <td>&myopac.fines.returned;</td>\r
  69                                         <td>&myopac.fines.balance;</td>\r
  70                                         <td><input checked="checked" type="checkbox" onclick="checkAll($('myopac_circ_trans_tbody'), this, 'selector');" class="" title="Select All" /></td>\r
  71                                 </tr>\r
  72                         </thead>\r
  73                         <tbody id='myopac_circ_trans_tbody'>\r
  74                                 <tr id='myopac_circ_trans_row'>\r
  75                                         <td><a class='classic_link' name='myopac_circ_trans_title'> </a></td>\r
  76                                         <td name='myopac_circ_trans_author'> </td>\r
  77                                         <td name='myopac_circ_trans_start'> </td>\r
  78                                         <td name='myopac_circ_trans_due'> </td>\r
  79                                         <td name='myopac_circ_trans_finished'><span style='color:red;'>&myopac.fines.accruing;</span></td>\r
  80                                         <td><span style='color: red; font-weight: bold;' name='myopac_circ_trans_balance'>&common.currency;</span></td>\r
  81                                         <td><input type="checkbox" class="" checked="checked" name="selector" title="pay this fine" /></td>\r
  82                                 </tr>\r
  83                         </tbody>\r
  84                 </table>\r
  85         </div>\r
  86 \r
  87         <!-- Table for all non-circulation transactions -->\r
  88         <div id='myopac_trans_div' class='hide_me'>\r
  89                 <br/><hr style="border-bottom:none;*height:0px;" color="#dcdbdb" /><br/>\r
  90                 <table width='100%' class='data_grid data_grid_center' id='myopac_trans_table'>\r
  91                         <thead>\r
  92                                 <tr><td colspan='8' style='padding: 6px'><b>&myopac.fines.other;</b></td></tr>\r
  93                                 <tr>\r
  94                                         <td width='16%'>&myopac.fines.time.start;</td>\r
  95                                         <td width='16%'>&myopac.fines.time.paid;</td>\r
  96                                         <td width='16%'>&myopac.fines.owed.initial;</td>\r
  97                                         <td width='16%'>&myopac.fines.paid.amount;</td>\r
  98                                         <td width='16%'>&myopac.fines.balance;</td>\r
  99                                         <td width='16%'>&myopac.fines.type;</td>\r
 100                                         <td width='4%'><input checked="checked" class="" type="checkbox" onclick="checkAll($('myopac_trans_tbody'), this, 'selector');" title="Select All" /></td>\r
 101                                 </tr>\r
 102                         </thead>\r
 103         \r
 104                         <tbody id='myopac_trans_tbody'>\r
 105                                 <tr id='myopac_trans_row'>\r
 106                                         <td name='myopac_trans_start'> </td>\r
 107                                         <td name='myopac_trans_last_payment'> </td>\r
 108                                         <td name='myopac_trans_init_amount'>&common.currency;</td>\r
 109                                         <td name='myopac_trans_total_paid'>&common.currency;</td>\r
 110                                         <td style='color:red; font-weight: bold;'>\r
 111                                                 <span name='myopac_trans_balance_recur' class='hide_me'> * </span>\r
 112                                                 <span name='myopac_trans_balance'>&common.currency;</span>\r
 113                                         </td>\r
 114                                         <td name='myopac_trans_bill_type'> </td>\r
 115                                         <td><input type="checkbox" name='selector' title='pay this fine' checked="checked" /></td>\r
 116                                 </tr>\r
 117                         </tbody>\r
 118                 </table>\r
 119         </div>\r
 120         <a href="javascript:;" onclick="showPaymentForm();"><img alt="Pay Fines" src="/opac/skin/kcls/graphics/pay-fines-btn.png" style="position:relative;top:5px;" /></a>\r
 121         \r
 122         <br/>\r
 123 </div>\r
 124 </div>\r
 125 \r
 126 <div id="pay_fines_now" class="hide_me">\r
 127 <div id='oils-selfck-cc-payment-summary'>\r
 128     Total amount to pay: $<span></span>\r
 129 </div>\r
 130 <table id='oils-selfck-cc-payment-table'>\r
 131     <tbody>\r
 132         <tr>\r
 133             <td colspan="2"><strong>Billing Information</strong></td>\r
 134         </tr>\r
 135         <tr>\r
 136             <td>First Name</td>\r
 137             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCFName' required='true'/></td>\r
 138         </tr>\r
 139         <tr>\r
 140             <td>Last Name</td>\r
 141             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCLName' required='true'/></td>\r
 142         </tr>\r
 143         <tr>\r
 144             <td>Street Address</td>\r
 145             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCStreet' required='true'/></td>\r
 146         </tr>\r
 147         <tr>\r
 148             <td>City</td>\r
 149             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCCity' required='true'/></td>\r
 150         </tr>\r
 151         <tr>\r
 152             <td>State or Province</td>\r
 153             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCState' required='true'/></td>\r
 154         </tr>\r
 155         <tr>\r
 156             <td>ZIP or Postal Code</td>\r
 157             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCZip' required='true'/></td>\r
 158         </tr>\r
 159         <tr>\r
 160             <td colspan="2"><strong>Credit Card Information</strong></td>\r
 161         </tr>\r
 162         <!-- Technically not needed since card type is derived from the CC number\r
 163         <tr>\r
 164             <td>Type of Card</td>\r
 165             <td>\r
 166                 <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCType' required='true'>\r
 167                     <option value='VISA'>VISA</option>\r
 168                     <option value='MasterCard'>MasterCard</option>\r
 169                     <option value='American Express'>American Express</option>\r
 170                 </select>\r
 171             </td>\r
 172         </tr>\r
 173         -->\r
 174         <tr>\r
 175             <td>Credit Card #</td>\r
 176             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCNumber' required='true'/></td>\r
 177         </tr>\r
 178         <tr>\r
 179             <td>Security Code</td>\r
 180             <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCCVV' required='true'/></td>\r
 181         </tr>\r
 182         <tr>\r
 183             <td>Exipration Month</td>\r
 184             <td>\r
 185                 <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCMonth' required='true'>\r
 186                     <option value='01' selected='selected'>Jan</option>\r
 187                     <option value='02'>Feb</option>\r
 188                     <option value='03'>Mar</option>\r
 189                     <option value='04'>April</option>\r
 190                     <option value='05'>May</option>\r
 191                     <option value='06'>June</option>\r
 192                     <option value='07'>July</option>\r
 193                     <option value='08'>Aug</option>\r
 194                     <option value='09'>Sept</option>\r
 195                     <option value='10'>Oct</option>\r
 196                     <option value='11'>Nov</option>\r
 197                     <option value='12'>Dec</option>\r
 198                 </select>\r
 199             </td>\r
 200         </tr>\r
 201         <tr>\r
 202             <td>Expiration Year</td>\r
 203             <td>\r
 204                           <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCYear' required='true'>\r
 205                             <option value='2010'>2010</option>\r
 206                                 <option value='2011'>2011</option>\r
 207                                 <option value='2012'>2012</option>\r
 208                                 <option value='2013'>2013</option>\r
 209                                 <option value='2014'>2014</option>\r
 210                                 <option value='2015'>2015</option>\r
 211                                 <option value='2016'>2016</option>\r
 212                                 <option value='2017'>2017</option>\r
 213                                 <option value='2018'>2018</option>\r
 214                                 <option value='2019'>2019</option>\r
 215                           </select>\r
 216                 <!-- <input dojoType='dijit.form.NumberSpinner' constraints='{pattern:"0000", places:0, maxlength:4}' jsId='oilsSelfckCCYear' required='true'/> -->\r
 217             </td>\r
 218         </tr>\r
 219         <tr class="hide_me">\r
 220             <td>Edit Billing Details</td>\r
 221             <td><input dojoType='dijit.form.CheckBox' jsId='oilsSelfckEditDetails'/></td>\r
 222         </tr> \r
 223         <tr>\r
 224             <td colspan='2' align='center'>\r
 225                 <button dojoType='dijit.form.Button' jsId='oilsSelfckCCSubmit'>Submit Payment</button>\r
 226                                 <button dojoType='dijit.form.Button' onclick="hideMe($('pay_fines_now'));unHideMe($('acct_sum'));">Cancel</button>\r
 227             </td>\r
 228         </tr>\r
 229     </tbody>\r
 230 </table>\r
 231 </div>\r
 232 </div>\r
 233 \r
 234 <!--#include virtual="myopac_fines.xml"-->\r
 235 <![CDATA[<!-- ****************** end: myopac_summary.xml ***************************** -->]]>\r
 236 \r