tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

scriptmodified.html (3273B)

      1 <!doctype html>
      2 <html>
      3  <head>
      4    <title>Modifier keys selecting dropEffect with script overriding it</title>
      5    <style type="text/css">
      6 div:first-child {
      7  height: 100px;
      8  width: 100px;
      9  background: orange;
     10  display: inline-block;
     11 }
     12 div:first-child + div {
     13  height: 100px;
     14  width: 100px;
     15  background: blue;
     16  display: inline-block;
     17 }
     18 div:first-child + div + div {
     19  height: 100px;
     20  width: 100px;
     21  background: fuchsia;
     22  display: inline-block;
     23 }
     24 table {
     25  display: inline-table;
     26  margin-right: 1em;
     27  border-collapse: collapse;
     28 }
     29 table, th, td {
     30  border: 1px solid black;
     31 }
     32 thead th {
     33  background: silver;
     34  color: black;
     35 }
     36    </style>
     37    <script type="text/javascript">
     38 window.onload = function () {
     39  var dragenterbefore = '', dragenterafter = '', dragoverbefore = '', dragoverafter = '';
     40  var orange = document.getElementsByTagName('div')[0];
     41  orange.ondragstart = function (e) {
     42    e.dataTransfer.setData('text','http://example.com/');
     43    e.dataTransfer.effectAllowed = 'all';
     44  };
     45  var fuchsia = document.getElementsByTagName('div')[2];
     46  fuchsia.ondragenter = function (e) {
     47    e.preventDefault();
     48    if( e.dataTransfer.dropEffect != 'link' ) {
     49      dragenterbefore = e.dataTransfer.dropEffect;
     50    }
     51    try {
     52      e.dataTransfer.dropEffect = 'move';
     53    } catch(e) {}
     54    if( e.dataTransfer.dropEffect != 'move' ) {
     55      dragenterafter = e.dataTransfer.dropEffect;
     56    }
     57  };
     58  fuchsia.ondragover = function (e) {
     59    e.preventDefault();
     60    if( e.dataTransfer.dropEffect != 'link' ) {
     61      dragoverbefore = e.dataTransfer.dropEffect;
     62    }
     63    try {
     64      e.dataTransfer.dropEffect = 'move';
     65    } catch(e) {}
     66    if( e.dataTransfer.dropEffect != 'move' ) {
     67      dragoverafter = e.dataTransfer.dropEffect;
     68    }
     69  };
     70  fuchsia.ondrop = function (e) {
     71    e.preventDefault();
     72    document.getElementsByTagName('div')[3].innerHTML = ( dragenterbefore || dragenterafter || dragoverbefore || dragoverafter || e.dataTransfer.dropEffect != 'move' ) ? ( 'FAIL' +
     73      ( dragenterbefore ? ( '<br>dragenter.dropEffect was '+dragenterbefore+' instead of link' ) : '' ) +
     74      ( dragenterafter ? ( '<br>dragenter.dropEffect after writing was '+dragenterafter+' instead of move' ) : '' ) +
     75      ( dragoverbefore ? ( '<br>dragover.dropEffect was '+dragoverbefore+' instead of link' ) : '' ) +
     76      ( dragoverafter ? ( '<br>dragover.dropEffect after writing was '+dragoverafter+' instead of move' ) : '' ) +
     77      ( ( e.dataTransfer.dropEffect != 'move' ) ? ( '<br>drop.dropEffect was '+e.dataTransfer.dropEffect+' instead of move' ) : '' )
     78      ) : 'PASS';
     79  };
     80 };
     81    </script>
     82  </head>
     83  <body>
     84 
     85    <div draggable="true"></div>
     86    <div></div>
     87    <div></div>
     88    <div>&nbsp;</div>
     89    <ol>
     90      <li>Drag the orange square over the blue square</li>
     91      <li>Press the relevant modifier keys for your platform to request a &quot;link&quot; drop effect (eg. Alt on Windows, Ctrl+Shift on Unix/Linux, Command+Option on Mac)</li>
     92      <li>Continue dragging over the pink square</li>
     93      <li>If supported by the platform, the mouse cursor should show that a &quot;move&quot; drop effect will be used</li>
     94      <li>Release the drag, then the keys</li>
     95      <li>Fail if no new text appears above this list</li>
     96    </ol>
     97 
     98  </body>
     99 </html>