ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Adding mapbox-gl branch

Browse Source
This commit is contained in:
Andreas Hocevar
2015-03-16 18:50:27 +01:00
parent 7985f030fa
commit 57ee7f52fd
3109 changed files with 943365 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mapbox-gl/closure-library/closure/goog/demos/editor/deps.js
+21
View File
@@ -0,0 +1,21 @@
// Copyright 2009 The Closure Library Authors.
// All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS-IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
//
// This file has been auto-generated by GenJsDeps, please do not edit.
goog.addDependency('demos/editor/equationeditor.js', ['goog.demos.editor.EquationEditor'], ['goog.ui.equation.EquationEditorDialog']);
goog.addDependency('demos/editor/helloworld.js', ['goog.demos.editor.HelloWorld'], ['goog.dom', 'goog.dom.TagName', 'goog.editor.Plugin']);
goog.addDependency('demos/editor/helloworlddialog.js', ['goog.demos.editor.HelloWorldDialog', 'goog.demos.editor.HelloWorldDialog.OkEvent'], ['goog.dom.TagName', 'goog.events.Event', 'goog.string', 'goog.ui.editor.AbstractDialog', 'goog.ui.editor.AbstractDialog.Builder', 'goog.ui.editor.AbstractDialog.EventType']);
goog.addDependency('demos/editor/helloworlddialogplugin.js', ['goog.demos.editor.HelloWorldDialogPlugin', 'goog.demos.editor.HelloWorldDialogPlugin.Command'], ['goog.demos.editor.HelloWorldDialog', 'goog.dom.TagName', 'goog.editor.plugins.AbstractDialogPlugin', 'goog.editor.range', 'goog.functions', 'goog.ui.editor.AbstractDialog.EventType']);
mapbox-gl/closure-library/closure/goog/demos/editor/editor.html
+139
View File
@@ -0,0 +1,139 @@
<html>
<!--
Copyright 2009 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<!--
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>goog.editor Demo</title>
<script src="../../base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.editor.Command');
goog.require('goog.editor.Field');
goog.require('goog.editor.plugins.BasicTextFormatter');
goog.require('goog.editor.plugins.EnterHandler');
goog.require('goog.editor.plugins.HeaderFormatter');
goog.require('goog.editor.plugins.LinkBubble');
goog.require('goog.editor.plugins.LinkDialogPlugin');
goog.require('goog.editor.plugins.ListTabHandler');
goog.require('goog.editor.plugins.LoremIpsum');
goog.require('goog.editor.plugins.RemoveFormatting');
goog.require('goog.editor.plugins.SpacesTabHandler');
goog.require('goog.editor.plugins.UndoRedo');
goog.require('goog.ui.editor.DefaultToolbar');
goog.require('goog.ui.editor.ToolbarController');
</script>
<link rel="stylesheet" href="../css/demo.css">
<link rel="stylesheet" href="../../css/button.css" />
<link rel="stylesheet" href="../../css/dialog.css" />
<link rel="stylesheet" href="../../css/linkbutton.css" />
<link rel="stylesheet" href="../../css/menu.css">
<link rel="stylesheet" href="../../css/menuitem.css">
<link rel="stylesheet" href="../../css/menuseparator.css">
<link rel="stylesheet" href="../../css/tab.css" />
<link rel="stylesheet" href="../../css/tabbar.css" />
<link rel="stylesheet" href="../../css/toolbar.css" />
<link rel="stylesheet" href="../../css/colormenubutton.css" />
<link rel="stylesheet" href="../../css/palette.css" />
<link rel="stylesheet" href="../../css/colorpalette.css" />
<link rel="stylesheet" href="../../css/editor/bubble.css" />
<link rel="stylesheet" href="../../css/editor/dialog.css" />
<link rel="stylesheet" href="../../css/editor/linkdialog.css" />
<link rel="stylesheet" href="../../css/editortoolbar.css" />
<style>
#editMe {
width: 600px;
height: 300px;
background-color: white;
border: 1px solid grey;
}
</style>
</head>
<body>
<h1>goog.editor Demo</h1>
<p>This is a demonstration of a editable field, with installed plugins,
hooked up to a toolbar.</p>
<br>
<div id='toolbar' style='width:602px'></div>
<div id='editMe'></div>
<hr>
<p><b>Current field contents</b>
(updates as contents of the editable field above change):<br>
<textarea id="fieldContents" style="height:100px;width:400px;"></textarea><br>
<input type="button" value="Set Field Contents"
onclick="myField.setHtml(false, goog.dom.getElement('fieldContents').value);" />
(Use to set contents of the editable field to the contents of this textarea)
</p>
<script>
function updateFieldContents() {
goog.dom.getElement('fieldContents').value = myField.getCleanContents();
}
// Create an editable field.
var myField = new goog.editor.Field('editMe');
// Create and register all of the editing plugins you want to use.
myField.registerPlugin(new goog.editor.plugins.BasicTextFormatter());
myField.registerPlugin(new goog.editor.plugins.RemoveFormatting());
myField.registerPlugin(new goog.editor.plugins.UndoRedo());
myField.registerPlugin(new goog.editor.plugins.ListTabHandler());
myField.registerPlugin(new goog.editor.plugins.SpacesTabHandler());
myField.registerPlugin(new goog.editor.plugins.EnterHandler());
myField.registerPlugin(new goog.editor.plugins.HeaderFormatter());
myField.registerPlugin(
new goog.editor.plugins.LoremIpsum('Click here to edit'));
myField.registerPlugin(
new goog.editor.plugins.LinkDialogPlugin());
myField.registerPlugin(new goog.editor.plugins.LinkBubble());
// Specify the buttons to add to the toolbar, using built in default buttons.
var buttons = [
goog.editor.Command.BOLD,
goog.editor.Command.ITALIC,
goog.editor.Command.UNDERLINE,
goog.editor.Command.FONT_COLOR,
goog.editor.Command.BACKGROUND_COLOR,
goog.editor.Command.FONT_FACE,
goog.editor.Command.FONT_SIZE,
goog.editor.Command.LINK,
goog.editor.Command.UNDO,
goog.editor.Command.REDO,
goog.editor.Command.UNORDERED_LIST,
goog.editor.Command.ORDERED_LIST,
goog.editor.Command.INDENT,
goog.editor.Command.OUTDENT,
goog.editor.Command.JUSTIFY_LEFT,
goog.editor.Command.JUSTIFY_CENTER,
goog.editor.Command.JUSTIFY_RIGHT,
goog.editor.Command.SUBSCRIPT,
goog.editor.Command.SUPERSCRIPT,
goog.editor.Command.STRIKE_THROUGH,
goog.editor.Command.REMOVE_FORMAT
];
var myToolbar = goog.ui.editor.DefaultToolbar.makeToolbar(buttons,
goog.dom.getElement('toolbar'));
// Hook the toolbar into the field.
var myToolbarController =
new goog.ui.editor.ToolbarController(myField, myToolbar);
// Watch for field changes, to display below.
goog.events.listen(myField, goog.editor.Field.EventType.DELAYEDCHANGE,
updateFieldContents);
myField.makeEditable();
updateFieldContents();
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/field_basic.html
+74
View File
@@ -0,0 +1,74 @@
<!DOCTYPE html>
<html>
<!--
Copyright 2010 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>goog.editor.Field</title>
<script src="../../base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.editor.Field');
</script>
<link rel="stylesheet" href="../css/demo.css">
<style>
#editMe {
width: 300px;
height: 150px;
background-color: white;
border: 1px solid grey;
}
</style>
</head>
<body>
<h1>goog.editor.Field</h1>
<p>This is a very basic demonstration of how to make a region editable.</p>
<input type="button" value="Make Editable" onclick="makeFieldEditable();" />
<input type="button" value="Make Uneditable"
onclick="makeFieldUneditable();" />
<br><br>
<div id="editMe">I am a regular div. Click "Make Editable" above to transform me into an editable region.</div>
<hr>
<p><b>Current field contents</b>
(updates as contents of the editable field above change):<br>
<textarea id="fieldContents" style="height:100px;width:400px;"></textarea><br>
<input type="button" value="Set Field Contents"
onclick="myField.setHtml(false, goog.dom.getElement('fieldContents').value);" />
(Use to set contents of the editable field to the contents of this textarea)
</p>
<script>
var myField = new goog.editor.Field('editMe');
function makeFieldEditable() {
goog.events.listen(myField, goog.editor.Field.EventType.LOAD,
handleFieldLoad);
goog.events.listen(myField, goog.editor.Field.EventType.DELAYEDCHANGE,
updateFieldContents);
myField.makeEditable();
updateFieldContents();
}
function makeFieldUneditable() {
myField.makeUneditable();
}
function handleFieldLoad() {
// Not necessary, just demoing how to perform an action after the editable
// field is loaded. This focuses the field and gives you a blinking cursor
// at the start.
myField.focusAndPlaceCursorAtStart();
}
function updateFieldContents() {
goog.dom.getElement('fieldContents').value = myField.getCleanContents();
}
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/helloworld.html
+91
View File
@@ -0,0 +1,91 @@
<!DOCTYPE html>
<!--
Copywrite 2009 Google Inc. All Rights Reserved.
-->
<html>
<!--
Copyright 2010 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>goog.editor Hello World plugins Demo</title>
<script src="../../base.js"></script>
<script src="deps.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.editor.Field');
goog.require('goog.editor.Field.EventType');
goog.require('goog.demos.editor.HelloWorld');
goog.require('goog.demos.editor.HelloWorldDialogPlugin');
</script>
<link rel="stylesheet" href="../css/demo.css">
<link rel="stylesheet" href="../../css/dialog.css" />
<style>
#editMe {
width: 600px;
height: 300px;
background-color: white;
border: 1px solid grey;
}
</style>
</head>
<body>
<h1>goog.editor Hello World plugins Demo</h1>
<p>This is a demonstration of an editable field with the two sample plugins
installed: goog.editor.plugins.HelloWorld and
goog.editor.plugins.HelloWorldDialogPlugin.</p>
<br>
<button onclick='doHelloWorld()'>Hello World</button>
<button onclick='doHelloWorldDialog()'>Hello World Dialog</button><br>
<div id='editMe'><ul>
<li>Click <b>Hello World</b> to insert "Hello World!".</li>
<li>Click <b>Hello World Dialog</b> to open a dialog where you can customize
your hello world message to be inserted.</li>
</ul>The hello world message will be inserted at the cursor, or will replace
the selected text.</div>
<hr>
<p><b>Current field contents</b>
(updates as contents of the editable field above change):<br>
<textarea id="fieldContents" style="height:100px;width:400px;"></textarea><br>
<input type="button" value="Set Field Contents"
onclick="myField.setHtml(false, goog.dom.getElement('fieldContents').value);" />
(Use to set contents of the editable field to the contents of this textarea)
</p>
<script>
function doHelloWorld() {
myField.execCommand(goog.demos.editor.HelloWorld.COMMAND.HELLO_WORLD);
}
function doHelloWorldDialog() {
myField.execCommand(
goog.demos.editor.HelloWorldDialogPlugin.Command.HELLO_WORLD_DIALOG);
}
function updateFieldContents() {
goog.dom.getElement('fieldContents').value = myField.getCleanContents();
}
// Create an editable field.
var myField = new goog.editor.Field('editMe');
// Create and register all of the editing plugins you want to use.
myField.registerPlugin(new goog.demos.editor.HelloWorld());
myField.registerPlugin(new goog.demos.editor.HelloWorldDialogPlugin());
// Watch for field changes, to display below.
goog.events.listen(myField, goog.editor.Field.EventType.DELAYEDCHANGE,
updateFieldContents);
myField.makeEditable();
updateFieldContents();
// Workaround for bug where on page load hello world doesn't work because
// the field doesn't have focus yet.
myField.focusAndPlaceCursorAtStart();
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/helloworld.js
+82
View File
@@ -0,0 +1,82 @@
// Copyright 2008 The Closure Library Authors. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS-IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
/**
* @fileoverview A simple plugin that inserts 'Hello World!' on command. This
* plugin is intended to be an example of a very simple plugin for plugin
* developers.
*
* @author gak@google.com (Gregory Kick)
* @see helloworld.html
*/
goog.provide('goog.demos.editor.HelloWorld');
goog.require('goog.dom');
goog.require('goog.dom.TagName');
goog.require('goog.editor.Plugin');
/**
* Plugin to insert 'Hello World!' into an editable field.
* @constructor
* @extends {goog.editor.Plugin}
* @final
*/
goog.demos.editor.HelloWorld = function() {
goog.editor.Plugin.call(this);
};
goog.inherits(goog.demos.editor.HelloWorld, goog.editor.Plugin);
/** @override */
goog.demos.editor.HelloWorld.prototype.getTrogClassId = function() {
return 'HelloWorld';
};
/**
* Commands implemented by this plugin.
* @enum {string}
*/
goog.demos.editor.HelloWorld.COMMAND = {
HELLO_WORLD: '+helloWorld'
};
/** @override */
goog.demos.editor.HelloWorld.prototype.isSupportedCommand = function(
command) {
return command == goog.demos.editor.HelloWorld.COMMAND.HELLO_WORLD;
};
/**
* Executes a command. Does not fire any BEFORECHANGE, CHANGE, or
* SELECTIONCHANGE events (these are handled by the super class implementation
* of {@code execCommand}.
* @param {string} command Command to execute.
* @override
* @protected
*/
goog.demos.editor.HelloWorld.prototype.execCommandInternal = function(
command) {
var domHelper = this.getFieldObject().getEditableDomHelper();
var range = this.getFieldObject().getRange();
range.removeContents();
var newNode =
domHelper.createDom(goog.dom.TagName.SPAN, null, 'Hello World!');
range.insertNode(newNode, false);
};
mapbox-gl/closure-library/closure/goog/demos/editor/helloworld_test.html
+75
View File
@@ -0,0 +1,75 @@
<!DOCTYPE html>
<!--
@author gak@google.com (Gregory Kick)
-->
<html>
<!--
Copyright 2008 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Closure Unit Tests - goog.demos.editor.HelloWorld</title>
<script type="text/javascript" src="../../base.js"></script>
<script type="text/javascript" src="deps.js"></script>
<script type="text/javascript">
goog.require('goog.dom');
goog.require('goog.testing.jsunit');
goog.require('goog.demos.editor.HelloWorld');
goog.require('goog.testing.editor.TestHelper');
goog.require('goog.testing.editor.FieldMock');
</script>
</head>
<body>
<div id="field">&nbsp;</div>
<script type="text/javascript">
var FIELD = goog.dom.getElement('field');
var plugin;
var fieldMock;
var testHelper = new goog.testing.editor.TestHelper(FIELD);
function setUp() {
testHelper.setUpEditableElement();
FIELD.focus();
plugin = new goog.demos.editor.HelloWorld();
fieldMock = new goog.testing.editor.FieldMock();
plugin.registerFieldObject(fieldMock);
}
function tearDown() {
testHelper.tearDownEditableElement();
}
function testIsSupportedCommand() {
fieldMock.$replay();
assertTrue('+helloWorld should be suported',
plugin.isSupportedCommand('+helloWorld'));
assertFalse('other commands should not be supported',
plugin.isSupportedCommand('blah'));
fieldMock.$verify();
}
function testExecCommandInternal() {
fieldMock.$replay();
var result = plugin.execCommandInternal(
goog.demos.editor.HelloWorld.COMMAND.HELLO_WORLD);
assertUndefined(result);
var spans = FIELD.getElementsByTagName('span');
assertEquals(1, spans.length);
var helloWorldSpan = spans.item(0);
assertEquals('Hello World!', goog.dom.getTextContent(helloWorldSpan));
fieldMock.$verify();
}
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/helloworlddialog.js
+173
View File
@@ -0,0 +1,173 @@
// Copyright 2008 The Closure Library Authors. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS-IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
/**
* @fileoverview An example of how to write a dialog to be opened by a plugin.
*
*/
goog.provide('goog.demos.editor.HelloWorldDialog');
goog.provide('goog.demos.editor.HelloWorldDialog.OkEvent');
goog.require('goog.dom.TagName');
goog.require('goog.events.Event');
goog.require('goog.string');
goog.require('goog.ui.editor.AbstractDialog');
// *** Public interface ***************************************************** //
/**
* Creates a dialog to let the user enter a customized hello world message.
* @param {goog.dom.DomHelper} domHelper DomHelper to be used to create the
* dialog's dom structure.
* @constructor
* @extends {goog.ui.editor.AbstractDialog}
* @final
*/
goog.demos.editor.HelloWorldDialog = function(domHelper) {
goog.ui.editor.AbstractDialog.call(this, domHelper);
};
goog.inherits(goog.demos.editor.HelloWorldDialog,
goog.ui.editor.AbstractDialog);
// *** Event **************************************************************** //
/**
* OK event object for the hello world dialog.
* @param {string} message Customized hello world message chosen by the user.
* @constructor
* @extends {goog.events.Event}
* @final
*/
goog.demos.editor.HelloWorldDialog.OkEvent = function(message) {
this.message = message;
};
goog.inherits(goog.demos.editor.HelloWorldDialog.OkEvent, goog.events.Event);
/**
* Event type.
* @type {goog.ui.editor.AbstractDialog.EventType}
* @override
*/
goog.demos.editor.HelloWorldDialog.OkEvent.prototype.type =
goog.ui.editor.AbstractDialog.EventType.OK;
/**
* Customized hello world message chosen by the user.
* @type {string}
*/
goog.demos.editor.HelloWorldDialog.OkEvent.prototype.message;
// *** Protected interface ************************************************** //
/** @override */
goog.demos.editor.HelloWorldDialog.prototype.createDialogControl = function() {
var builder = new goog.ui.editor.AbstractDialog.Builder(this);
/** @desc Title of the hello world dialog. */
var MSG_HELLO_WORLD_DIALOG_TITLE = goog.getMsg('Add a Hello World message');
builder.setTitle(MSG_HELLO_WORLD_DIALOG_TITLE).
setContent(this.createContent_());
return builder.build();
};
/**
* Creates and returns the event object to be used when dispatching the OK
* event to listeners, or returns null to prevent the dialog from closing.
* @param {goog.events.Event} e The event object dispatched by the wrapped
* dialog.
* @return {goog.demos.editor.HelloWorldDialog.OkEvent} The event object to be
* used when dispatching the OK event to listeners.
* @protected
* @override
*/
goog.demos.editor.HelloWorldDialog.prototype.createOkEvent = function(e) {
var message = this.getMessage_();
if (message &&
goog.demos.editor.HelloWorldDialog.isValidHelloWorld_(message)) {
return new goog.demos.editor.HelloWorldDialog.OkEvent(message);
} else {
/** @desc Error message telling the user why their message was rejected. */
var MSG_HELLO_WORLD_DIALOG_ERROR =
goog.getMsg('Your message must contain the words "hello" and "world".');
this.dom.getWindow().alert(MSG_HELLO_WORLD_DIALOG_ERROR);
return null; // Prevents the dialog from closing.
}
};
// *** Private implementation *********************************************** //
/**
* Input element where the user will type their hello world message.
* @type {Element}
* @private
*/
goog.demos.editor.HelloWorldDialog.prototype.input_;
/**
* Creates the DOM structure that makes up the dialog's content area.
* @return {Element} The DOM structure that makes up the dialog's content area.
* @private
*/
goog.demos.editor.HelloWorldDialog.prototype.createContent_ = function() {
/** @desc Sample hello world message to prepopulate the dialog with. */
var MSG_HELLO_WORLD_DIALOG_SAMPLE = goog.getMsg('Hello, world!');
this.input_ = this.dom.createDom(goog.dom.TagName.INPUT,
{size: 25, value: MSG_HELLO_WORLD_DIALOG_SAMPLE});
/** @desc Prompt telling the user to enter a hello world message. */
var MSG_HELLO_WORLD_DIALOG_PROMPT =
goog.getMsg('Enter your Hello World message');
return this.dom.createDom(goog.dom.TagName.DIV,
null,
[MSG_HELLO_WORLD_DIALOG_PROMPT, this.input_]);
};
/**
* Returns the hello world message currently typed into the dialog's input.
* @return {?string} The hello world message currently typed into the dialog's
* input, or null if called before the input is created.
* @private
*/
goog.demos.editor.HelloWorldDialog.prototype.getMessage_ = function() {
return this.input_ && this.input_.value;
};
/**
* Returns whether or not the given message contains the strings "hello" and
* "world". Case-insensitive and order doesn't matter.
* @param {string} message The message to be checked.
* @return {boolean} Whether or not the given message contains the strings
* "hello" and "world".
* @private
*/
goog.demos.editor.HelloWorldDialog.isValidHelloWorld_ = function(message) {
message = message.toLowerCase();
return goog.string.contains(message, 'hello') &&
goog.string.contains(message, 'world');
};
mapbox-gl/closure-library/closure/goog/demos/editor/helloworlddialog_test.html
+100
View File
@@ -0,0 +1,100 @@
<!DOCTYPE html>
<!--
-->
<html>
<!--
Copyright 2008 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Closure Unit Tests - goog.demos.editor.HelloWorldDialog</title>
<script src="../../base.js"></script>
<script src="deps.js"></script>
<script>
goog.require('goog.demos.editor.HelloWorldDialog');
goog.require('goog.demos.editor.HelloWorldDialog.OkEvent');
goog.require('goog.dom.DomHelper');
goog.require('goog.events.EventHandler');
goog.require('goog.testing.LooseMock');
goog.require('goog.testing.events');
goog.require('goog.testing.jsunit');
goog.require('goog.testing.mockmatchers.ArgumentMatcher');
goog.require('goog.ui.editor.AbstractDialog.EventType');
</script>
<link rel="stylesheet" href="../css/dialog.css"/>
</head>
<body>
<script>
var dialog;
var mockOkHandler;
var CUSTOM_MESSAGE = 'Hello, cruel world...';
function setUp() {
mockOkHandler = new goog.testing.LooseMock(goog.events.EventHandler);
}
function tearDown() {
dialog.dispose();
}
/**
* Creates and shows the dialog to be tested.
*/
function createAndShow() {
dialog = new goog.demos.editor.HelloWorldDialog(new goog.dom.DomHelper());
dialog.addEventListener(goog.ui.editor.AbstractDialog.EventType.OK,
mockOkHandler);
dialog.show();
}
/**
* Sets up the mock event handler to expect an OK event with the given
* message.
* @param {string} message Hello world message the OK event is expected to
* carry.
*/
function expectOk(message) {
mockOkHandler.handleEvent(new goog.testing.mockmatchers.ArgumentMatcher(
function(arg) {
return arg.type == goog.ui.editor.AbstractDialog.EventType.OK &&
arg.message == message;
}));
}
/**
* Tests that when you show the dialog, the input field has the correct
* sample text in it.
*/
function testShow() {
mockOkHandler.$replay();
createAndShow();
assertEquals('Input field has incorrect sample text',
'Hello, world!',
dialog.input_.value);
mockOkHandler.$verify();
}
/**
* Tests that clicking OK dispatches an event carying the entered message.
*/
function testOk() {
expectOk(CUSTOM_MESSAGE);
mockOkHandler.$replay();
createAndShow();
dialog.input_.value = CUSTOM_MESSAGE;
goog.testing.events.fireClickSequence(dialog.getOkButtonElement());
mockOkHandler.$verify(); // Verifies OK is dispatched with correct message.
}
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/helloworlddialogplugin.js
+117
View File
@@ -0,0 +1,117 @@
// Copyright 2008 The Closure Library Authors. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS-IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
/**
* @fileoverview An example of how to write a dialog plugin.
*
*/
goog.provide('goog.demos.editor.HelloWorldDialogPlugin');
goog.provide('goog.demos.editor.HelloWorldDialogPlugin.Command');
goog.require('goog.demos.editor.HelloWorldDialog');
goog.require('goog.dom.TagName');
goog.require('goog.editor.plugins.AbstractDialogPlugin');
goog.require('goog.editor.range');
goog.require('goog.functions');
goog.require('goog.ui.editor.AbstractDialog');
// *** Public interface ***************************************************** //
/**
* A plugin that opens the hello world dialog.
* @constructor
* @extends {goog.editor.plugins.AbstractDialogPlugin}
* @final
*/
goog.demos.editor.HelloWorldDialogPlugin = function() {
goog.editor.plugins.AbstractDialogPlugin.call(this,
goog.demos.editor.HelloWorldDialogPlugin.Command.HELLO_WORLD_DIALOG);
};
goog.inherits(goog.demos.editor.HelloWorldDialogPlugin,
goog.editor.plugins.AbstractDialogPlugin);
/**
* Commands implemented by this plugin.
* @enum {string}
*/
goog.demos.editor.HelloWorldDialogPlugin.Command = {
HELLO_WORLD_DIALOG: 'helloWorldDialog'
};
/** @override */
goog.demos.editor.HelloWorldDialogPlugin.prototype.getTrogClassId =
goog.functions.constant('HelloWorldDialog');
// *** Protected interface ************************************************** //
/**
* Creates a new instance of the dialog and registers for the relevant events.
* @param {goog.dom.DomHelper} dialogDomHelper The dom helper to be used to
* create the dialog.
* @return {goog.demos.editor.HelloWorldDialog} The dialog.
* @override
* @protected
*/
goog.demos.editor.HelloWorldDialogPlugin.prototype.createDialog = function(
dialogDomHelper) {
var dialog = new goog.demos.editor.HelloWorldDialog(dialogDomHelper);
dialog.addEventListener(goog.ui.editor.AbstractDialog.EventType.OK,
this.handleOk_,
false,
this);
return dialog;
};
// *** Private implementation *********************************************** //
/**
* Handles the OK event from the dialog by inserting the hello world message
* into the field.
* @param {goog.demos.editor.HelloWorldDialog.OkEvent} e OK event object.
* @private
*/
goog.demos.editor.HelloWorldDialogPlugin.prototype.handleOk_ = function(e) {
// First restore the selection so we can manipulate the field's content
// according to what was selected.
this.restoreOriginalSelection();
// Notify listeners that the field's contents are about to change.
this.getFieldObject().dispatchBeforeChange();
// Now we can clear out what was previously selected (if anything).
var range = this.getFieldObject().getRange();
range.removeContents();
// And replace it with a span containing our hello world message.
var createdNode = this.getFieldDomHelper().createDom(goog.dom.TagName.SPAN,
null,
e.message);
createdNode = range.insertNode(createdNode, false);
// Place the cursor at the end of the new text node (false == to the right).
goog.editor.range.placeCursorNextTo(createdNode, false);
// Notify listeners that the field's selection has changed.
this.getFieldObject().dispatchSelectionChangeEvent();
// Notify listeners that the field's contents have changed.
this.getFieldObject().dispatchChange();
};
mapbox-gl/closure-library/closure/goog/demos/editor/helloworlddialogplugin_test.html
+198
View File
@@ -0,0 +1,198 @@
<!DOCTYPE html>
<!--
-->
<html>
<!--
Copyright 2008 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Closure Unit Tests - goog.demos.editor.HelloWorldDialogPlugin</title>
<script src="../../base.js"></script>
<script src="deps.js"></script>
<script>
goog.require('goog.demos.editor.HelloWorldDialog');
goog.require('goog.demos.editor.HelloWorldDialog.OkEvent');
goog.require('goog.demos.editor.HelloWorldDialogPlugin');
goog.require('goog.demos.editor.HelloWorldDialogPlugin.Command');
goog.require('goog.dom');
goog.require('goog.dom.NodeType');
goog.require('goog.testing.ExpectedFailures');
goog.require('goog.testing.MockControl');
goog.require('goog.testing.MockRange');
goog.require('goog.testing.PropertyReplacer');
goog.require('goog.testing.editor.FieldMock');
goog.require('goog.testing.editor.TestHelper');
goog.require('goog.testing.editor.dom');
goog.require('goog.testing.events');
goog.require('goog.testing.jsunit');
goog.require('goog.testing.mockmatchers.ArgumentMatcher');
goog.require('goog.userAgent');
</script>
<link rel="stylesheet" href="../css/dialog.css"/>
</head>
<body>
<div id="myField"></div>
<script>
var plugin;
var mockCtrl;
var mockField;
var mockRange;
var mockPlaceCursorNextTo;
var stubs = new goog.testing.PropertyReplacer();
var fieldObj;
var CUSTOM_MESSAGE = 'Hello, cruel world...';
var expectedFailures = new goog.testing.ExpectedFailures();
function setUp() {
mockCtrl = new goog.testing.MockControl();
mockRange = new goog.testing.MockRange();
mockCtrl.addMock(mockRange);
mockField =
new goog.testing.editor.FieldMock(undefined, undefined, mockRange);
mockCtrl.addMock(mockField);
mockPlaceCursorNextTo = mockCtrl.createFunctionMock('placeCursorNextTo');
}
function tearDown() {
plugin.dispose();
tearDownRealEditableField();
expectedFailures.handleTearDown();
stubs.reset();
goog.dom.getElement('myField').innerHTML = '';
}
/**
* Tests that the plugin's dialog is properly created.
*/
function testCreateDialog() {
mockField.$replay();
plugin = new goog.demos.editor.HelloWorldDialogPlugin();
plugin.registerFieldObject(mockField);
var dialog = plugin.createDialog(goog.dom.getDomHelper());
assertTrue('Dialog should be of type goog.demos.editor.HelloWorldDialog',
dialog instanceof goog.demos.editor.HelloWorldDialog);
mockField.$verify();
}
/**
* Tests that when the OK event fires the editable field is properly updated.
*/
function testOk() {
mockField.focus();
mockField.dispatchBeforeChange();
mockRange.removeContents();
// Tests that an argument is a span with the custom message.
var createdNodeMatcher = new goog.testing.mockmatchers.ArgumentMatcher(
function(arg) {
return arg.nodeType == goog.dom.NodeType.ELEMENT &&
arg.tagName == goog.dom.TagName.SPAN &&
goog.dom.getRawTextContent(arg) == CUSTOM_MESSAGE;
});
mockRange.insertNode(createdNodeMatcher, false);
mockRange.$does(function(node, before) {
return node;
});
mockPlaceCursorNextTo(createdNodeMatcher, false);
stubs.set(goog.editor.range, 'placeCursorNextTo', mockPlaceCursorNextTo);
mockField.dispatchSelectionChangeEvent();
mockField.dispatchChange();
mockCtrl.$replayAll();
plugin = new goog.demos.editor.HelloWorldDialogPlugin();
plugin.registerFieldObject(mockField);
var dialog = plugin.createDialog(goog.dom.getDomHelper());
// Mock of execCommand + clicking OK without actually opening the dialog.
dialog.dispatchEvent(
new goog.demos.editor.HelloWorldDialog.OkEvent(CUSTOM_MESSAGE));
mockCtrl.$verifyAll();
}
/**
* Setup a real editable field (instead of a mock) and register the plugin to
* it.
*/
function setUpRealEditableField() {
fieldObj = new goog.editor.Field('myField', document);
fieldObj.makeEditable();
// Register the plugin to that field.
plugin = new goog.demos.editor.HelloWorldDialogPlugin();
fieldObj.registerPlugin(plugin);
}
/**
* Tear down the real editable field.
*/
function tearDownRealEditableField() {
if (fieldObj) {
fieldObj.makeUneditable();
fieldObj.dispose();
}
}
/**
* Tests that the selection is cleared when the dialog opens and is
* correctly restored after ok is clicked.
*/
function testRestoreSelectionOnOk() {
setUpRealEditableField();
fieldObj.setHtml(false, '12345');
var elem = fieldObj.getElement();
var helper = new goog.testing.editor.TestHelper(elem);
helper.select('12345', 1, '12345', 4); // Selects '234'.
assertEquals('Incorrect text selected before dialog is opened',
'234',
fieldObj.getRange().getText());
plugin.execCommand(
goog.demos.editor.HelloWorldDialogPlugin.Command.HELLO_WORLD_DIALOG);
// TODO(user): IE returns some bogus range when field doesn't have
// selection. Remove the expectedFailure when robbyw fixes the issue.
// NOTE(user): You can't remove the selection from a field in Opera without
// blurring it.
elem.parentNode.blur();
expectedFailures.expectFailureFor(goog.userAgent.IE ||
goog.userAgent.OPERA);
try {
assertNull('There should be no selection while dialog is open',
fieldObj.getRange());
} catch (e) {
expectedFailures.handleException(e);
}
goog.testing.events.fireClickSequence(
plugin.dialog_.getOkButtonElement());
assertEquals('No text should be selected after clicking ok',
'',
fieldObj.getRange().getText());
// Test that the caret is placed after the custom message.
goog.testing.editor.dom.assertRangeBetweenText(
'Hello, world!', '5', fieldObj.getRange());
}
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/seamlessfield.html
+106
View File
@@ -0,0 +1,106 @@
<!DOCTYPE html>
<html>
<!--
Copyright 2010 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>goog.editor.SeamlessField</title>
<script src="../../base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.editor.SeamlessField');
</script>
<link rel="stylesheet" href="../css/demo.css">
<style>
#editMe {
border: 1px solid grey;
width: 600px;
}
#wrapper {
background-color: #87CEFA;
}
h1 {
font-family: courier;
color: red;
}
p {
margin: 0;
background-color: lightgrey;
}
li {
list-style-type: lower-greek;
}
table p {
margin: 3px;
background-color: white;
}
</style>
</head>
<body>
<h1>goog.editor.SeamlessField</h1>
<p>This is a very basic demonstration of how to make a region editable, that
blends in with the surrounding page, even if the editable content is inside
an iframe.</p>
<input type="button" value="Make Editable" onclick="makeFieldEditable();" />
<input type="button" value="Make Uneditable"
onclick="makeFieldUneditable();" />
<br>
<div id="wrapper">
<br><br>
<div id="editMe">I am a regular div.
Click <b>"Make Editable"</b> above to transform me into an editable region.
I'll grow and shrink with my content!
And I'll inherit styles from the parent document.
<h1>Heading styled by outer document.</h1>
<ol>
<li>And lists too! One!</li>
<li>Two!</li>
</ol>
<p>Paragraph 1</p>
<table><tr><td>
<p>Inherited CSS works!</p>
</td></tr></table>
</div>
<br><br>
</div>
<hr>
<p><b>Current field contents</b>
(updates as contents of the editable field above change):<br>
<textarea id="fieldContents" style="height:100px;width:400px;"></textarea><br>
<input type="button" value="Set Field Contents"
onclick="myField.setHtml(false, goog.dom.getElement('fieldContents').value);" />
(Use to set contents of the editable field to the contents of this textarea)
</p>
<script>
var myField = new goog.editor.SeamlessField('editMe');
function makeFieldEditable() {
goog.events.listen(myField, goog.editor.Field.EventType.DELAYEDCHANGE,
updateFieldContents);
myField.makeEditable();
updateFieldContents();
}
function makeFieldUneditable() {
myField.makeUneditable();
}
function updateFieldContents() {
goog.dom.getElement('fieldContents').value = myField.getCleanContents();
}
</script>
</body>
</html>
mapbox-gl/closure-library/closure/goog/demos/editor/tableeditor.html
+94
View File
@@ -0,0 +1,94 @@
<html>
<!--
Copyright 2009 The Closure Library Authors. All Rights Reserved.
Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<!--
Author: nicksantos@google.com (Nick Santos)
-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>goog.editor.plugins.TableEditor Demo</title>
<script src="../../base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.editor.Command');
goog.require('goog.editor.Field');
goog.require('goog.editor.plugins.TableEditor');
goog.require('goog.ui.editor.DefaultToolbar');
goog.require('goog.ui.editor.ToolbarController');
</script>
<link rel="stylesheet" href="../css/demo.css">
<link rel="stylesheet" href="../../css/button.css" />
<link rel="stylesheet" href="../../css/dialog.css" />
<link rel="stylesheet" href="../../css/linkbutton.css" />
<link rel="stylesheet" href="../../css/menu.css">
<link rel="stylesheet" href="../../css/menuitem.css">
<link rel="stylesheet" href="../../css/menuseparator.css">
<link rel="stylesheet" href="../../css/tab.css" />
<link rel="stylesheet" href="../../css/tabbar.css" />
<link rel="stylesheet" href="../../css/toolbar.css" />
<link rel="stylesheet" href="../../css/editortoolbar.css" />
<style>
#editMe {
width: 600px;
height: 300px;
background-color: white;
border: 1px solid grey;
}
</style>
</head>
<body>
<h1>goog.editor.plugins.TableEditor Demo</h1>
<p>This is a demonstration of the table editor plugin for goog.editor.</p>
<br>
<div id='toolbar' style='width:602px'></div>
<div id='editMe'></div>
<hr>
<p><b>Current field contents</b>
(updates as contents of the editable field above change):<br>
<textarea id="fieldContents" style="height:100px;width:400px;"></textarea><br>
<input type="button" value="Set Field Contents"
onclick="myField.setHtml(false, goog.dom.getElement('fieldContents').value);" />
(Use to set contents of the editable field to the contents of this textarea)
</p>
<script>
function updateFieldContents() {
goog.dom.getElement('fieldContents').value = myField.getCleanContents();
}
var myField = new goog.editor.Field('editMe');
myField.registerPlugin(new goog.editor.plugins.TableEditor());
// Specify the buttons to add to the toolbar, using built in default buttons.
var buttonIds = goog.object.getValues(
goog.editor.plugins.TableEditor.COMMAND);
var buttons = []
for (var i = 0; i < buttonIds.length; i++) {
var cmd = buttonIds[i];
buttons[i] = goog.ui.editor.ToolbarFactory.makeButton(cmd, cmd, cmd);
}
var myToolbar = goog.ui.editor.DefaultToolbar.makeToolbar(buttons,
goog.dom.getElement('toolbar'));
// Hook the toolbar into the field.
var myToolbarController =
new goog.ui.editor.ToolbarController(myField, myToolbar);
// Watch for field changes, to display below.
goog.events.listen(myField, goog.editor.Field.EventType.DELAYEDCHANGE,
updateFieldContents);
myField.makeEditable();
updateFieldContents();
</script>
</body>
</html>