Home | History | Annotate | Download | only in userscript-runat 
      1 // ==UserScript==
      2 // @name           Userscript @run-at example.
      3 // @version        1.0.1
      4 // @namespace      runat
      5 // @description    This script demonstrates @runat by listing which resources
      6 //                 the current page has loaded.
      7 // @include        *
      8 // @run-at         document-start
      9 // ==/UserScript==
     10 
     11 /*
     12  * Copyright (c) 2011 The Chromium Authors. All rights reserved.
     13  * Use of this source code is governed by a BSD-style license that can be
     14  * found in the LICENSE file.
     15  */
     16 
     17 var urls = {};
     18 var count = 0;
     19 
     20 /**
     21  * Called whenever the page loads a subresource.
     22  * Logs all loaded URLs in the urls var.
     23  */
     24 document.addEventListener('beforeload', function(evt) {
     25   if (!urls[evt.url]) {
     26     urls[evt.url] = 0;
     27     count++;
     28   }
     29   urls[evt.url]++;
     30 }, true);
     31 
     32 /**
     33  * Called when the window is finished loading.
     34  * Loops through the urls var and prints its contents to the page DOM.
     35  */
     36 window.addEventListener('load', function() {
     37   if (count == 0) {
     38     return;
     39   }
     40 
     41   // Create and style inserted DOM elements.
     42   var urls_dom = document.createElement('ul');
     43   urls_dom.style.cssText = [
     44       'margin: 4px 0 !important;',
     45       'padding: 0 !important;',
     46       'width: 98%;',
     47       'word-wrap: break-word;',
     48       'max-height: 200px;',
     49       'overflow: auto;'
     50   ].join(' ');
     51   var wrap_dom = document.createElement('div');
     52   wrap_dom.style.cssText = [
     53       'background-color: #ff7357;',
     54       'background-image: -webkit-repeating-linear-gradient(' +
     55           '-45deg, transparent, transparent 35px,' +
     56           'rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 70px);',
     57       'color: #000;',
     58       'padding: 10px;',
     59       'font: 14px Arial;'
     60   ].join(' ');
     61   var title_dom = document.createElement('strong');
     62   title_dom.textContent = (count > 1) ?
     63       'This page has loaded the following resources:' :
     64       'This page loaded the following resource:';
     65   wrap_dom.appendChild(title_dom);
     66   wrap_dom.appendChild(urls_dom);
     67 
     68   // Render each url as a list item containing a link.
     69   for (var url in urls) {
     70     var url_dom = document.createElement('li');
     71     var link_dom = document.createElement('a');
     72     var times_dom = document.createElement('span');
     73     url_dom.style.cssText = [
     74         'list-style-type: disc;',
     75         'margin: 0 0 0 30px !important;',
     76         'padding: 2px !important'
     77     ].join(' ');
     78     link_dom.setAttribute('href', url);
     79     link_dom.setAttribute('target', '_blank');
     80     link_dom.textContent = url;
     81     link_dom.style.cssText = [
     82         'color: #000 !important;'
     83     ].join(' ');
     84     times_dom.textContent = (urls[url] > 1) ?
     85         ' (' + urls[url] + ' times)' :
     86         ' (once)';
     87     url_dom.appendChild(link_dom);
     88     url_dom.appendChild(times_dom);
     89     urls_dom.appendChild(url_dom);
     90   }
     91 
     92   // Insert the created DOM into the page.
     93   document.body.style.position = 'relative';
     94   document.body.parentElement.insertBefore(wrap_dom, document.body);
     95 }, true);
     96