mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-08-10 00:37:54 +02:00
W.I.P of collaborative odf editor:
- Add wodocollabtexteditor library
This commit is contained in:
Hadi Nategh
208
api/js/webodf/collab/widgets/simpleStyles.js
Normal file
208
api/js/webodf/collab/widgets/simpleStyles.js
Normal file
@ -0,0 +1,208 @@
|
||||
/**
|
||||
* Copyright (C) 2012-2013 KO GmbH <copyright@kogmbh.com>
|
||||
*
|
||||
* @licstart
|
||||
* This file is part of WebODF.
|
||||
*
|
||||
* WebODF is free software: you can redistribute it and/or modify it
|
||||
* under the terms of the GNU Affero General Public License (GNU AGPL)
|
||||
* as published by the Free Software Foundation, either version 3 of
|
||||
* the License, or (at your option) any later version.
|
||||
*
|
||||
* WebODF is distributed in the hope that it will be useful, but
|
||||
* WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with WebODF. If not, see <http://www.gnu.org/licenses/>.
|
||||
* @licend
|
||||
*
|
||||
* @source: http://www.webodf.org/
|
||||
* @source: https://github.com/kogmbh/WebODF/
|
||||
*/
|
||||
|
||||
/*global define, require, runtime, gui, ops */
|
||||
|
||||
define("webodf/editor/widgets/simpleStyles", [
|
||||
"webodf/editor/widgets/fontPicker",
|
||||
"dijit/form/ToggleButton",
|
||||
"dijit/form/NumberSpinner"],
|
||||
|
||||
function (FontPicker, ToggleButton, NumberSpinner) {
|
||||
"use strict";
|
||||
|
||||
var SimpleStyles = function (callback) {
|
||||
var self = this,
|
||||
editorSession,
|
||||
widget = {},
|
||||
directFormattingController,
|
||||
boldButton,
|
||||
italicButton,
|
||||
underlineButton,
|
||||
strikethroughButton,
|
||||
fontSizeSpinner,
|
||||
fontPicker,
|
||||
fontPickerWidget;
|
||||
|
||||
boldButton = new ToggleButton({
|
||||
label: runtime.tr('Bold'),
|
||||
disabled: true,
|
||||
showLabel: false,
|
||||
checked: false,
|
||||
iconClass: "dijitEditorIcon dijitEditorIconBold",
|
||||
onChange: function (checked) {
|
||||
directFormattingController.setBold(checked);
|
||||
self.onToolDone();
|
||||
}
|
||||
});
|
||||
|
||||
italicButton = new ToggleButton({
|
||||
label: runtime.tr('Italic'),
|
||||
disabled: true,
|
||||
showLabel: false,
|
||||
checked: false,
|
||||
iconClass: "dijitEditorIcon dijitEditorIconItalic",
|
||||
onChange: function (checked) {
|
||||
directFormattingController.setItalic(checked);
|
||||
self.onToolDone();
|
||||
}
|
||||
});
|
||||
|
||||
underlineButton = new ToggleButton({
|
||||
label: runtime.tr('Underline'),
|
||||
disabled: true,
|
||||
showLabel: false,
|
||||
checked: false,
|
||||
iconClass: "dijitEditorIcon dijitEditorIconUnderline",
|
||||
onChange: function (checked) {
|
||||
directFormattingController.setHasUnderline(checked);
|
||||
self.onToolDone();
|
||||
}
|
||||
});
|
||||
|
||||
strikethroughButton = new ToggleButton({
|
||||
label: runtime.tr('Strikethrough'),
|
||||
disabled: true,
|
||||
showLabel: false,
|
||||
checked: false,
|
||||
iconClass: "dijitEditorIcon dijitEditorIconStrikethrough",
|
||||
onChange: function (checked) {
|
||||
directFormattingController.setHasStrikethrough(checked);
|
||||
self.onToolDone();
|
||||
}
|
||||
});
|
||||
|
||||
fontSizeSpinner = new NumberSpinner({
|
||||
label: runtime.tr('Size'),
|
||||
disabled: true,
|
||||
showLabel: false,
|
||||
value: 12,
|
||||
smallDelta: 1,
|
||||
constraints: {min: 6, max: 96},
|
||||
intermediateChanges: true,
|
||||
onChange: function (value) {
|
||||
directFormattingController.setFontSize(value);
|
||||
},
|
||||
onClick: function () {
|
||||
self.onToolDone();
|
||||
},
|
||||
onInput: function () {
|
||||
// Do not process any input in the text box;
|
||||
// even paste events will not be processed
|
||||
// so that no corrupt values can exist
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
/*jslint emptyblock: true*/
|
||||
fontPicker = new FontPicker(function () {});
|
||||
/*jslint emptyblock: false*/
|
||||
fontPickerWidget = fontPicker.widget();
|
||||
fontPickerWidget.setAttribute('disabled', true);
|
||||
fontPickerWidget.onChange = function (value) {
|
||||
directFormattingController.setFontName(value);
|
||||
self.onToolDone();
|
||||
};
|
||||
|
||||
widget.children = [boldButton, italicButton, underlineButton, strikethroughButton, fontPickerWidget, fontSizeSpinner];
|
||||
widget.startup = function () {
|
||||
widget.children.forEach(function (element) {
|
||||
element.startup();
|
||||
});
|
||||
};
|
||||
|
||||
widget.placeAt = function (container) {
|
||||
widget.children.forEach(function (element) {
|
||||
element.placeAt(container);
|
||||
});
|
||||
return widget;
|
||||
};
|
||||
|
||||
function updateStyleButtons(changes) {
|
||||
// The 3rd parameter to set(...) is false to avoid firing onChange when setting the value programmatically.
|
||||
var updateCalls = {
|
||||
isBold: function (value) { boldButton.set('checked', value, false); },
|
||||
isItalic: function (value) { italicButton.set('checked', value, false); },
|
||||
hasUnderline: function (value) { underlineButton.set('checked', value, false); },
|
||||
hasStrikeThrough: function (value) { strikethroughButton.set('checked', value, false); },
|
||||
fontSize: function (value) {
|
||||
fontSizeSpinner.set('intermediateChanges', false); // Necessary due to https://bugs.dojotoolkit.org/ticket/11588
|
||||
fontSizeSpinner.set('value', value, false);
|
||||
fontSizeSpinner.set('intermediateChanges', true);
|
||||
},
|
||||
fontName: function (value) { fontPickerWidget.set('value', value, false); }
|
||||
};
|
||||
|
||||
Object.keys(changes).forEach(function (key) {
|
||||
var updateCall = updateCalls[key];
|
||||
if (updateCall) {
|
||||
updateCall(changes[key]);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function enableStyleButtons(enabledFeatures) {
|
||||
widget.children.forEach(function (element) {
|
||||
element.setAttribute('disabled', !enabledFeatures.directTextStyling);
|
||||
});
|
||||
}
|
||||
|
||||
this.setEditorSession = function (session) {
|
||||
if (editorSession) {
|
||||
directFormattingController.unsubscribe(gui.DirectFormattingController.textStylingChanged, updateStyleButtons);
|
||||
directFormattingController.unsubscribe(gui.DirectFormattingController.enabledChanged, enableStyleButtons);
|
||||
}
|
||||
|
||||
editorSession = session;
|
||||
fontPicker.setEditorSession(editorSession);
|
||||
if (editorSession) {
|
||||
directFormattingController = editorSession.sessionController.getDirectFormattingController();
|
||||
|
||||
directFormattingController.subscribe(gui.DirectFormattingController.textStylingChanged, updateStyleButtons);
|
||||
directFormattingController.subscribe(gui.DirectFormattingController.enabledChanged, enableStyleButtons);
|
||||
|
||||
enableStyleButtons(directFormattingController.enabledFeatures());
|
||||
} else {
|
||||
enableStyleButtons({ directTextStyling: false});
|
||||
}
|
||||
|
||||
updateStyleButtons({
|
||||
isBold: editorSession ? directFormattingController.isBold() : false,
|
||||
isItalic: editorSession ? directFormattingController.isItalic() : false,
|
||||
hasUnderline: editorSession ? directFormattingController.hasUnderline() : false,
|
||||
hasStrikeThrough: editorSession ? directFormattingController.hasStrikeThrough() : false,
|
||||
fontSize: editorSession ? directFormattingController.fontSize() : undefined,
|
||||
fontName: editorSession ? directFormattingController.fontName() : undefined
|
||||
});
|
||||
};
|
||||
|
||||
/*jslint emptyblock: true*/
|
||||
this.onToolDone = function () {};
|
||||
/*jslint emptyblock: false*/
|
||||
|
||||
callback(widget);
|
||||
};
|
||||
|
||||
return SimpleStyles;
|
||||
});
|
||||
Reference in New Issue
Block a user