mediawiki-extensions-Visual.../demos/ve/index.php
Trevor Parscal 6b5310c562 ve.ui.ViewRegistry annihilation
Objectives:
* Associate models with tools, rather than dialogs and inspectors
* Move tool/model association utilities to ve.ui.ToolFactory
* Obliterate the view registry

Notes:

The only special case for leaving modelClasses definitions in place is
for the linkInspector. It uses these for selection expansion.
Because tools can now override the static canEditModel method, we can
dynamically evaluate a model, rather than be restricted to only
comparing classes. This will be useful for disabling editors for models
that are for some reason incomplete or otherwise broken and cannot be
safely edited.

Change-Id: I7adf254990112d90f1f808593a9111afc7a116b5
2013-06-26 16:52:10 -07:00

519 lines
26 KiB
PHP

<?php
/**
* VisualEditor standalone demo
*
* @file
* @ingroup Extensions
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
$path = __DIR__ . '/pages';
$pages = glob( $path . '/*.html' );
$page = current( $pages );
if ( isset( $_GET['page'] ) && in_array( $path . '/' . $_GET['page'] . '.html', $pages ) ) {
$page = $path . '/' . $_GET['page'] . '.html';
}
$html = file_get_contents( $page );
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>VisualEditor Standalone Demo</title>
<!-- Generated by maintenance/makeStaticLoader.php -->
<!-- ext.visualEditor.base#standalone-init -->
<link rel=stylesheet href="../../modules/ve/init/sa/styles/ve.init.sa.css">
<script>
if (
document.createElementNS &&
document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' ).createSVGRect
) {
document.write(
'<link rel="stylesheet" ' +
'href="../../modules/ve/ui/styles/ve.ui.Icons-vector.css">'
);
} else {
document.write(
'<link rel="stylesheet" ' +
'href="../../modules/ve/ui/styles/ve.ui.Icons-raster.css">'
);
}
</script>
<!-- ext.visualEditor.core -->
<link rel=stylesheet href="../../modules/ve/ce/styles/ve.ce.Node.css">
<link rel=stylesheet href="../../modules/ve/ce/styles/ve.ce.Surface.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Surface.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Context.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Frame.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Window.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Dialog.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Inspector.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Toolbar.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Tool.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Element.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Layout.css">
<link rel=stylesheet href="../../modules/ve/ui/styles/ve.ui.Widget.css">
<!-- demo -->
<link rel="stylesheet" href="demo.css">
</head>
<body>
<ul class="ve-demo-docs">
<?php
foreach ( $pages as $page ): ?>
<li>
<a href="./?page=<?php echo basename( $page, '.html' ); ?>">
<?php echo basename( $page, '.html' ); ?>
</a>
</li>
<?php
endforeach; ?>
</ul>
<div class="ve-demo-editor"></div>
<!-- Generated by maintenance/makeStaticLoader.php -->
<!-- Dependencies -->
<script src="../../modules/jquery/jquery.js"></script>
<script src="../../modules/jquery/jquery.client.js"></script>
<script src="../../modules/oojs/oo.js"></script>
<script src="../../modules/rangy/rangy-core-1.3.js"></script>
<script src="../../modules/rangy/rangy-position-1.3.js"></script>
<script src="../../modules/unicodejs/unicodejs.js"></script>
<script src="../../modules/unicodejs/unicodejs.textstring.js"></script>
<script src="../../modules/unicodejs/unicodejs.graphemebreakproperties.js"></script>
<script src="../../modules/unicodejs/unicodejs.graphemebreak.js"></script>
<script src="../../modules/unicodejs/unicodejs.wordbreakproperties.js"></script>
<script src="../../modules/unicodejs/unicodejs.wordbreak.js"></script>
<!-- ext.visualEditor.base#standalone-init -->
<script src="../../modules/ve/ve.js"></script>
<script src="../../modules/ve/ve.EventEmitter.js"></script>
<script src="../../modules/ve/init/ve.init.js"></script>
<script src="../../modules/ve/init/ve.init.Platform.js"></script>
<script src="../../modules/ve/init/ve.init.Target.js"></script>
<script src="../../modules/ve/init/sa/ve.init.sa.js"></script>
<script src="../../modules/ve/init/sa/ve.init.sa.Platform.js"></script>
<script src="../../modules/ve/init/sa/ve.init.sa.Target.js"></script>
<script src="../../modules/ve/ve.debug.js"></script>
<script>
<?php
require '../../modules/../VisualEditor.i18n.php';
echo 've.init.platform.addMessages( ' . json_encode( $messages['en'] ) . " );\n";
?>
ve.init.platform.setModulesUrl( '../../modules' );
</script>
<!-- ext.visualEditor.core -->
<script src="../../modules/ve/ve.Registry.js"></script>
<script src="../../modules/ve/ve.Factory.js"></script>
<script src="../../modules/ve/ve.Range.js"></script>
<script src="../../modules/ve/ve.Node.js"></script>
<script src="../../modules/ve/ve.NamedClassFactory.js"></script>
<script src="../../modules/ve/ve.BranchNode.js"></script>
<script src="../../modules/ve/ve.LeafNode.js"></script>
<script src="../../modules/ve/ve.Element.js"></script>
<script src="../../modules/ve/ve.Document.js"></script>
<script src="../../modules/ve/dm/ve.dm.js"></script>
<script src="../../modules/ve/dm/ve.dm.Model.js"></script>
<script src="../../modules/ve/dm/ve.dm.ModelRegistry.js"></script>
<script src="../../modules/ve/dm/ve.dm.NodeFactory.js"></script>
<script src="../../modules/ve/dm/ve.dm.AnnotationFactory.js"></script>
<script src="../../modules/ve/dm/ve.dm.AnnotationSet.js"></script>
<script src="../../modules/ve/dm/ve.dm.MetaItemFactory.js"></script>
<script src="../../modules/ve/dm/ve.dm.Node.js"></script>
<script src="../../modules/ve/dm/ve.dm.BranchNode.js"></script>
<script src="../../modules/ve/dm/ve.dm.LeafNode.js"></script>
<script src="../../modules/ve/dm/ve.dm.Annotation.js"></script>
<script src="../../modules/ve/dm/ve.dm.InternalList.js"></script>
<script src="../../modules/ve/dm/ve.dm.MetaItem.js"></script>
<script src="../../modules/ve/dm/ve.dm.MetaList.js"></script>
<script src="../../modules/ve/dm/ve.dm.TransactionProcessor.js"></script>
<script src="../../modules/ve/dm/ve.dm.Transaction.js"></script>
<script src="../../modules/ve/dm/ve.dm.Surface.js"></script>
<script src="../../modules/ve/dm/ve.dm.SurfaceFragment.js"></script>
<script src="../../modules/ve/dm/ve.dm.DataString.js"></script>
<script src="../../modules/ve/dm/ve.dm.Document.js"></script>
<script src="../../modules/ve/dm/ve.dm.LinearData.js"></script>
<script src="../../modules/ve/dm/ve.dm.DocumentSlice.js"></script>
<script src="../../modules/ve/dm/ve.dm.DocumentSynchronizer.js"></script>
<script src="../../modules/ve/dm/ve.dm.IndexValueStore.js"></script>
<script src="../../modules/ve/dm/ve.dm.Converter.js"></script>
<script src="../../modules/ve/dm/lineardata/ve.dm.ElementLinearData.js"></script>
<script src="../../modules/ve/dm/lineardata/ve.dm.MetaLinearData.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.GeneratedContentNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.AlienNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.BreakNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.CenterNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.DefinitionListItemNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.DefinitionListNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.DivNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.DocumentNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.HeadingNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.ImageNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.InternalItemNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.InternalListNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.ListItemNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.ListNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.ParagraphNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.PreformattedNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TableCaptionNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TableCellNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TableNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TableRowNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TableSectionNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.TextNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWEntityNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWHeadingNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWPreformattedNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWInlineImageNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWBlockImageNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWImageCaptionNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWTransclusionNode.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.LinkAnnotation.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.MWExternalLinkAnnotation.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.MWInternalLinkAnnotation.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.TextStyleAnnotation.js"></script>
<script src="../../modules/ve/dm/metaitems/ve.dm.AlienMetaItem.js"></script>
<script src="../../modules/ve/dm/metaitems/ve.dm.MWAlienMetaItem.js"></script>
<script src="../../modules/ve/dm/metaitems/ve.dm.MWCategoryMetaItem.js"></script>
<script src="../../modules/ve/dm/metaitems/ve.dm.MWDefaultSortMetaItem.js"></script>
<script src="../../modules/ve/dm/metaitems/ve.dm.MWLanguageMetaItem.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTransclusionModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTransclusionPartModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTransclusionContentModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTemplateSpecModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTemplateModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTemplatePlaceholderModel.js"></script>
<script src="../../modules/ve/dm/models/ve.dm.MWTemplateParameterModel.js"></script>
<script src="../../modules/ve/ce/ve.ce.js"></script>
<script src="../../modules/ve/ce/ve.ce.DomRange.js"></script>
<script src="../../modules/ve/ce/ve.ce.AnnotationFactory.js"></script>
<script src="../../modules/ve/ce/ve.ce.NodeFactory.js"></script>
<script src="../../modules/ve/ce/ve.ce.Document.js"></script>
<script src="../../modules/ve/ce/ve.ce.View.js"></script>
<script src="../../modules/ve/ce/ve.ce.Annotation.js"></script>
<script src="../../modules/ve/ce/ve.ce.Node.js"></script>
<script src="../../modules/ve/ce/ve.ce.BranchNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.ContentBranchNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.LeafNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.ProtectedNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.FocusableNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.RelocatableNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.ResizableNode.js"></script>
<script src="../../modules/ve/ce/ve.ce.Surface.js"></script>
<script src="../../modules/ve/ce/ve.ce.SurfaceObserver.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.GeneratedContentNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.AlienNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.BreakNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.CenterNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.DefinitionListItemNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.DefinitionListNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.DivNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.DocumentNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.HeadingNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.ImageNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.InternalItemNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.InternalListNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.ListItemNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.ListNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.ParagraphNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.PreformattedNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TableCaptionNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TableCellNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TableNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TableRowNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TableSectionNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.TextNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWEntityNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWHeadingNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWPreformattedNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWInlineImageNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWBlockImageNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWImageCaptionNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWTransclusionNode.js"></script>
<script src="../../modules/ve/ce/annotations/ve.ce.LinkAnnotation.js"></script>
<script src="../../modules/ve/ce/annotations/ve.ce.MWExternalLinkAnnotation.js"></script>
<script src="../../modules/ve/ce/annotations/ve.ce.MWInternalLinkAnnotation.js"></script>
<script src="../../modules/ve/ce/annotations/ve.ce.TextStyleAnnotation.js"></script>
<script src="../../modules/ve/ui/ve.ui.js"></script>
<script src="../../modules/ve/ui/ve.ui.Surface.js"></script>
<script src="../../modules/ve/ui/ve.ui.Context.js"></script>
<script src="../../modules/ve/ui/ve.ui.Frame.js"></script>
<script src="../../modules/ve/ui/ve.ui.Window.js"></script>
<script src="../../modules/ve/ui/ve.ui.WindowSet.js"></script>
<script src="../../modules/ve/ui/ve.ui.Inspector.js"></script>
<script src="../../modules/ve/ui/ve.ui.InspectorFactory.js"></script>
<script src="../../modules/ve/ui/ve.ui.Dialog.js"></script>
<script src="../../modules/ve/ui/ve.ui.DialogFactory.js"></script>
<script src="../../modules/ve/ui/ve.ui.Layout.js"></script>
<script src="../../modules/ve/ui/ve.ui.Widget.js"></script>
<script src="../../modules/ve/ui/ve.ui.Tool.js"></script>
<script src="../../modules/ve/ui/ve.ui.ToolFactory.js"></script>
<script src="../../modules/ve/ui/ve.ui.Toolbar.js"></script>
<script src="../../modules/ve/ui/ve.ui.CommandRegistry.js"></script>
<script src="../../modules/ve/ui/ve.ui.Trigger.js"></script>
<script src="../../modules/ve/ui/ve.ui.TriggerRegistry.js"></script>
<script src="../../modules/ve/ui/ve.ui.Action.js"></script>
<script src="../../modules/ve/ui/ve.ui.ActionFactory.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.AnnotationAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.ContentAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.FormatAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.HistoryAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.IndentationAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.InspectorAction.js"></script>
<script src="../../modules/ve/ui/actions/ve.ui.ListAction.js"></script>
<script src="../../modules/ve/ui/elements/ve.ui.LabeledElement.js"></script>
<script src="../../modules/ve/ui/elements/ve.ui.GroupElement.js"></script>
<script src="../../modules/ve/ui/elements/ve.ui.FlaggableElement.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.PopupWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.SelectWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.OptionWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.ButtonWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.IconButtonWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.InputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.InputLabelWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.TextInputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.OutlineItemWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.OutlineWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MenuItemWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MenuSectionItemWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MenuWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.LookupInputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.TextInputMenuWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.LinkTargetInputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWLinkTargetInputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWCategoryInputWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWCategoryPopupWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWCategoryItemWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWCategoryWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWMediaSelectWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWMediaSelectItemWidget.js"></script>
<script src="../../modules/ve/ui/widgets/ve.ui.MWTitleInputWidget.js"></script>
<script src="../../modules/ve/ui/layouts/ve.ui.FieldsetLayout.js"></script>
<script src="../../modules/ve/ui/layouts/ve.ui.GridLayout.js"></script>
<script src="../../modules/ve/ui/layouts/ve.ui.PanelLayout.js"></script>
<script src="../../modules/ve/ui/layouts/ve.ui.StackPanelLayout.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.PagedDialog.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.MWMetaDialog.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.MWMediaInsertDialog.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.MWMediaEditDialog.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.ButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.AnnotationButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.DialogButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.InspectorButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.IndentationButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.ListButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/ve.ui.DropdownTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.BoldButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.ItalicButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.ClearButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.LinkButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.MWLinkButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.MWMediaInsertButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.MWMediaEditButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.BulletButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.NumberButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.IndentButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.OutdentButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.RedoButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.UndoButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.MWTransclusionButtonTool.js"></script>
<script src="../../modules/ve/ui/tools/dropdowns/ve.ui.FormatDropdownTool.js"></script>
<script src="../../modules/ve/ui/tools/dropdowns/ve.ui.MWFormatDropdownTool.js"></script>
<script src="../../modules/ve/ui/inspectors/ve.ui.LinkInspector.js"></script>
<script src="../../modules/ve/ui/inspectors/ve.ui.MWLinkInspector.js"></script>
<!-- ext.visualEditor.experimental -->
<script src="../../modules/ve/dm/nodes/ve.dm.MWReferenceListNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWReferenceNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWReferenceListNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWReferenceNode.js"></script>
<script src="../../modules/ve/ui/tools/buttons/ve.ui.MWReferenceButtonTool.js"></script>
<script src="../../modules/ve/ui/dialogs/ve.ui.MWReferenceDialog.js"></script>
<!-- demo -->
<script>
$( document ).ready( function () {
new ve.init.sa.Target(
$( '.ve-demo-editor' ),
ve.createDocumentFromHtml( <?php echo json_encode( $html ) ?> )
);
$( '.ve-ce-documentNode' ).focus();
// ve.instances[0].getDialogs().open( 'mwMeta' );
} );
</script>
<div class="ve-demo-utilities">
<p>
<div class="ve-demo-utilities-commands"></div>
</p>
<table id="ve-dump" class="ve-demo-dump">
<thead>
<th>Linear model</th>
<th>View tree</th>
<th>Model tree</th>
</thead>
<tbody>
<tr>
<td width="30%" id="ve-linear-model-dump"></td>
<td id="ve-view-tree-dump" style="vertical-align: top;"></td>
<td id="ve-model-tree-dump" style="vertical-align: top;"></td>
</tr>
</tbody>
</table>
</div>
<script>
$( function () {
// Widgets
var startTextInput = new ve.ui.TextInputWidget( { 'readOnly': true } ),
endTextInput = new ve.ui.TextInputWidget( { 'readOnly': true } ),
startTextInputLabel = new ve.ui.InputLabelWidget(
{ 'label': 'Start', 'input': startTextInput }
),
endTextInputLabel = new ve.ui.InputLabelWidget(
{ 'label': 'End', 'input': endTextInput }
),
getRangeButton = new ve.ui.ButtonWidget( { 'label': 'Get selected range' } ),
logRangeButton = new ve.ui.ButtonWidget(
{ 'label': 'Log to console', 'disabled': true }
),
dumpModelButton = new ve.ui.ButtonWidget( { 'label': 'Dump model' } ),
validateButton = new ve.ui.ButtonWidget( { 'label': 'Validate view and model' } );
// Initialization
$( '.ve-demo-utilities-commands' ).append(
getRangeButton.$,
startTextInputLabel.$,
startTextInput.$,
endTextInputLabel.$,
endTextInput.$,
logRangeButton.$,
$( '<span class="ve-demo-utilities-commands-divider">&nbsp;</span>' ),
dumpModelButton.$,
validateButton.$
);
// Events
getRangeButton.on( 'click', function () {
var range = ve.instances[0].view.model.getSelection();
startTextInput.setValue( range.start );
endTextInput.setValue( range.end );
logRangeButton.setDisabled( false );
} );
logRangeButton.on( 'click', function () {
var start = startTextInput.getValue(),
end = endTextInput.getValue();
// TODO: Validate input
console.dir( ve.instances[0].view.documentView.model.data.slice( start, end ) );
} );
dumpModelButton.on( 'click', function () {
// linear model dump
var i, $li, element, html, annotations,
$ol = $( '<ol start="0"></ol>' );
for ( i = 0; i < ve.instances[0].model.documentModel.data.getLength(); i++ ) {
$li = $( '<li>' );
$label = $( '<span>' );
element = ve.instances[0].model.documentModel.data.getData( i );
if ( element.type ) {
$label.addClass( 've-demo-dump-element' );
text = element.type;
annotations = element.annotations;
} else if ( ve.isArray( element ) ){
$label.addClass( 've-demo-dump-achar' );
text = element[0];
annotations = element[1];
} else {
$label.addClass( 've-demo-dump-char' );
text = element;
annotations = undefined;
}
$label.html( ( text.match( /\S/ ) ? text : '&nbsp;' ) + ' ' );
if ( annotations ) {
$label.append(
$( '<span>' ).text(
'[' + ve.instances[0].model.documentModel.store.values( annotations ).map( function( ann ) {
return ann.name;
} ).join( ', ' ) + ']'
)
);
}
$li.append( $label );
$ol.append( $li );
}
$( '#ve-linear-model-dump' ).html( $ol );
// tree dump
var getKids = function ( obj ) {
var $ol = $( '<ol start="0"></ol>' ),
$li;
for ( var i = 0; i < obj.children.length; i++ ) {
$li = $( '<li>' );
$label = $( '<span>' ).addClass( 've-demo-dump-element' );
if ( obj.children[i].length !== undefined ) {
$li.append(
$label
.text( obj.children[i].type )
.append(
$( '<span>' ).text( ' (' + obj.children[i].length + ')' )
)
);
} else {
$li.append( $label.text( obj.children[i].type ) );
}
if ( obj.children[i].children ) {
$li.append( getKids( obj.children[i] ) );
}
$ol.append( $li );
}
return $ol;
}
$( '#ve-model-tree-dump' ).html(
getKids( ve.instances[0].model.documentModel.documentNode )
);
$( '#ve-view-tree-dump' ).html(
getKids( ve.instances[0].view.documentView.documentNode )
);
$( '#ve-dump' ).show();
} );
validateButton.on( 'click', function () {
var failed = false;
$( '.ve-ce-branchNode' ).each( function ( index, element ) {
var $element = $( element ),
view = $element.data( 'view' );
if ( view.canContainContent() ) {
var nodeRange = view.model.getRange();
var textModel = ve.instances[0]
.view.model.getDocument().getText( nodeRange );
var textDom = ve.ce.getDomText( view.$[0] );
if ( textModel !== textDom ) {
failed = true;
console.log( 'Inconsistent data', {
'textModel': textModel,
'textDom': textDom,
'element': element
} );
}
}
} );
if ( failed ) {
alert( 'Not valid - check JS console for details' );
} else {
alert( 'Valid' );
}
} );
} );
</script>
</body>
</html>