contenteditablefield.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. // Copyright 2012 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 Class to encapsulate an editable field that blends into the
  16. * style of the page and never uses an iframe. The field's height can be
  17. * controlled by CSS styles like min-height, max-height, and overflow. This is
  18. * a goog.editor.Field, but overrides everything iframe related to use
  19. * contentEditable divs. This is essentially a much lighter alternative to
  20. * goog.editor.SeamlessField, but only works in Firefox 3+, and only works
  21. * *well* in Firefox 12+ due to
  22. * https://bugzilla.mozilla.org/show_bug.cgi?id=669026.
  23. *
  24. * @author gboyer@google.com (Garrett Boyer)
  25. * @author nicksantos@google.com (Nick Santos)
  26. */
  27. goog.provide('goog.editor.ContentEditableField');
  28. goog.require('goog.asserts');
  29. goog.require('goog.editor.Field');
  30. goog.require('goog.log');
  31. /**
  32. * This class encapsulates an editable field that is just a contentEditable
  33. * div.
  34. *
  35. * To see events fired by this object, please see the base class.
  36. *
  37. * @param {string} id An identifer for the field. This is used to find the
  38. * field and the element associated with this field.
  39. * @param {Document=} opt_doc The document that the element with the given
  40. * id can be found in.
  41. * @constructor
  42. * @extends {goog.editor.Field}
  43. */
  44. goog.editor.ContentEditableField = function(id, opt_doc) {
  45. goog.editor.Field.call(this, id, opt_doc);
  46. };
  47. goog.inherits(goog.editor.ContentEditableField, goog.editor.Field);
  48. /**
  49. * @override
  50. */
  51. goog.editor.ContentEditableField.prototype.logger =
  52. goog.log.getLogger('goog.editor.ContentEditableField');
  53. /** @override */
  54. goog.editor.ContentEditableField.prototype.usesIframe = function() {
  55. // Never uses an iframe in any browser.
  56. return false;
  57. };
  58. // Overridden to improve dead code elimination only.
  59. /** @override */
  60. goog.editor.ContentEditableField.prototype.turnOnDesignModeGecko =
  61. goog.nullFunction;
  62. /** @override */
  63. goog.editor.ContentEditableField.prototype.installStyles = function() {
  64. goog.asserts.assert(
  65. !this.cssStyles, 'ContentEditableField does not support' +
  66. ' CSS styles; instead just write plain old CSS on the main page.');
  67. };
  68. /** @override */
  69. goog.editor.ContentEditableField.prototype.makeEditableInternal = function(
  70. opt_iframeSrc) {
  71. var field = this.getOriginalElement();
  72. if (field) {
  73. this.setupFieldObject(field);
  74. // TODO(gboyer): Allow clients/plugins to override with 'plaintext-only'
  75. // for WebKit.
  76. field.contentEditable = true;
  77. this.injectContents(field.innerHTML, field);
  78. this.handleFieldLoad();
  79. }
  80. };
  81. /**
  82. * @override
  83. *
  84. * ContentEditableField does not make any changes to the DOM when it is made
  85. * editable other than setting contentEditable to true.
  86. */
  87. goog.editor.ContentEditableField.prototype.restoreDom = goog.nullFunction;