Initial dev repository
[kcls-web.git] / opac / skin / kcls / xml / myopac / myopac_summary.xml
diff --git a/opac/skin/kcls/xml/myopac/myopac_summary.xml b/opac/skin/kcls/xml/myopac/myopac_summary.xml
new file mode 100644 (file)
index 0000000..1805ab6
--- /dev/null
@@ -0,0 +1,255 @@
+\r
+\r
+<![CDATA[<!-- ****************** myopac_summary.xml ***************************** -->]]>\r
+<div id='myopac_summary_div' xmlns:xi="http://www.w3.org/2001/XInclude" style="padding:0px;">\r
+ <div id="acct_sum">\r
+  <div style="width:742px;float:left;">\r
+       <div class="header_middle">Account Summary</div>\r
+  </div>\r
+       <div id="myopac_sum_fines">\r
+       <div style="position:absolute;"><div style="position:relative;top:-15px;left:-23px;"><img src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/acct_sum_fines_tl.png" /></div></div>\r
+       <div style="position:absolute;"><div style="position:relative;top:-15px;left:172px;"><img src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/acct_sum_fines_tr.png" /></div></div>\r
+       <div style="position:absolute;"><div style="position:relative;top:161px;left:-23px;"><img src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/acct_sum_fines_bl.png" /></div></div>\r
+       <div style="position:absolute;"><div style="position:relative;top:161px;left:172px;"><img src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/acct_sum_fines_br.png" /></div></div>\r
+         Fines: <span id="myopac_sum_fines_bal">$0.00</span><br />\r
+         <a class="hide_me" href="javascript:;" id="pay_fines_btn1" onclick="showPaymentForm();"><img alt="Pay Fines" onmouseover="this.src='<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/pay-fines-btn-hover.png';" onmouseout="this.src='<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/pay-fines-btn.png';" src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/pay-fines-btn.png" style="position:relative;top:5px;" /></a>\r
+       </div>\r
+  \r
+  <div style="width:662px;">\r
+       <div style="float:left;">\r
+         <div style="padding:10px 0px;" id="myopac_sum_name"></div>\r
+         <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
+         <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
+         <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
+         <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 class="hide_me" id="show_fines_link" href="javascript:;" onclick="showFinesDiv(this);">Show Overdue Materials</a></td></tr></table></div>\r
+       </div>\r
+  </div>\r
+ <div style="clear:both;"></div>\r
+ <div id='myopac_fines_div' xmlns:xi="http://www.w3.org/2001/XInclude" >\r
+       <table width='100%' class='data_grid data_grid_center'>\r
+               <thead class='color_3'>\r
+                       <tr><td colspan='3' style='padding: 6px'><b>&myopac.fines.title;</b></td></tr>\r
+                       <tr>\r
+                               <td width='33%'>&myopac.fines.owed;</td>\r
+                               <td width='33%'>&myopac.fines.paid;</td>\r
+                               <td width='33%'>&myopac.fines.balance;</td>\r
+                       </tr>\r
+               </thead>\r
+\r
+               <tbody id='myopac_fines_summary_tbody'>\r
+                       <tr id='myopac_fines_summary_loading'><td>&myopac.fines.status;</td></tr>\r
+                       <tr id='myopac_fines_summary_row' class='hide_me'>\r
+                               <td id='myopac_fines_summary_total' >&common.currency;</td>\r
+                               <td id='myopac_fines_summary_paid' >&common.currency;</td>\r
+                               <td id='myopac_fines_summary_balance' style='color:red;font-weight: bold;'>&common.currency;</td>\r
+                       </tr>\r
+               </tbody>\r
+       </table>\r
+\r
+       <!--\r
+       <div id='accrue_explanation' class='hide_me'>\r
+               <span>Transactions whose balances are marked with a</span>\r
+               <span style='color:red; font-weight: bold'>*</span>\r
+               <span>will continue to accrue fines until the checked out item is returned.</span>\r
+       </div>\r
+       -->\r
+\r
+\r
+       <!-- Table for circulation transactions only -->\r
+       <div id='myopac_circ_trans_div' class='hide_me'>\r
+               <br/><hr/><br/>\r
+               <table width='100%' class='data_grid data_grid_center' id='myopac_circ_trans_table'>\r
+                       <thead>\r
+                               <!--<tr><td colspan='10' style='padding: 6px'><b>&myopac.fines.overdue;</b></td></tr>-->\r
+                               <tr><td colspan='10' style='padding: 6px'><b>Fines</b></td></tr>\r
+                               <tr>\r
+                                       <td>&common.title;</td>\r
+                                       <td>&common.author;</td>\r
+                                       <td>&myopac.fines.checkout;</td>\r
+                                       <td>&myopac.fines.due;</td>\r
+                                       <td>&myopac.fines.returned;</td>\r
+                                       <td>&myopac.fines.balance;</td>\r
+                                       <td align="center" nowrap="nowrap" style="white-space:nowrap;"><label for="pay_fines_box1">Pay Fines</label><br /><input id="pay_fines_box1" checked="checked" type="checkbox" onclick="checkAll($('myopac_circ_trans_tbody'), this, 'selector');" class="" title="Click to (un)select all fines" /></td>\r
+                               </tr>\r
+                       </thead>\r
+                       <tbody id='myopac_circ_trans_tbody'>\r
+                               <tr id='myopac_circ_trans_row'>\r
+                                       <td><a class='classic_link' name='myopac_circ_trans_title'> </a></td>\r
+                                       <td name='myopac_circ_trans_author'> </td>\r
+                                       <td name='myopac_circ_trans_start'> </td>\r
+                                       <td name='myopac_circ_trans_due'> </td>\r
+                                       <td name='myopac_circ_trans_finished'><span style='color:red;'>&myopac.fines.accruing;</span></td>\r
+                                       <td><span style='color: red; font-weight: bold;' name='myopac_circ_trans_balance'>&common.currency;</span></td>\r
+                                       <td align="center"><input type="checkbox" class="" checked="checked" name="selector" title="pay this fine" /></td>\r
+                               </tr>\r
+                       </tbody>\r
+               </table>\r
+       </div>\r
+\r
+       <!-- Table for all non-circulation transactions -->\r
+       <div id='myopac_trans_div' class='hide_me'>\r
+               <br/><hr style="border-bottom:none;*height:0px;" color="#dcdbdb" /><br/>\r
+               <table width='100%' class='data_grid data_grid_center' id='myopac_trans_table'>\r
+                       <thead>\r
+                               <tr><td colspan='8' style='padding: 6px'><b>&myopac.fines.other;</b></td></tr>\r
+                               <tr>\r
+                                       <td width='16%'>&myopac.fines.time.start;</td>\r
+                                       <td width='16%'>&myopac.fines.time.paid;</td>\r
+                                       <td width='16%'>&myopac.fines.owed.initial;</td>\r
+                                       <td width='16%'>&myopac.fines.paid.amount;</td>\r
+                                       <td width='16%'>&myopac.fines.balance;</td>\r
+                                       <td width='16%'>&myopac.fines.type;</td>\r
+                                       <td width='4%' align="center" nowrap="nowrap" style="white-space:nowrap;"><label for="pay_fines_box2">Pay Fines</label><br /><input id="pay_fines_box2" checked="checked" class="" type="checkbox" onclick="checkAll($('myopac_trans_tbody'), this, 'selector');" title="Click to (un)select all fines" /></td>\r
+                               </tr>\r
+                       </thead>\r
+       \r
+                       <tbody id='myopac_trans_tbody'>\r
+                               <tr id='myopac_trans_row'>\r
+                                       <td name='myopac_trans_start'> </td>\r
+                                       <td name='myopac_trans_last_payment'> </td>\r
+                                       <td name='myopac_trans_init_amount'>&common.currency;</td>\r
+                                       <td name='myopac_trans_total_paid'>&common.currency;</td>\r
+                                       <td style='color:red; font-weight: bold;'>\r
+                                               <span name='myopac_trans_balance_recur' class='hide_me'> * </span>\r
+                                               <span name='myopac_trans_balance'>&common.currency;</span>\r
+                                       </td>\r
+                                       <td name='myopac_trans_bill_type'> </td>\r
+                                       <td align="center"><input type="checkbox" name='selector' title='pay this fine' checked="checked" /></td>\r
+                               </tr>\r
+                       </tbody>\r
+               </table>\r
+       </div>\r
+       <a href="javascript:;" onclick="showPaymentForm();"><img alt="Pay Fines" onmouseover="this.src='<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/pay-fines-btn-hover.png';" src="<!--#echo var="OILS_SKIN_BASE"-->/kcls/graphics/pay-fines-btn.png" style="position:relative;top:5px;" /></a>\r
+       \r
+       <br/>\r
+</div>\r
+</div>\r
+\r
+<div id="pay_fines_now" class="hide_me">\r
+<table id='oils-selfck-cc-payment-table'>\r
+    <tbody>\r
+               <tr>\r
+                       <td><div style="width:129px;"></div></td>\r
+                       <td><div style="width:195px;"></div></td>\r
+                       <td><div style="width:324px;"></div></td>\r
+               </tr>\r
+               <tr>\r
+                 <td colspan='2'><strong>Billing Information</strong></td>\r
+                 <td rowspan='13' valign='top'>\r
+                   Selected fines you are paying for:\r
+                       <table cellpadding="0" cellspacing="5" border="0">\r
+                       <thead><tr><td><strong>Name</strong></td><td><strong>Amount</strong></td></tr></thead>\r
+                       <tbody id="selectedFines"></tbody></table><br />\r
+                       <div id='oils-selfck-cc-payment-summary'>\r
+               Total amount to pay: <strong>$<span></span></strong>\r
+                       </div><br />\r
+                       Click <strong>Cancel</strong> to go back and (un)select other fines.\r
+                 </td>\r
+               </tr>\r
+        <tr>\r
+            <td>First Name</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCFName' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>Last Name</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCLName' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>Street Address</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCStreet' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>City</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCCity' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>State or Province</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCState' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>ZIP or Postal Code</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCZip' required='true'/></td>\r
+        </tr>\r
+               <tr>\r
+                 <td colspan='2'><strong>Credit Card Information</strong></td>\r
+               </tr>\r
+        <!-- Technically not needed since card type is derived from the CC number\r
+        <tr>\r
+            <td>Type of Card</td>\r
+            <td>\r
+                <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCType' required='true'>\r
+                    <option value='VISA'>VISA</option>\r
+                    <option value='MasterCard'>MasterCard</option>\r
+                    <option value='American Express'>American Express</option>\r
+                </select>\r
+            </td>\r
+        </tr>\r
+        -->\r
+        <tr>\r
+            <td>Credit Card #</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCNumber' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td><div style="position:absolute;"><div style="position:relative;left:80px;"><a href="javascript:;" onclick="alert('Also known as a CVV2 code, it is the 3-digit number on the back of the card next to your signature.\nKCLS only accpets VISA and MasterCard.');"><img src="/opac/skin/kcls/graphics/question-mark.png" /></a></div></div> Security Code</td>\r
+            <td><input dojoType='dijit.form.TextBox' jsId='oilsSelfckCCCVV' required='true'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td>Exipration Month</td>\r
+            <td>\r
+                <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCMonth' required='true'>\r
+                    <option value='01' selected='selected'>January</option>\r
+                    <option value='02'>February</option>\r
+                    <option value='03'>March</option>\r
+                    <option value='04'>April</option>\r
+                    <option value='05'>May</option>\r
+                    <option value='06'>June</option>\r
+                    <option value='07'>July</option>\r
+                    <option value='08'>August</option>\r
+                    <option value='09'>September</option>\r
+                    <option value='10'>October</option>\r
+                    <option value='11'>November</option>\r
+                    <option value='12'>December</option>\r
+                </select>\r
+            </td>\r
+        </tr>\r
+        <tr>\r
+            <td>Expiration Year</td>\r
+            <td>\r
+                         <select dojoType='dijit.form.FilteringSelect' jsId='oilsSelfckCCYear' required='true'>\r
+                               <option value='2011'>2011</option>\r
+                               <option value='2012'>2012</option>\r
+                               <option value='2013'>2013</option>\r
+                               <option value='2014'>2014</option>\r
+                               <option value='2015'>2015</option>\r
+                               <option value='2016'>2016</option>\r
+                               <option value='2017'>2017</option>\r
+                               <option value='2018'>2018</option>\r
+                               <option value='2019'>2019</option>\r
+                         </select>\r
+                         <!-- <input dojoType='dijit.form.NumberSpinner' constraints='{pattern:"0000", places:0, maxlength:4}' jsId='oilsSelfckCCYear' required='true'/> -->\r
+                       </td>\r
+        </tr>\r
+        <tr class="hide_me">\r
+            <td>Edit Billing Address</td>\r
+            <td><input dojoType='dijit.form.CheckBox' jsId='oilsSelfckEditDetails'/></td>\r
+        </tr>\r
+        <tr>\r
+            <td colspan='2' align="center">\r
+                <button dojoType='dijit.form.Button' jsId='oilsSelfckCCSubmit'>Submit Payment</button>\r
+                               <button dojoType='dijit.form.Button' onclick="hideMe($('pay_fines_now'));unHideMe($('acct_sum'));">Cancel</button>\r
+            </td>\r
+        </tr>\r
+               <tr>\r
+                 <td colspan="3"><br />\r
+                       Important! You must have a printed receipt to be eligible for a refund on lost items (regulations allow for no exceptions). <br />\r
+                   <strong>To ensure your necessary receipt information is not lost, enter your email address above and a receipt will be emailed to you. Otherwise, make certain you have a printed receipt in hand before closing the payment receipt screen.</strong><br />Refunds are not available for parts and pieces, overdue fines, or items that do not display a specific title in My Account. For a full list of refundable and non-refundable items, visit <a href="http://www.kcls.org/usingthelibrary/borrowing/refundable.cfm">http://www.kcls.org/usingthelibrary/borrowing/refundable.cfm</a><br /><br />This site uses VeriSign SSL encryption to ensure your privacy.\r
+                 </td>\r
+               </tr>\r
+    </tbody>\r
+</table>\r
+</div>\r
+</div>\r
+\r
+<!--#include virtual="myopac_fines.xml"-->\r
+<![CDATA[<!-- ****************** end: myopac_summary.xml ***************************** -->]]>\r
+\r