simpleStyles.js 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. /**
  2. * Copyright (C) 2012-2013 KO GmbH <copyright@kogmbh.com>
  3. *
  4. * @licstart
  5. * This file is part of WebODF.
  6. *
  7. * WebODF is free software: you can redistribute it and/or modify it
  8. * under the terms of the GNU Affero General Public License (GNU AGPL)
  9. * as published by the Free Software Foundation, either version 3 of
  10. * the License, or (at your option) any later version.
  11. *
  12. * WebODF is distributed in the hope that it will be useful, but
  13. * WITHOUT ANY WARRANTY; without even the implied warranty of
  14. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  15. * GNU Affero General Public License for more details.
  16. *
  17. * You should have received a copy of the GNU Affero General Public License
  18. * along with WebODF. If not, see <http://www.gnu.org/licenses/>.
  19. * @licend
  20. *
  21. * @source: http://www.webodf.org/
  22. * @source: https://github.com/kogmbh/WebODF/
  23. */
  24. /*global define, require, runtime, gui, ops */
  25. define("webodf/editor/widgets/simpleStyles", [
  26. "webodf/editor/widgets/fontPicker",
  27. "dijit/form/ToggleButton",
  28. "dijit/form/NumberSpinner"],
  29. function (FontPicker, ToggleButton, NumberSpinner) {
  30. "use strict";
  31. var SimpleStyles = function (callback) {
  32. var self = this,
  33. editorSession,
  34. widget = {},
  35. directFormattingController,
  36. boldButton,
  37. italicButton,
  38. underlineButton,
  39. strikethroughButton,
  40. fontSizeSpinner,
  41. fontPicker,
  42. fontPickerWidget;
  43. boldButton = new ToggleButton({
  44. label: runtime.tr('Bold'),
  45. disabled: true,
  46. showLabel: false,
  47. checked: false,
  48. iconClass: "dijitEditorIcon dijitEditorIconBold",
  49. onChange: function (checked) {
  50. directFormattingController.setBold(checked);
  51. self.onToolDone();
  52. }
  53. });
  54. italicButton = new ToggleButton({
  55. label: runtime.tr('Italic'),
  56. disabled: true,
  57. showLabel: false,
  58. checked: false,
  59. iconClass: "dijitEditorIcon dijitEditorIconItalic",
  60. onChange: function (checked) {
  61. directFormattingController.setItalic(checked);
  62. self.onToolDone();
  63. }
  64. });
  65. underlineButton = new ToggleButton({
  66. label: runtime.tr('Underline'),
  67. disabled: true,
  68. showLabel: false,
  69. checked: false,
  70. iconClass: "dijitEditorIcon dijitEditorIconUnderline",
  71. onChange: function (checked) {
  72. directFormattingController.setHasUnderline(checked);
  73. self.onToolDone();
  74. }
  75. });
  76. strikethroughButton = new ToggleButton({
  77. label: runtime.tr('Strikethrough'),
  78. disabled: true,
  79. showLabel: false,
  80. checked: false,
  81. iconClass: "dijitEditorIcon dijitEditorIconStrikethrough",
  82. onChange: function (checked) {
  83. directFormattingController.setHasStrikethrough(checked);
  84. self.onToolDone();
  85. }
  86. });
  87. fontSizeSpinner = new NumberSpinner({
  88. label: runtime.tr('Size'),
  89. disabled: true,
  90. showLabel: false,
  91. value: 12,
  92. smallDelta: 1,
  93. constraints: {min: 6, max: 96},
  94. intermediateChanges: true,
  95. onChange: function (value) {
  96. directFormattingController.setFontSize(value);
  97. },
  98. onClick: function () {
  99. self.onToolDone();
  100. },
  101. onInput: function () {
  102. // Do not process any input in the text box;
  103. // even paste events will not be processed
  104. // so that no corrupt values can exist
  105. return false;
  106. }
  107. });
  108. /*jslint emptyblock: true*/
  109. fontPicker = new FontPicker(function () {});
  110. /*jslint emptyblock: false*/
  111. fontPickerWidget = fontPicker.widget();
  112. fontPickerWidget.setAttribute('disabled', true);
  113. fontPickerWidget.onChange = function (value) {
  114. directFormattingController.setFontName(value);
  115. self.onToolDone();
  116. };
  117. widget.children = [boldButton, italicButton, underlineButton, strikethroughButton, fontPickerWidget, fontSizeSpinner];
  118. widget.startup = function () {
  119. widget.children.forEach(function (element) {
  120. element.startup();
  121. });
  122. };
  123. widget.placeAt = function (container) {
  124. widget.children.forEach(function (element) {
  125. element.placeAt(container);
  126. });
  127. return widget;
  128. };
  129. function updateStyleButtons(changes) {
  130. // The 3rd parameter to set(...) is false to avoid firing onChange when setting the value programmatically.
  131. var updateCalls = {
  132. isBold: function (value) { boldButton.set('checked', value, false); },
  133. isItalic: function (value) { italicButton.set('checked', value, false); },
  134. hasUnderline: function (value) { underlineButton.set('checked', value, false); },
  135. hasStrikeThrough: function (value) { strikethroughButton.set('checked', value, false); },
  136. fontSize: function (value) {
  137. fontSizeSpinner.set('intermediateChanges', false); // Necessary due to https://bugs.dojotoolkit.org/ticket/11588
  138. fontSizeSpinner.set('value', value, false);
  139. fontSizeSpinner.set('intermediateChanges', true);
  140. },
  141. fontName: function (value) { fontPickerWidget.set('value', value, false); }
  142. };
  143. Object.keys(changes).forEach(function (key) {
  144. var updateCall = updateCalls[key];
  145. if (updateCall) {
  146. updateCall(changes[key]);
  147. }
  148. });
  149. }
  150. function enableStyleButtons(enabledFeatures) {
  151. widget.children.forEach(function (element) {
  152. element.setAttribute('disabled', !enabledFeatures.directTextStyling);
  153. });
  154. }
  155. this.setEditorSession = function (session) {
  156. if (editorSession) {
  157. directFormattingController.unsubscribe(gui.DirectFormattingController.textStylingChanged, updateStyleButtons);
  158. directFormattingController.unsubscribe(gui.DirectFormattingController.enabledChanged, enableStyleButtons);
  159. }
  160. editorSession = session;
  161. fontPicker.setEditorSession(editorSession);
  162. if (editorSession) {
  163. directFormattingController = editorSession.sessionController.getDirectFormattingController();
  164. directFormattingController.subscribe(gui.DirectFormattingController.textStylingChanged, updateStyleButtons);
  165. directFormattingController.subscribe(gui.DirectFormattingController.enabledChanged, enableStyleButtons);
  166. enableStyleButtons(directFormattingController.enabledFeatures());
  167. } else {
  168. enableStyleButtons({ directTextStyling: false});
  169. }
  170. updateStyleButtons({
  171. isBold: editorSession ? directFormattingController.isBold() : false,
  172. isItalic: editorSession ? directFormattingController.isItalic() : false,
  173. hasUnderline: editorSession ? directFormattingController.hasUnderline() : false,
  174. hasStrikeThrough: editorSession ? directFormattingController.hasStrikeThrough() : false,
  175. fontSize: editorSession ? directFormattingController.fontSize() : undefined,
  176. fontName: editorSession ? directFormattingController.fontName() : undefined
  177. });
  178. };
  179. /*jslint emptyblock: true*/
  180. this.onToolDone = function () {};
  181. /*jslint emptyblock: false*/
  182. callback(widget);
  183. };
  184. return SimpleStyles;
  185. });