mediawiki-extensions-Visual.../demos/trigger/index.html
Timo Tijhof 3e9b227a6a Clean up HTML files, Gruntfile and remove index-phantomjs-tmp hack
Consistently:
* Use <!DOCTYPE html>.
* Use lowercase element tags.
* Indent <head> from <html>.
* Use <meta charset="utf-8">.
* Indent <script> and <style> content from open/close tag.
* Put <link> before <script> when in <head> (in ve/test).
* Use .html instead of .php for indexes where PHP is no
  longer used.
* Use the same license header as we use elsewhere (/*! instead
  of /** and no @file)

Gruntfile:
* Include the new .js files in jshint (demos/**/*.js).
* Order buildloader keys in the same order as the directories
  they go to (alphabetically).
* Add missing jshint patterns:
  - .docs/**/*.js
  - build/**/*.js
  - modules/ve-wmf/**/*.js
* Add missing qunit test:
  - qunit.unicodejs
* Add missing watch patterns:
  - .jscs.json
  - qunit.unicodejs

Also:
* Moved relatively large pieces of script into separate files
  so that they are less repeated (though .template) and also
  able to be linted properly.
* Fixed jshint warnings in newly-created trigger.js and demo.js.
* Moved <script> elements already in <body> to bottom of <body>
  (in ve/test and eg-iframe).
* Moved <script> in eg-iframe from <head> to <body>.
* Fixed buildloader grunt task to use a non-\n whitespace match.
  for the start as well, the newline before the placeholder was
  being stripped.
* Removed the (now obsolete) index-phantomjs-tmp hack.

Change-Id: I7c5a371b82f69f367a8e1c11673d2f37868bc931
2013-12-18 07:00:23 +00:00

113 lines
2.6 KiB
HTML

<!--
/*!
* VisualEditor trigger demo
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>VisualEditor Trigger Demo</title>
<style>
body {
font-size: 1em;
font-family: sans-serif;
cursor: default;
}
ul {
margin: 0;
padding: 0;
list-style: none;
}
.flow li {
display: inline-block;
}
.stack li {
display: inline-block;
white-space: nowrap;
padding: 0.75em;
margin: 0.125em;
border: solid 1px #ccc;
background-color: #eee;
border-radius: 0.5em;
}
.key {
display: inline-block;
cursor: pointer;
color: #fff;
background-color: #555;
margin: 0.125em;
padding: 0.75em;
border-radius: 0.25em;
border: outset 2px #555;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
.alias {
color: #bbb;
}
.active {
border: inset 2px #444;
background-color: #333;
text-shadow: 0 0 0.5em #fff
}
table {
width: 100%;
}
td {
padding: 3em;
vertical-align: top;
}
h1 {
padding: 1.5em;
padding-bottom: 0;
margin: 0;
}
h2 {
font-weight: normal;
}
.title {
color: #777;
}
</style>
</head>
<body>
<h1><span class="title">Key sequence: </span><span id="trigger"></span></h1>
<table>
<tr>
<td>
<h2 class="title">Modifiers</h2>
<ul id="modifiers" class="flow"></ul>
</td>
<td>
<h2 class="title">Primary</h2>
<ul id="primary" class="flow"></ul>
</td>
</tr>
<tr>
<td colspan="2">
<h2 class="title">Aliases</h2>
<ul id="aliases" class="stack"></ul>
</td>
</tr>
</table>
<script src="../../modules/jquery/jquery.js"></script>
<script src="../../modules/oojs/oojs.js"></script>
<script src="../../modules/unicodejs/unicodejs.js"></script>
<script src="../../modules/unicodejs/unicodejs.graphemebreak.js"></script>
<script src="../../modules/unicodejs/unicodejs.graphemebreakproperties.js"></script>
<script src="../../modules/unicodejs/unicodejs.textstring.js"></script>
<script src="../../modules/unicodejs/unicodejs.wordbreak.js"></script>
<script src="../../modules/unicodejs/unicodejs.wordbreakproperties.js"></script>
<script src="../../modules/ve/ve.js"></script>
<script src="../../modules/ve/ui/ve.ui.js"></script>
<script src="../../modules/ve/ui/ve.ui.Trigger.js"></script>
<script src="trigger.js"></script>
</body>
</html>