helloworlddialogplugin.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. // Copyright 2008 The Closure Library Authors. All Rights Reserved.
  2. //
  3. // Licensed under the Apache License, Version 2.0 (the "License");
  4. // you may not use this file except in compliance with the License.
  5. // You may obtain a copy of the License at
  6. //
  7. // http://www.apache.org/licenses/LICENSE-2.0
  8. //
  9. // Unless required by applicable law or agreed to in writing, software
  10. // distributed under the License is distributed on an "AS-IS" BASIS,
  11. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. // See the License for the specific language governing permissions and
  13. // limitations under the License.
  14. /**
  15. * @fileoverview An example of how to write a dialog plugin.
  16. *
  17. */
  18. goog.provide('goog.demos.editor.HelloWorldDialogPlugin');
  19. goog.provide('goog.demos.editor.HelloWorldDialogPlugin.Command');
  20. goog.require('goog.demos.editor.HelloWorldDialog');
  21. goog.require('goog.dom.TagName');
  22. goog.require('goog.editor.plugins.AbstractDialogPlugin');
  23. goog.require('goog.editor.range');
  24. goog.require('goog.functions');
  25. goog.require('goog.ui.editor.AbstractDialog');
  26. // *** Public interface ***************************************************** //
  27. /**
  28. * A plugin that opens the hello world dialog.
  29. * @constructor
  30. * @extends {goog.editor.plugins.AbstractDialogPlugin}
  31. * @final
  32. */
  33. goog.demos.editor.HelloWorldDialogPlugin = function() {
  34. goog.editor.plugins.AbstractDialogPlugin.call(
  35. this,
  36. goog.demos.editor.HelloWorldDialogPlugin.Command.HELLO_WORLD_DIALOG);
  37. };
  38. goog.inherits(
  39. goog.demos.editor.HelloWorldDialogPlugin,
  40. goog.editor.plugins.AbstractDialogPlugin);
  41. /**
  42. * Commands implemented by this plugin.
  43. * @enum {string}
  44. */
  45. goog.demos.editor.HelloWorldDialogPlugin.Command = {
  46. HELLO_WORLD_DIALOG: 'helloWorldDialog'
  47. };
  48. /** @override */
  49. goog.demos.editor.HelloWorldDialogPlugin.prototype.getTrogClassId =
  50. goog.functions.constant('HelloWorldDialog');
  51. // *** Protected interface ************************************************** //
  52. /**
  53. * Creates a new instance of the dialog and registers for the relevant events.
  54. * @param {goog.dom.DomHelper} dialogDomHelper The dom helper to be used to
  55. * create the dialog.
  56. * @return {goog.demos.editor.HelloWorldDialog} The dialog.
  57. * @override
  58. * @protected
  59. */
  60. goog.demos.editor.HelloWorldDialogPlugin.prototype.createDialog = function(
  61. dialogDomHelper) {
  62. var dialog = new goog.demos.editor.HelloWorldDialog(dialogDomHelper);
  63. dialog.addEventListener(
  64. goog.ui.editor.AbstractDialog.EventType.OK, this.handleOk_, false, this);
  65. return dialog;
  66. };
  67. // *** Private implementation *********************************************** //
  68. /**
  69. * Handles the OK event from the dialog by inserting the hello world message
  70. * into the field.
  71. * @param {goog.demos.editor.HelloWorldDialog.OkEvent} e OK event object.
  72. * @private
  73. */
  74. goog.demos.editor.HelloWorldDialogPlugin.prototype.handleOk_ = function(e) {
  75. // First restore the selection so we can manipulate the field's content
  76. // according to what was selected.
  77. this.restoreOriginalSelection();
  78. // Notify listeners that the field's contents are about to change.
  79. this.getFieldObject().dispatchBeforeChange();
  80. // Now we can clear out what was previously selected (if anything).
  81. var range = this.getFieldObject().getRange();
  82. range.removeContents();
  83. // And replace it with a span containing our hello world message.
  84. var createdNode = this.getFieldDomHelper().createDom(
  85. goog.dom.TagName.SPAN, null, e.message);
  86. createdNode = range.insertNode(createdNode, false);
  87. // Place the cursor at the end of the new text node (false == to the right).
  88. goog.editor.range.placeCursorNextTo(createdNode, false);
  89. // Notify listeners that the field's selection has changed.
  90. this.getFieldObject().dispatchSelectionChangeEvent();
  91. // Notify listeners that the field's contents have changed.
  92. this.getFieldObject().dispatchChange();
  93. };