VulpesOS/assets/webapps/callscreen.gaiamobile.org/index.html

<!DOCTYPE html>
<html lang="en-US" dir="ltr">
  <head>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
    <meta charset="utf-8">
    <meta name="theme-group" content="theme-communications">
    <meta name="theme-color" content="var(--header-background)">
    <title>Dialer</title>

    <!-- CSS -->
    <link rel="stylesheet" type="text/css" href="app://theme.gaiamobile.org/shared/elements/gaia-theme/gaia-theme.css">
    <link rel="stylesheet" type="text/css" href="/style/oncall.css">
    <link rel="stylesheet" type="text/css" href="/style/conference_group_ui.css">
    <link rel="stylesheet" type="text/css" href="/style/oncall_status_bar.css">
    <link rel="stylesheet" type="text/css" href="/style/status.css">

    <link rel="stylesheet" type="text/css" href="/shared/style/dialer/keypad.css">
    <link rel="stylesheet" type="text/css" href="/shared/style/dialer/overlay.css">

    <link rel="stylesheet" type="text/css" href="/shared/style/status.css">
    <link rel="stylesheet" type="text/css" href="/shared/style/action_menu.css">

    <!-- Localization -->
    <!-- <script defer="" type="text/javascript" src="/shared/js/lazy_loader.js"></script> -->
    <meta name="defaultLanguage" content="en-US">
    <meta name="availableLanguages" content="ar:201601260730, bg:201601260730, bn-BD:201601260730, ca:201601260730, cs:201601260730, da:201601260730, de:201601260730, el:201601260730, en-US:201601260730, es:201601260730, eu:201601260730, fr:201601260730, gl:201601260730, hr:201601260730, hu:201601260730, it:201601260730, ja:201601260730, km:201601260730, ko:201601260730, lt:201601260730, mk:201601260730, ms:201601260730, ne-NP:201601260730, nl:201601260730, pa:201601260730, pl:201601260730, pt-BR:201601260730, ro:201601260730, ru:201601260730, sk:201601260730, sq:201601260730, sr-Cyrl:201601260730, sr-Latn:201601260730, sv-SE:201601260730, tr:201601260730, zh-CN:201601260730, zh-TW:201601260730">
    <link rel="localization" href="/locales-obj/index.{locale}.json">
    
    
    
    
    
    

    <!-- <script defer="" type="application/javascript" src="/shared/js/l10n.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/moz_intl.js"></script> -->

    <!-- <script defer="" type="application/javascript" src="/js/index.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/settings_listener.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/settings_url.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/async_storage.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/contact_photo_helper.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/font_size_utils.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/date_time_helper.js"></script> -->

    <!-- <script defer="" type="application/javascript" src="/shared/js/simple_phone_matcher.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/contacts.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/tone_player.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/dtmf_tone.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/keypad.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/utils.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/font_size_manager.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/dialer/voicemail.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/shared/js/bluetooth_helper.js"></script> -->

    <!-- <script defer="" type="application/javascript" src="/js/call_screen.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/js/calls_handler.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/js/conference_group_handler.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/js/conference_group_ui.js"></script> -->
    <!-- <script defer="" type="application/javascript" src="/js/handled_call.js"></script> -->

    <!-- Lazy load these:
    <script defer type="application/javascript" src="/shared/js/fb/fb_request.js"></script>
    <script defer type="application/javascript" src="/shared/js/fb/fb_data_reader.js"></script>
    <script defer type="application/javascript" src="/shared/js/fb/fb_reader_utils.js"></script>
    -->

    <!-- incoming call / swiper on locked screen-->
    <link rel="stylesheet" type="text/css" href="/style/lockscreen.css">
    <!-- <script defer="" src="/shared/js/settings_listener.js"></script> -->
    <!-- <script defer="" src="/shared/js/mobile_operator.js"></script> -->
    <!-- <script defer="" src="/shared/js/lockscreen_slide.js"></script> -->
    <!-- <script defer="" src="/shared/js/screen_layout.js"></script> -->
    <!-- <script defer="" src="/shared/js/simslot.js"></script> -->
    <!-- <script defer="" src="/shared/js/simslot_manager.js"></script> -->
    <!-- <script defer="" src="/shared/js/lockscreen_connection_info_manager.js"></script> --><script src="./gaia_build_defer_index.js" defer="" type="text/javascript"></script>

    
  <meta content="2.5" name="appVersion"></head>
  <body class="skin-comms theme-communications">
    <article id="call-screen" data-layout="" class="displayed" aria-labelledby="call-number-wrapper, group-call-number-wrapper">
      <div id="lockscreen-header">
        <div id="lockscreen-conn-states">
        </div>
        <div id="lockscreen-clock-widget">
          <div id="lockscreen-clock-time"></div>
          <div id="lockscreen-date"></div>
        </div>
      </div>
      <article id="calls" data-count="0">
        <section id="handled-call-template" role="dialog" hidden="">
          <div aria-label="Hang Up" class="hangup-button" role="button" data-l10n-id="hangup-a11y-button"></div>
          <div id="call-number-wrapper" class="numberWrapper direction-status-bar">
            <div class="number font-light"><bdi></bdi></div>
            <span role="button" id="switch-calls-button"></span>
          </div>
          <div class="additionalContactInfo font-light">
            <span class="tel-type" dir="auto"></span>
            <span class="separator"></span>
            <span class="tel" dir="ltr"></span>
          </div>
          <div class="duration">
            <span class="font-light"></span>
            <div class="total-duration"></div>
            <div class="direction"></div>
          </div>
          <div class="sim">
            <!-- Depending on the context, none or only one of those will be displayed -->
            <span class="via-sim"></span>
            <span class="sim-number"></span>
          </div>
        </section>
        <section id="group-call" hidden="">
          <div id="group-call-number-wrapper" class="numberWrapper">
            <div id="group-show"></div>
            <div id="group-call-label" class="number font-light"></div>
          </div>
          <div id="group-call-summary" class="additionalContactInfo font-light">
            <span class="tel-type" dir="auto"></span>
            <span class="separator"></span>
            <span class="tel" dir="ltr"></span>
          </div>
          <div class="duration">
            <span class="font-light"></span>
            <div class="total-duration"></div>
            <div class="direction"></div>
          </div>
        </section>
      </article>
      <form id="group-call-details" role="dialog" data-type="action" class="overlay"><!--
    <header></header>
    <menu>
      <ul id="group-call-details-list">
      </ul>
      <span class="last-button-container">
        <button id="group-hide" data-l10n-id="close">
          Close
        </button>
      </span>
    </menu>
  --></form>
      <form id="bluetooth-menu" role="dialog" data-type="action" class="overlay">
        <header data-l10n-id="select-audio-sources">Select audio sources</header>
        <menu>
          <button data-l10n-id="bluetooth-handsfree-device" id="btmenu-btdevice">Bluetooth handsfree device</button>
          <button data-l10n-id="receiver" id="btmenu-receiver">Receiver</button>
          <button data-l10n-id="speaker" id="btmenu-speaker">Speaker</button>
          <button data-l10n-id="cancel" id="btmenu-cancel">Cancel</button>
        </menu>
      </form>
      <article id="main-container">
        <div id="contact-background"></div>
        <div id="lockscreen-masked-background" class="blank"></div>
        <div id="lockscreen-area"></div>
        <div id="actions-container">
          <div id="swiper-wrapper">
            <div id="lockscreen-icon-container">
              <div id="lockscreen-area-hangup" class="lockscreen-icon-area lockscreen-icon-left dark" role="button" data-l10n-id="hangup-a11y-button" aria-label="Hang Up">
                <div class="lockscreen-icon">
                </div>
              </div>
              <div id="lockscreen-area-pickup" class="lockscreen-icon-area lockscreen-icon-right dark" role="button" data-l10n-id="pickup-a11y-button" aria-label="Pick up">
                <div class="lockscreen-icon">
                </div>
              </div>
              <div id="lockscreen-area-slide" class="lockscreen-icon-area lockscreen-icon-center">
                <div id="lockscreen-canvas-wrapper">
                  <canvas id="lockscreen-canvas"></canvas>
                </div>
              </div>
            </div>
          </div>
          <section id="statusMsg" role="status">
            <p></p>
          </section>
          <footer id="call-options">
            <section id="co-advanced">
              <div class="grid-wrapper grid">
                <span class="grid-cell options-column">
                  <button aria-label="Mute" id="mute" class="co-advanced-option grid center" data-l10n-id="mute">
                    <span class="icon icon-mute"></span>
                  </button>
                </span>
                <span class="grid-cell options-column">
                  <button aria-label="Toggle keypad" id="keypad-visibility" class="co-advanced-option grid center" data-l10n-id="toggleKeypad">
                    <span class="icon icon-keypad-visibility"></span>
                  </button>
                </span>
                <span id="place-new-call-container" class="grid-cell options-column">
                  <button aria-label="New call" id="place-new-call" disabled="" class="co-advanced-option grid center" data-l10n-id="newCall">
                    <span class="icon icon-place-new-call"></span>
                  </button>
                </span>
                <span class="grid-cell options-column">
                  <button aria-label="Speaker" id="speaker" class="co-advanced-option grid" data-l10n-id="speakerOption">
                    <span class="icon icon-speaker"></span>
                  </button>
                  <button aria-label="Bluetooth" id="bt" class="co-advanced-option grid hide" data-l10n-id="bluetoothOption" hidden="">
                    <span class="icon icon-bt"></span>
                  </button>
                </span>
                <span id="hold-and-merge-container" class="grid-cell options-column">
                  <button aria-label="On hold" id="on-hold" class="co-advanced-option grid" disabled="" data-l10n-id="onHoldOption">
                    <span class="icon icon-on-hold"></span>
                  </button>
                  <button aria-label="Merge" id="merge" class="co-advanced-option grid hide" data-l10n-id="merge">
                    <span class="icon icon-merge"></span>
                  </button>
                </span>
              </div>
            </section>
            <footer id="callbar">
              <button aria-label="Hang Up" id="callbar-hang-up" data-l10n-id="hangup-a11y-button">
                <div class="callbar-inner-button">
                </div>
              </button>
              <button aria-label="Pick up" id="callbar-answer" data-l10n-id="pickup-a11y-button">
                <div class="callbar-inner-button">
                </div>
              </button>
            </footer>
          </footer>
        </div>
      </article>
    </article>
    <article id="incoming-container">
      <header dir="ltr">
        <button aria-label="Hang Up" id="incoming-end" data-l10n-id="hangup-a11y-button">
        </button>
        <button aria-label="Hold" id="incoming-answer" data-l10n-id="hold">
        </button>
      </header>
      <section id="incoming-info">
        <div class="incoming-number-info">
          <span id="incoming-number" dir="auto"></span>
          <div id="incoming-number-additional-info" class="font-light">
            <span id="incoming-number-additional-info-tel-type" dir="auto"></span>
            <span class="separator"></span>
            <span id="incoming-number-additional-info-tel" dir="ltr"></span>
          </div>
        </div>
        <div id="incoming-sim" class="sim"></div>
        <button id="incoming-ignore" data-l10n-id="ignore">Ignore Call</button>
      </section>
    </article>
    <article id="views">
      <article id="keyboard-view" class="view">
        <div id="phone-number-view-container">
          <div>
            <div class="grid-wrapper">
              <input aria-label="Phone number" id="phone-number-view" class="phone-number-font font-light" readonly="readonly" data-l10n-id="phoneNumberInput" type="text">
            </div>
          </div>
          <div aria-label="Delete" id="keypad-delete" role="key" data-l10n-id="keypadDelete">
            <div></div>
          </div>
        </div>
        <article id="keyboard-container">
          <section id="keypad" dir="ltr">
            <div class="keypad-row">
              <div class="keypad-key" role="key" data-value="1">
                <span>1</span>
                <em aria-label="Voicemail" class="keypad-subicon voicemail" data-l10n-id="voiceMailKey"></em>
              </div>
              <div class="keypad-key" role="key" data-value="2">
                <span>2</span>
                <em>ABC</em>
              </div>
              <div class="keypad-key" role="key" data-value="3">
                <span>3</span>
                <em>DEF</em>
              </div>
            </div>
            <div class="keypad-row">
              <div class="keypad-key" role="key" data-value="4">
                <span>4</span>
                <em>GHI</em>
              </div>
              <div class="keypad-key" role="key" data-value="5">
                <span>5</span>
                <em>JKL</em>
              </div>
              <div class="keypad-key" role="key" data-value="6">
                <span>6</span>
                <em>MNO</em>
              </div>
            </div>
            <div class="keypad-row">
              <div class="keypad-key" role="key" data-value="7">
                <span>7</span>
                <em>PQRS</em>
              </div>
              <div class="keypad-key" role="key" data-value="8">
                <span>8</span>
                <em>TUV</em>
              </div>
              <div class="keypad-key" role="key" data-value="9">
                <span>9</span>
                <em>WXYZ</em>
              </div>
            </div>
            <div class="keypad-row">
              <div aria-label="Asterisk" class="keypad-key keypad-key-centered" role="key" data-value="*" data-l10n-id="asterisk">
                <div class="asterisk">*</div>
              </div>
              <div class="keypad-key" role="key" data-value="0">
                <span>0</span>
                <em class="font-size-plus">+</em>
              </div>
              <div aria-label="Hash sign" class="keypad-key keypad-key-centered" role="key" data-type="dial" data-value="#" data-l10n-id="hashSign">
                <div class="sharp">#</div>
              </div>
            </div>
          </section>
          <section id="keypad-callbar">
            <div>
              <span aria-label="Add contact" role="button" id="keypad-callbar-add-contact" data-type="action" data-value="add-contact" data-l10n-id="dialerAddContact" disabled="" aria-disabled="true">
                <div class="icon-add-contact"></div>
              </span>
            </div>
            <div>
              <span aria-label="Make call" role="button" id="keypad-callbar-call-action" data-type="action" data-value="make-call" data-l10n-id="makeCall">
                <div>
                </div>
              </span>
            </div>
          </section>
          <section id="keypad-hidebar">
            <button id="keypad-hidebar-mute-action" class="kh__button kh__button--mute"></button>
            <button id="keypad-hidebar-hang-up-action-wrapper" class="kh__call-end-button"></button>
            <button id="keypad-hidebar-hide-keypad-action" class="kh__button kh__button--hide"></button>
          </section>
        </article>
      </article>
    </article>
  </body>

</html>