forked from mirrors/gecko-dev
4a3b48e09b
Differential Revision: https://phabricator.services.mozilla.com/D7473 --HG-- extra : moz-landing-system : lando
270 lines
16 KiB
HTML
270 lines
16 KiB
HTML
<?xml version="1.0" encoding="UTF-8"?>
|
||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||
<!DOCTYPE html [
|
||
<!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd">
|
||
%globalDTD;
|
||
<!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd" >
|
||
%brandDTD;
|
||
|
||
<!ENTITY viewAllItems "View All Items">
|
||
<!ENTITY paymentSummaryTitle "Your Payment">
|
||
<!ENTITY header.payTo "Pay to">
|
||
<!ENTITY fieldRequiredSymbol "*">
|
||
|
||
<!ENTITY shippingAddressLabel "Shipping Address">
|
||
<!ENTITY deliveryAddressLabel "Delivery Address">
|
||
<!ENTITY pickupAddressLabel "Pickup Address">
|
||
<!ENTITY shippingOptionsLabel "Shipping Options">
|
||
<!ENTITY deliveryOptionsLabel "Delivery Options">
|
||
<!ENTITY pickupOptionsLabel "Pickup Options">
|
||
<!ENTITY shippingGenericError "Can’t ship to this address. Select a different address.">
|
||
<!ENTITY deliveryGenericError "Can’t deliver to this address. Select a different address.">
|
||
<!ENTITY pickupGenericError "Can’t pick up from this address. Select a different address.">
|
||
<!ENTITY paymentMethodsLabel "Payment Method">
|
||
<!ENTITY address.fieldSeparator ", ">
|
||
<!ENTITY address.addLink.label "Add">
|
||
<!ENTITY address.editLink.label "Edit">
|
||
<!ENTITY basicCard.addLink.label "Add">
|
||
<!ENTITY basicCard.editLink.label "Edit">
|
||
<!ENTITY payer.addLink.label "Add">
|
||
<!ENTITY payer.editLink.label "Edit">
|
||
<!ENTITY shippingAddress.addPage.title "Add Shipping Address">
|
||
<!ENTITY shippingAddress.editPage.title "Edit Shipping Address">
|
||
<!ENTITY deliveryAddress.addPage.title "Add Delivery Address">
|
||
<!ENTITY deliveryAddress.editPage.title "Edit Delivery Address">
|
||
<!ENTITY pickupAddress.addPage.title "Add Pickup Address">
|
||
<!ENTITY pickupAddress.editPage.title "Edit Pickup Address">
|
||
<!ENTITY billingAddress.addPage.title "Add Billing Address">
|
||
<!ENTITY billingAddress.editPage.title "Edit Billing Address">
|
||
<!ENTITY basicCard.addPage.title "Add Credit Card">
|
||
<!ENTITY basicCard.editPage.title "Edit Credit Card">
|
||
<!ENTITY basicCard.csc.placeholder "CVV">
|
||
<!ENTITY basicCard.csc.back.infoTooltip "3 digit number found on the back of your credit card.">
|
||
<!ENTITY basicCard.csc.front.infoTooltip "3 digit number found on the front of your credit card.">
|
||
<!ENTITY payer.addPage.title "Add Payer Contact">
|
||
<!ENTITY payer.editPage.title "Edit Payer Contact">
|
||
<!ENTITY payerLabel "Contact Information">
|
||
<!ENTITY manageInPreferences "Manage saved address and credit card information in <a>&brandShortName; Preferences</a>.">
|
||
<!ENTITY manageInOptions "Manage saved address and credit card information in <a>&brandShortName; Options</a>.">
|
||
<!ENTITY cancelPaymentButton.label "Cancel">
|
||
<!ENTITY approvePaymentButton.label "Pay">
|
||
<!ENTITY processingPaymentButton.label "Processing">
|
||
<!ENTITY successPaymentButton.label "Done">
|
||
<!ENTITY unknownPaymentButton.label "Unknown">
|
||
<!ENTITY orderDetailsLabel "Order Details">
|
||
<!ENTITY orderTotalLabel "Total">
|
||
<!ENTITY basicCardPage.error.genericSave "There was an error saving the payment card.">
|
||
<!ENTITY basicCardPage.addressAddLink.label "Add">
|
||
<!ENTITY basicCardPage.addressEditLink.label "Edit">
|
||
<!ENTITY basicCardPage.backButton.label "Back">
|
||
<!ENTITY basicCardPage.nextButton.label "Next">
|
||
<!ENTITY basicCardPage.updateButton.label "Update">
|
||
<!ENTITY basicCardPage.persistCheckbox.label "Save credit card to &brandShortName; (CVV will not be saved)">
|
||
<!ENTITY basicCardPage.persistCheckbox.infoTooltip "&brandShortName; can securely store your credit card information to use in forms like this, so you don’t have to enter it every time.">
|
||
<!ENTITY addressPage.error.genericSave "There was an error saving the address.">
|
||
<!ENTITY addressPage.cancelButton.label "Cancel">
|
||
<!ENTITY addressPage.backButton.label "Back">
|
||
<!ENTITY addressPage.nextButton.label "Next">
|
||
<!ENTITY addressPage.updateButton.label "Update">
|
||
<!ENTITY addressPage.persistCheckbox.label "Save address to &brandShortName;">
|
||
<!ENTITY addressPage.persistCheckbox.infoTooltip "&brandShortName; can add your address to forms like this, so you don’t have to type it every time.">
|
||
<!ENTITY failErrorPage.title "We couldn’t complete your payment to **host-name**">
|
||
<!ENTITY failErrorPage.suggestionHeading "The most likely cause is a hiccup with your credit card.">
|
||
<!ENTITY failErrorPage.suggestion1 "Make sure the card you’re using hasn’t expired">
|
||
<!ENTITY failErrorPage.suggestion2 "Double check the card number and expiration date">
|
||
<!ENTITY failErrorPage.suggestion3 "If your credit card information is correct, contact the merchant for more information">
|
||
<!ENTITY failErrorPage.doneButton.label "Close">
|
||
<!ENTITY timeoutErrorPage.title "**host-name** is taking too long to respond.">
|
||
<!ENTITY timeoutErrorPage.suggestionHeading "The most likely cause is a temporary connection hiccup. Open a new tab to check your network connection or click “Close” to try again.">
|
||
<!ENTITY timeoutErrorPage.doneButton.label "Close">
|
||
<!ENTITY webPaymentsBranding.label "&brandShortName; Checkout">
|
||
<!ENTITY invalidOption.label "Missing or invalid information">
|
||
<!ENTITY acceptedCards.label "Merchant accepts:">
|
||
]>
|
||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
<head>
|
||
<title>&paymentSummaryTitle;</title>
|
||
|
||
<!-- chrome: is needed for global.dtd -->
|
||
<meta http-equiv="Content-Security-Policy" content="default-src 'self' chrome:"/>
|
||
|
||
<link rel="stylesheet" href="chrome://global/skin/in-content/common.css"/>
|
||
<link rel="stylesheet" href="resource://formautofill/editDialog-shared.css"/>
|
||
<link rel="stylesheet" href="resource://formautofill/editAddress.css"/>
|
||
<link rel="stylesheet" href="resource://formautofill/editCreditCard.css"/>
|
||
<link rel="stylesheet" href="resource://formautofill/editDialog.css"/>
|
||
<link rel="stylesheet" href="paymentRequest.css"/>
|
||
<link rel="stylesheet" href="components/rich-select.css"/>
|
||
<link rel="stylesheet" href="components/address-option.css"/>
|
||
<link rel="stylesheet" href="components/basic-card-option.css"/>
|
||
<link rel="stylesheet" href="components/shipping-option.css"/>
|
||
<link rel="stylesheet" href="components/payment-details-item.css"/>
|
||
<link rel="stylesheet" href="components/accepted-cards.css"/>
|
||
<link rel="stylesheet" href="containers/address-form.css"/>
|
||
<link rel="stylesheet" href="containers/basic-card-form.css"/>
|
||
<link rel="stylesheet" href="containers/order-details.css"/>
|
||
<link rel="stylesheet" href="containers/rich-picker.css"/>
|
||
<link rel="stylesheet" href="containers/error-page.css"/>
|
||
|
||
<script src="unprivileged-fallbacks.js"></script>
|
||
|
||
<script src="formautofill/autofillEditForms.js"></script>
|
||
|
||
<script type="module" src="containers/payment-dialog.js"></script>
|
||
<script type="module" src="paymentRequest.js"></script>
|
||
|
||
<template id="payment-dialog-template">
|
||
<header>
|
||
<div class="page-error"
|
||
data-shipping-generic-error="&shippingGenericError;"
|
||
data-delivery-generic-error="&deliveryGenericError;"
|
||
data-pickup-generic-error="&pickupGenericError;"
|
||
aria-live="polite"></div>
|
||
<div id="total">
|
||
<currency-amount display-code="display-code"></currency-amount>
|
||
<div>&header.payTo; <span id="host-name"></span></div>
|
||
</div>
|
||
<div id="top-buttons" hidden="hidden">
|
||
<button id="view-all" class="closed">&viewAllItems;</button>
|
||
</div>
|
||
</header>
|
||
|
||
<div id="main-container">
|
||
<payment-request-page id="payment-summary">
|
||
<div class="page-body">
|
||
<address-picker class="shipping-related"
|
||
data-add-link-label="&address.addLink.label;"
|
||
data-edit-link-label="&address.editLink.label;"
|
||
data-field-separator="&address.fieldSeparator;"
|
||
data-shipping-address-label="&shippingAddressLabel;"
|
||
data-delivery-address-label="&deliveryAddressLabel;"
|
||
data-pickup-address-label="&pickupAddressLabel;"
|
||
data-invalid-label="&invalidOption.label;"
|
||
selected-state-key="selectedShippingAddress"></address-picker>
|
||
|
||
<shipping-option-picker class="shipping-related"
|
||
data-shipping-options-label="&shippingOptionsLabel;"
|
||
data-delivery-options-label="&deliveryOptionsLabel;"
|
||
data-pickup-options-label="&pickupOptionsLabel;"></shipping-option-picker>
|
||
|
||
<payment-method-picker selected-state-key="selectedPaymentCard"
|
||
data-add-link-label="&basicCard.addLink.label;"
|
||
data-edit-link-label="&basicCard.editLink.label;"
|
||
data-csc-placeholder="&basicCard.csc.placeholder;"
|
||
data-csc-back-tooltip="&basicCard.csc.back.infoTooltip;"
|
||
data-csc-front-tooltip="&basicCard.csc.front.infoTooltip;"
|
||
data-invalid-label="&invalidOption.label;"
|
||
label="&paymentMethodsLabel;">
|
||
</payment-method-picker>
|
||
<accepted-cards hidden="hidden" label="&acceptedCards.label;"></accepted-cards>
|
||
<address-picker class="payer-related"
|
||
label="&payerLabel;"
|
||
data-add-link-label="&payer.addLink.label;"
|
||
data-edit-link-label="&payer.editLink.label;"
|
||
data-field-separator="&address.fieldSeparator;"
|
||
data-invalid-label="&invalidOption.label;"
|
||
selected-state-key="selectedPayerAddress"></address-picker>
|
||
|
||
<p class="manage-text">
|
||
<span hidden="hidden" data-os="mac">&manageInPreferences;</span>
|
||
<span hidden="hidden">&manageInOptions;</span>
|
||
</p>
|
||
</div>
|
||
|
||
<footer>
|
||
<span class="branding">&webPaymentsBranding.label;</span>
|
||
<button id="cancel">&cancelPaymentButton.label;</button>
|
||
<button id="pay"
|
||
class="primary"
|
||
data-label="&approvePaymentButton.label;"
|
||
data-processing-label="&processingPaymentButton.label;"
|
||
data-unknown-label="&unknownPaymentButton.label;"
|
||
data-success-label="&successPaymentButton.label;"></button>
|
||
</footer>
|
||
</payment-request-page>
|
||
<section id="order-details-overlay" hidden="hidden">
|
||
<h2>&orderDetailsLabel;</h2>
|
||
<order-details></order-details>
|
||
</section>
|
||
|
||
<basic-card-form id="basic-card-page"
|
||
data-add-basic-card-title="&basicCard.addPage.title;"
|
||
data-edit-basic-card-title="&basicCard.editPage.title;"
|
||
data-error-generic-save="&basicCardPage.error.genericSave;"
|
||
data-address-add-link-label="&basicCardPage.addressAddLink.label;"
|
||
data-address-edit-link-label="&basicCardPage.addressEditLink.label;"
|
||
data-billing-address-title-add="&billingAddress.addPage.title;"
|
||
data-billing-address-title-edit="&billingAddress.editPage.title;"
|
||
data-back-button-label="&basicCardPage.backButton.label;"
|
||
data-next-button-label="&basicCardPage.nextButton.label;"
|
||
data-update-button-label="&basicCardPage.updateButton.label;"
|
||
data-cancel-button-label="&cancelPaymentButton.label;"
|
||
data-persist-checkbox-label="&basicCardPage.persistCheckbox.label;"
|
||
data-persist-checkbox-info-tooltip="&basicCardPage.persistCheckbox.infoTooltip;"
|
||
data-csc-placeholder="&basicCard.csc.placeholder;"
|
||
data-csc-back-info-tooltip="&basicCard.csc.back.infoTooltip;"
|
||
data-csc-front-info-tooltip="&basicCard.csc.front.infoTooltip;"
|
||
data-accepted-cards-label="&acceptedCards.label;"
|
||
data-field-required-symbol="&fieldRequiredSymbol;"
|
||
hidden="hidden"></basic-card-form>
|
||
|
||
<address-form id="address-page"
|
||
data-error-generic-save="&addressPage.error.genericSave;"
|
||
data-cancel-button-label="&addressPage.cancelButton.label;"
|
||
data-back-button-label="&addressPage.backButton.label;"
|
||
data-next-button-label="&addressPage.nextButton.label;"
|
||
data-update-button-label="&addressPage.updateButton.label;"
|
||
data-persist-checkbox-label="&addressPage.persistCheckbox.label;"
|
||
data-persist-checkbox-info-tooltip="&addressPage.persistCheckbox.infoTooltip;"
|
||
data-field-required-symbol="&fieldRequiredSymbol;"
|
||
hidden="hidden"></address-form>
|
||
|
||
<completion-error-page id="completion-timeout-error" class="illustrated"
|
||
data-page-title="&timeoutErrorPage.title;"
|
||
data-suggestion-heading="&timeoutErrorPage.suggestionHeading;"
|
||
data-branding-label="&webPaymentsBranding.label;"
|
||
data-done-button-label="&timeoutErrorPage.doneButton.label;"
|
||
hidden="hidden"></completion-error-page>
|
||
<completion-error-page id="completion-fail-error" class="illustrated"
|
||
data-page-title="&failErrorPage.title;"
|
||
data-suggestion-heading="&failErrorPage.suggestionHeading;"
|
||
data-suggestion-1="&failErrorPage.suggestion1;"
|
||
data-suggestion-2="&failErrorPage.suggestion2;"
|
||
data-suggestion-3="&failErrorPage.suggestion3;"
|
||
data-branding-label="&webPaymentsBranding.label;"
|
||
data-done-button-label="&failErrorPage.doneButton.label;"
|
||
hidden="hidden"></completion-error-page>
|
||
</div>
|
||
|
||
<div id="disabled-overlay" hidden="hidden">
|
||
<!-- overlay to prevent changes while waiting for a response from the merchant -->
|
||
</div>
|
||
</template>
|
||
|
||
<template id="order-details-template">
|
||
<ul class="main-list"></ul>
|
||
<ul class="footer-items-list"></ul>
|
||
|
||
<div class="details-total">
|
||
<h2 class="label">&orderTotalLabel;</h2>
|
||
<currency-amount></currency-amount>
|
||
</div>
|
||
</template>
|
||
</head>
|
||
<body dir="&locale.dir;">
|
||
<iframe id="debugging-console"
|
||
hidden="hidden">
|
||
</iframe>
|
||
<payment-dialog data-shipping-address-title-add="&shippingAddress.addPage.title;"
|
||
data-shipping-address-title-edit="&shippingAddress.editPage.title;"
|
||
data-delivery-address-title-add="&deliveryAddress.addPage.title;"
|
||
data-delivery-address-title-edit="&deliveryAddress.editPage.title;"
|
||
data-pickup-address-title-add="&pickupAddress.addPage.title;"
|
||
data-pickup-address-title-edit="&pickupAddress.editPage.title;"
|
||
data-billing-address-title-add="&billingAddress.addPage.title;"
|
||
data-payer-title-add="&payer.addPage.title;"
|
||
data-payer-title-edit="&payer.editPage.title;"></payment-dialog>
|
||
</body>
|
||
</html>
|