src/view/ViewCommandHandlers.js
/*
* Copyright (c) 2012 - present Adobe Systems Incorporated. All rights reserved.
*
* Permission is hereby granted, free of charge, to any person obtaining a
* copy of this software and associated documentation files (the "Software"),
* to deal in the Software without restriction, including without limitation
* the rights to use, copy, modify, merge, publish, distribute, sublicense,
* and/or sell copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
* DEALINGS IN THE SOFTWARE.
*
*/
/*global less */
/**
* The ViewCommandHandlers object dispatches the following event(s):
* - fontSizeChange -- Triggered when the font size is changed via the
* Increase Font Size, Decrease Font Size, or Restore Font Size commands.
* The 2nd arg to the listener is the amount of the change. The 3rd arg
* is a string containing the new font size after applying the change.
*/
define(function (require, exports, module) {
"use strict";
var Commands = require("command/Commands"),
EventDispatcher = require("utils/EventDispatcher"),
CommandManager = require("command/CommandManager"),
Strings = require("strings"),
StringUtils = require("utils/StringUtils"),
EditorManager = require("editor/EditorManager"),
PreferencesManager = require("preferences/PreferencesManager"),
DocumentManager = require("document/DocumentManager"),
ThemeSettings = require("view/ThemeSettings"),
MainViewManager = require("view/MainViewManager"),
AppInit = require("utils/AppInit"),
_ = require("thirdparty/lodash"),
FontRuleTemplate = require("text!view/fontrules/font-based-rules.less");
var prefs = PreferencesManager.getExtensionPrefs("fonts");
/**
* Font sizes should be validated by this regexp
*/
var validFontSizeRegExpStr = "^([0-9]+)?(\\.)?([0-9]+)(px|em)$";
// Need RegExp as a string to be exported for use with HTML5 pattern attribute
/**
* @private
* The currently present font size. Used to detect no-op changes.
* @type {string}
*/
var currFontSize;
/**
* @private
* The currently present font family. Used to detect no-op changes.
* @type {string}
*/
var currFontFamily;
/**
* @const
* @type {string}
*/
var DYNAMIC_FONT_STYLE_ID = "codemirror-dynamic-fonts";
/**
* @const
* @type {string}
*/
var DYNAMIC_FONT_FAMILY_ID = "codemirror-dynamic-font-family";
/**
* @const
* @private
* The smallest font size in pixels
* @type {number}
*/
var MIN_FONT_SIZE = 1;
/**
* @const
* @private
* The largest font size in pixels
* @type {number}
*/
var MAX_FONT_SIZE = 72;
/**
* @const
* @private
* The default font size used only to convert the old fontSizeAdjustment view state to the new fontSize
* @type {number}
*/
var DEFAULT_FONT_SIZE = 12;
/**
* @const
* @private
* The default font family
* @type {string}
*/
var DEFAULT_FONT_FAMILY = "'SourceCodePro-Medium', ＭＳ ゴシック, 'MS Gothic', monospace";
/**
* @private
* Removes style property from the DOM
* @param {string} propertyID is the id of the property to be removed
*/
function _removeDynamicProperty(propertyID) {
$("#" + propertyID).remove();
}
/**
* @private
* Add the style property to the DOM
* @param {string} propertyID Is the property ID to be added
* @param {object} ruleCfg Is the CSS Rule configuration object
* @param {string} ruleCfg.propName Is the name of the style property
* @param {string} ruleCfg.propValue Is the value of the style property
* @param {boolean} ruleCfg.priorityFlag Is a flag to make the style property !important
* @param {string} ruleCfg.ruleName Optional Selctor name to be used for the rule
* @param {string} ruleCfg.ruleText Optional selector definition text
*/
function _addDynamicProperty(propertyID, ruleCfg) {
var $style = $("<style type='text/css'></style>").attr("id", propertyID);
if (ruleCfg.ruleText) {
$style.html(ruleCfg.ruleText);
} else {
var cssRule = ruleCfg.ruleName || ".CodeMirror";
var styleStr = ruleCfg.ruleText || StringUtils.format("{0}: {1} {2}", ruleCfg.propName, ruleCfg.propValue, ruleCfg.priorityFlag ? "!important" : "");
$style.html(cssRule + "{ " + styleStr + " }");
}
// Let's make sure we remove the already existing item from the DOM.
_removeDynamicProperty(propertyID);
$("head").append($style);
}
/**
* @private
* Removes the styles used to update the font size
*/
function _removeDynamicFontSize() {
_removeDynamicProperty(DYNAMIC_FONT_STYLE_ID);
}
/**
* @private
* Add the styles used to update the font size
* @param {string} fontSize A string with the font size and the size unit
*/
function _addDynamicFontSize(fontSize) {
var template = FontRuleTemplate.split("{font-size-param}").join(fontSize);
less.render(template, null, function onParse(err, tree) {
if (err) {
console.error(err);
} else {
_addDynamicProperty(DYNAMIC_FONT_STYLE_ID, {
ruleText: tree.css
});
}
});
}
/**
* @private
* Removes the styles used to update the font family
*/
function _removeDynamicFontFamily() {
_removeDynamicProperty(DYNAMIC_FONT_FAMILY_ID);
}
/**
* @private
* Add the styles used to update the font family
* @param {string} fontFamily A string with the font family
*/
function _addDynamicFontFamily(fontFamily) {
_addDynamicProperty(DYNAMIC_FONT_FAMILY_ID, {
propName: "font-family",
propValue: fontFamily
});
}
/**
* @private
* Sets the font size and restores the scroll position as best as possible.
* @param {!Editor} editor Editor to update.
* @param {string=} fontSize A string with the font size and the size unit
*/
function _updateScroll(editor, fontSize) {
var oldWidth = editor._codeMirror.defaultCharWidth(),
oldFontSize = prefs.get("fontSize"),
newFontSize = fontSize,
delta = 0,
adjustment = 0,
scrollPos = editor.getScrollPos(),
line = editor._codeMirror.lineAtHeight(scrollPos.y, "local");
delta = /em$/.test(oldFontSize) ? 10 : 1;
adjustment = parseInt((parseFloat(newFontSize) - parseFloat(oldFontSize)) * delta, 10);
// Only adjust the scroll position if there was any adjustments to the font size.
// Otherwise there will be unintended scrolling.
//
if (adjustment) {
editor.refreshAll();
}
// Calculate the new scroll based on the old font sizes and scroll position
var newWidth = editor._codeMirror.defaultCharWidth(),
deltaX = scrollPos.x / oldWidth,
scrollPosX = scrollPos.x + Math.round(deltaX * (newWidth - oldWidth)),
scrollPosY = editor._codeMirror.heightAtLine(line, "local");
editor.setScrollPos(scrollPosX, scrollPosY);
}
/**
* Font size setter to set the font size for the document editor
* @param {string} fontSize The font size with size unit as 'px' or 'em'
*/
function setFontSize(fontSize) {
if (currFontSize === fontSize) {
return;
}
_removeDynamicFontSize();
if (fontSize) {
_addDynamicFontSize(fontSize);
}
// Update scroll metrics in viewed editors
_.forEach(MainViewManager.getPaneIdList(), function (paneId) {
var currentPath = MainViewManager.getCurrentlyViewedPath(paneId),
doc = currentPath && DocumentManager.getOpenDocumentForPath(currentPath);
if (doc && doc._masterEditor) {
_updateScroll(doc._masterEditor, fontSize);
}
});
exports.trigger("fontSizeChange", fontSize, currFontSize);
currFontSize = fontSize;
prefs.set("fontSize", fontSize);
}
/**
* Font size getter to get the current font size for the document editor
* @return {string} Font size with size unit as 'px' or 'em'
*/
function getFontSize() {
return prefs.get("fontSize");
}
/**
* Font family setter to set the font family for the document editor
* @param {string} fontFamily The font family to be set. It can be a string with multiple comma separated fonts
*/
function setFontFamily(fontFamily) {
var editor = EditorManager.getCurrentFullEditor();
if (currFontFamily === fontFamily) {
return;
}
_removeDynamicFontFamily();
if (fontFamily) {
_addDynamicFontFamily(fontFamily);
}
exports.trigger("fontFamilyChange", fontFamily, currFontFamily);
currFontFamily = fontFamily;
prefs.set("fontFamily", fontFamily);
if (editor) {
editor.refreshAll();
}
}
/**
* Font smoothing setter to set the anti-aliasing type for the code area on Mac.
* @param {string} aaType The antialiasing type to be set. It can take either "subpixel-antialiased" or "antialiased"
*/
function setMacFontSmoothingType(aaType) {
var $editor_holder = $("#editor-holder");
// Add/Remove the class based on the preference. Also
// default to subpixel AA in case of invalid entries.
if (aaType === "antialiased") {
$editor_holder.removeClass("subpixel-aa");
} else {
$editor_holder.addClass("subpixel-aa");
}
}
/**
* Font family getter to get the currently configured font family for the document editor
* @return {string} The font family for the document editor
*/
function getFontFamily() {
return prefs.get("fontFamily");
}
/**
* @private
* Increases or decreases the editor's font size.
* @param {number} adjustment Negative number to make the font smaller; positive number to make it bigger
* @return {boolean} true if adjustment occurred, false if it did not occur
*/
function _adjustFontSize(adjustment) {
var fsStyle = prefs.get("fontSize");
var validFontSizeRegExp = new RegExp(validFontSizeRegExpStr);
// Make sure that the font size is expressed in terms we can
// handle (px or em). If not, simply bail.
if (fsStyle.search(validFontSizeRegExp) === -1) {
return false;
}
// Guaranteed to work by validation above.
var fsUnits = fsStyle.substring(fsStyle.length - 2, fsStyle.length),
delta = fsUnits === "px" ? 1 : 0.1,
fsOld = parseFloat(fsStyle.substring(0, fsStyle.length - 2)),
fsNew = fsOld + (delta * adjustment),
fsStr = fsNew + fsUnits;
// Don't let the font size get too small or too large. The minimum font size is 1px or 0.1em
// and the maximum font size is 72px or 7.2em depending on the unit used
if (fsNew < MIN_FONT_SIZE * delta || fsNew > MAX_FONT_SIZE * delta) {
return false;
}
setFontSize(fsStr);
return true;
}
/** Increases the font size by 1 */
function _handleIncreaseFontSize() {
_adjustFontSize(1);
}
/** Decreases the font size by 1 */
function _handleDecreaseFontSize() {
_adjustFontSize(-1);
}
/** Restores the font size to the original size */
function _handleRestoreFontSize() {
setFontSize(DEFAULT_FONT_SIZE + "px");
}
/**
* @private
* Updates the user interface appropriately based on whether or not a document is
* currently open in the editor.
*/
function _updateUI() {
if (DocumentManager.getCurrentDocument() !== null) {
if (!CommandManager.get(Commands.VIEW_INCREASE_FONT_SIZE).getEnabled()) {
// If one is disabled then they all are disabled, so enable them all
CommandManager.get(Commands.VIEW_INCREASE_FONT_SIZE).setEnabled(true);
CommandManager.get(Commands.VIEW_DECREASE_FONT_SIZE).setEnabled(true);
CommandManager.get(Commands.VIEW_RESTORE_FONT_SIZE).setEnabled(true);
}
} else {
// No current document so disable all of the Font Size commands
CommandManager.get(Commands.VIEW_INCREASE_FONT_SIZE).setEnabled(false);
CommandManager.get(Commands.VIEW_DECREASE_FONT_SIZE).setEnabled(false);
CommandManager.get(Commands.VIEW_RESTORE_FONT_SIZE).setEnabled(false);
}
}
/**
* Initializes the different settings that need to loaded
*/
function init() {
currFontFamily = prefs.get("fontFamily");
_addDynamicFontFamily(currFontFamily);
currFontSize = prefs.get("fontSize");
_addDynamicFontSize(currFontSize);
_updateUI();
}
/**
* Restores the font size using the saved style and migrates the old fontSizeAdjustment
* view state to the new fontSize, when required
*/
function restoreFontSize() {
var fsStyle = prefs.get("fontSize"),
fsAdjustment = PreferencesManager.getViewState("fontSizeAdjustment");
if (fsAdjustment) {
// Always remove the old view state even if we also have the new view state.
PreferencesManager.setViewState("fontSizeAdjustment");
if (!fsStyle) {
// Migrate the old view state to the new one.
fsStyle = (DEFAULT_FONT_SIZE + fsAdjustment) + "px";
prefs.set("fontSize", fsStyle);
}
}
if (fsStyle) {
_removeDynamicFontSize();
_addDynamicFontSize(fsStyle);
}
}
/**
* Restores the font size and font family back to factory settings.
*/
function restoreFonts() {
setFontFamily(DEFAULT_FONT_FAMILY);
setFontSize(DEFAULT_FONT_SIZE + "px");
}
/**
* @private
* Calculates the first and last visible lines of the focused editor
* @param {number} textHeight
* @param {number} scrollTop
* @param {number} editorHeight
* @return {{first: number, last: number}}
*/
function _getLinesInView(textHeight, scrollTop, editorHeight) {
var scrolledTop = scrollTop / textHeight,
scrolledBottom = (scrollTop + editorHeight) / textHeight;
// Adjust the last line to round inward to show a whole lines.
var firstLine = Math.ceil(scrolledTop),
lastLine = Math.floor(scrolledBottom) - 1;
return { first: firstLine, last: lastLine };
}
/**
* @private
* Scroll the viewport one line up or down.
* @param {number} direction -1 to scroll one line up; 1 to scroll one line down.
*/
function _scrollLine(direction) {
var editor = EditorManager.getCurrentFullEditor(),
textHeight = editor.getTextHeight(),
cursorPos = editor.getCursorPos(),
hasSelecction = editor.hasSelection(),
inlineEditors = editor.getInlineWidgets(),
scrollInfo = editor._codeMirror.getScrollInfo(),
paddingTop = editor._getLineSpaceElement().offsetTop,
editorHeight = scrollInfo.clientHeight,
scrollTop = scrollInfo.top - paddingTop,
removedScroll = paddingTop;
// Go through all the editors and reduce the scroll top and editor height to properly calculate the lines in view
var line, coords;
inlineEditors.forEach(function (inlineEditor) {
line = editor._getInlineWidgetLineNumber(inlineEditor);
coords = editor._codeMirror.charCoords({line: line, ch: 0}, "local");
if (coords.top < scrollInfo.top) {
scrollTop -= inlineEditor.info.height;
removedScroll += inlineEditor.info.height;
} else if (coords.top + inlineEditor.info.height < scrollInfo.top + editorHeight) {
editorHeight -= inlineEditor.info.height;
}
});
// Calculate the lines in view
var linesInView = _getLinesInView(textHeight, scrollTop, editorHeight);
// If there is no selection move the cursor so that is always visible.
if (!hasSelecction) {
// Move the cursor to the first visible line.
if (cursorPos.line < linesInView.first) {
editor.setCursorPos({line: linesInView.first + direction, ch: cursorPos.ch});
// Move the cursor to the last visible line.
} else if (cursorPos.line > linesInView.last) {
editor.setCursorPos({line: linesInView.last + direction, ch: cursorPos.ch});
// Move the cursor up or down using moveV to keep the goal column intact, since setCursorPos deletes it.
} else if ((direction > 0 && cursorPos.line === linesInView.first) ||
(direction < 0 && cursorPos.line === linesInView.last)) {
editor._codeMirror.moveV(direction, "line");
}
}
// Scroll and make it snap to lines
var lines = linesInView.first + direction;
editor.setScrollPos(scrollInfo.left, (textHeight * lines) + removedScroll);
}
/** Scrolls one line up */
function _handleScrollLineUp() {
_scrollLine(-1);
}
/** Scrolls one line down */
function _handleScrollLineDown() {
_scrollLine(1);
}
/** Open theme settings dialog */
function _handleThemeSettings() {
ThemeSettings.showDialog();
}
// Register command handlers
CommandManager.register(Strings.CMD_INCREASE_FONT_SIZE, Commands.VIEW_INCREASE_FONT_SIZE, _handleIncreaseFontSize);
CommandManager.register(Strings.CMD_DECREASE_FONT_SIZE, Commands.VIEW_DECREASE_FONT_SIZE, _handleDecreaseFontSize);
CommandManager.register(Strings.CMD_RESTORE_FONT_SIZE, Commands.VIEW_RESTORE_FONT_SIZE, _handleRestoreFontSize);
CommandManager.register(Strings.CMD_SCROLL_LINE_UP, Commands.VIEW_SCROLL_LINE_UP, _handleScrollLineUp);
CommandManager.register(Strings.CMD_SCROLL_LINE_DOWN, Commands.VIEW_SCROLL_LINE_DOWN, _handleScrollLineDown);
CommandManager.register(Strings.CMD_THEMES, Commands.CMD_THEMES_OPEN_SETTINGS, _handleThemeSettings);
prefs.definePreference("fontSize", "string", DEFAULT_FONT_SIZE + "px", {
description: Strings.DESCRIPTION_FONT_SIZE
}).on("change", function () {
setFontSize(prefs.get("fontSize"));
});
prefs.definePreference("fontFamily", "string", DEFAULT_FONT_FAMILY, {
description: Strings.DESCRIPTION_FONT_FAMILY
}).on("change", function () {
setFontFamily(prefs.get("fontFamily"));
});
// Define a preference for font smoothing mode on Mac.
// By default fontSmoothing is set to "subpixel-antialiased"
// for the text inside code editor. It can be overridden
// to "antialiased", that would set text rendering AA to use
// gray scale antialiasing.
if (brackets.platform === "mac") {
prefs.definePreference("fontSmoothing", "string", "subpixel-antialiased", {
description: Strings.DESCRIPTION_FONT_SMOOTHING,
values: ["subpixel-antialiased", "antialiased"]
}).on("change", function () {
setMacFontSmoothingType(prefs.get("fontSmoothing"));
});
}
// Update UI when opening or closing a document
MainViewManager.on("currentFileChange", _updateUI);
// Update UI when Brackets finishes loading
AppInit.appReady(init);
EventDispatcher.makeEventDispatcher(exports);
exports.restoreFontSize = restoreFontSize;
exports.restoreFonts = restoreFonts;
exports.getFontSize = getFontSize;
exports.setFontSize = setFontSize;
exports.getFontFamily = getFontFamily;
exports.setFontFamily = setFontFamily;
exports.validFontSizeRegExp = validFontSizeRegExpStr;
});