summaryrefslogtreecommitdiffstats
path: root/chrome/common/extensions/docs/examples/api/webNavigation/basic/popup.html
blob: 55956aacbae3a1de6ecd1e288194e995d7c45093 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!doctype html>
<!--
 * Copyright (c) 2011 The Chromium Authors. All rights reserved.  Use of this
 * source code is governed by a BSD-style license that can be found in the
 * LICENSE file.
-->
<html>
  <head>
    <title>WebNavigation Tech Demo Popup</title>
    <style>
      body {
        margin: 5px 10px 10px;
      }

      h1 {
        color: #53637D;
        font: 26px/1.2 Helvetica, sans-serif;
        font-size: 200%;
        margin: 0;
        padding-bottom: 4px;
        text-shadow: white 0 1px 2px;
      }

      body > section {
        border-radius: 5px;
        background: -webkit-linear-gradient(rgba(234, 238, 243, 0.2), #EAEEF3),
                    -webkit-linear-gradient(
                        left, #EAEEF3, #EAEEF3 97%, #D3D7DB);
        font: 14px/1 Arial,Sans Serif;
        padding: 10px;
        width:  563px;
        max-height: 400px;
        overflow-y: auto;
        box-shadow: inset 0px 2px 5px rgba(0,0,0,0.5);
      }

      body > section > ol {
        padding: 0;
        margin: 0;
        list-style: none inside;
      }

      body > section > ol > li {
        position: relative;
        margin: 0.5em 0 0.5em 40px;
      }

      code {
        word-wrap: break-word;
        background: rgba(255,255,0, 0.5);
      }

      em {
        position: absolute;
        top: 0px;
        left: -40px;
        width: 30px;
        text-align: right;
        font: 30px/1 Helvetica, sans-serif;
        font-weight: 700;
      }

      p {
        min-height: 30px;
        line-height: 1.2;
      }
  </style>
  </head>
  <body>
    <h1>Most Requested URLs</h1>
    <section></section>
    <script>
        chrome.extension.sendRequest(
            {'type': 'getMostRequestedUrls'},
            function generateList(response) {
              var section = document.querySelector('body>section');
              var results = response.result;
              var ol = document.createElement('ol');
              var li, p, em, code, text;
              var i;
              for (i = 0; i < results.length; i++ ) {
                li = document.createElement('li');
                p = document.createElement('p');
                em = document.createElement('em');
                em.textContent = i + 1;
                code = document.createElement('code');
                code.textContent = results[i].url;
                text = document.createTextNode(
                    chrome.i18n.getMessage('navigationDescription',
                                           [results[i].numRequests,
                                            results[i].average]));
                p.appendChild(em);
                p.appendChild(code);
                p.appendChild(text);
                li.appendChild(p);
                ol.appendChild(li);
              }
              section.innerHTML = '';
              section.appendChild(ol);
            });
    </script>
  </body>
</html>