diff options
Diffstat (limited to 'comm/mail/components/compose/content/dialogs/EdColorPicker.js')
| -rw-r--r-- | comm/mail/components/compose/content/dialogs/EdColorPicker.js | 290 |
1 files changed, 290 insertions, 0 deletions
diff --git a/comm/mail/components/compose/content/dialogs/EdColorPicker.js b/comm/mail/components/compose/content/dialogs/EdColorPicker.js new file mode 100644 index 0000000000..ef03a1d10b --- /dev/null +++ b/comm/mail/components/compose/content/dialogs/EdColorPicker.js @@ -0,0 +1,290 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +/* import-globals-from ../editorUtilities.js */ +/* import-globals-from EdDialogCommon.js */ + +// Cancel() is in EdDialogCommon.js + +var insertNew = true; +var tagname = "TAG NAME"; +var gColor = ""; +var LastPickedColor = ""; +var ColorType = "Text"; +var TextType = false; +var HighlightType = false; +var TableOrCell = false; +var LastPickedIsDefault = true; +var NoDefault = false; +var gColorObj; + +// dialog initialization code + +document.addEventListener("dialogaccept", onAccept); +document.addEventListener("dialogcancel", onCancelColor); + +function Startup() { + if (!window.arguments[1]) { + dump("EdColorPicker: Missing color object param\n"); + return; + } + + // window.arguments[1] is object to get initial values and return color data + gColorObj = window.arguments[1]; + gColorObj.Cancel = false; + + gDialog.ColorPicker = document.getElementById("ColorPicker"); + gDialog.ColorInput = document.getElementById("ColorInput"); + gDialog.LastPickedButton = document.getElementById("LastPickedButton"); + gDialog.LastPickedColor = document.getElementById("LastPickedColor"); + gDialog.CellOrTableGroup = document.getElementById("CellOrTableGroup"); + gDialog.TableRadio = document.getElementById("TableRadio"); + gDialog.CellRadio = document.getElementById("CellRadio"); + gDialog.ColorSwatch = document.getElementById("ColorPickerSwatch"); + gDialog.Ok = document.querySelector("dialog").getButton("accept"); + + // The type of color we are setting: + // text: Text, Link, ActiveLink, VisitedLink, + // or background: Page, Table, or Cell + if (gColorObj.Type) { + ColorType = gColorObj.Type; + // Get string for dialog title from passed-in type + // (note constraint on editor.properties string name) + let IsCSSPrefChecked = Services.prefs.getBoolPref("editor.use_css"); + + if (GetCurrentEditor()) { + if (ColorType == "Page" && IsCSSPrefChecked && IsHTMLEditor()) { + document.title = GetString("BlockColor"); + } else { + document.title = GetString(ColorType + "Color"); + } + } + } + + gDialog.ColorInput.value = ""; + var tmpColor; + var haveTableRadio = false; + + switch (ColorType) { + case "Page": + tmpColor = gColorObj.PageColor; + if (tmpColor && tmpColor.toLowerCase() != "window") { + gColor = tmpColor; + } + break; + case "Table": + if (gColorObj.TableColor) { + gColor = gColorObj.TableColor; + } + break; + case "Cell": + if (gColorObj.CellColor) { + gColor = gColorObj.CellColor; + } + break; + case "TableOrCell": + TableOrCell = true; + document.getElementById("TableOrCellGroup").collapsed = false; + haveTableRadio = true; + if (gColorObj.SelectedType == "Cell") { + gColor = gColorObj.CellColor; + gDialog.CellOrTableGroup.selectedItem = gDialog.CellRadio; + gDialog.CellRadio.focus(); + } else { + gColor = gColorObj.TableColor; + gDialog.CellOrTableGroup.selectedItem = gDialog.TableRadio; + gDialog.TableRadio.focus(); + } + break; + case "Highlight": + HighlightType = true; + if (gColorObj.HighlightColor) { + gColor = gColorObj.HighlightColor; + } + break; + default: + // Any other type will change some kind of text, + TextType = true; + tmpColor = gColorObj.TextColor; + if (tmpColor && tmpColor.toLowerCase() != "windowtext") { + gColor = gColorObj.TextColor; + } + break; + } + + // Set initial color in input field and in the colorpicker + SetCurrentColor(gColor); + gDialog.ColorPicker.value = gColor; + + // Use last-picked colors passed in, or those persistent on dialog + if (TextType) { + if (!("LastTextColor" in gColorObj) || !gColorObj.LastTextColor) { + gColorObj.LastTextColor = + gDialog.LastPickedColor.getAttribute("LastTextColor"); + } + LastPickedColor = gColorObj.LastTextColor; + } else if (HighlightType) { + if (!("LastHighlightColor" in gColorObj) || !gColorObj.LastHighlightColor) { + gColorObj.LastHighlightColor = + gDialog.LastPickedColor.getAttribute("LastHighlightColor"); + } + LastPickedColor = gColorObj.LastHighlightColor; + } else { + if ( + !("LastBackgroundColor" in gColorObj) || + !gColorObj.LastBackgroundColor + ) { + gColorObj.LastBackgroundColor = gDialog.LastPickedColor.getAttribute( + "LastBackgroundColor" + ); + } + LastPickedColor = gColorObj.LastBackgroundColor; + } + + // Set method to detect clicking on OK button + // so we don't get fooled by changing "default" behavior + gDialog.Ok.setAttribute("onclick", "SetDefaultToOk()"); + + if (!LastPickedColor) { + // Hide the button, as there is no last color available. + gDialog.LastPickedButton.hidden = true; + } else { + gDialog.LastPickedColor.setAttribute( + "style", + "background-color: " + LastPickedColor + ); + + // Make "Last-picked" the default button, until the user selects a color. + gDialog.Ok.removeAttribute("default"); + gDialog.LastPickedButton.setAttribute("default", "true"); + } + + // Caller can prevent user from submitting an empty, i.e., default color + NoDefault = gColorObj.NoDefault; + if (NoDefault) { + // Hide the "Default button -- user must pick a color + document.getElementById("DefaultColorButton").collapsed = true; + } + + // Set focus to colorpicker if not set to table radio buttons above + if (!haveTableRadio) { + gDialog.ColorPicker.focus(); + } + + SetWindowLocation(); +} + +function SelectColor() { + var color = gDialog.ColorPicker.value; + if (color) { + SetCurrentColor(color); + } +} + +function RemoveColor() { + SetCurrentColor(""); + gDialog.ColorInput.focus(); + SetDefaultToOk(); +} + +function SelectColorByKeypress(aEvent) { + if (aEvent.charCode == aEvent.DOM_VK_SPACE) { + SelectColor(); + SetDefaultToOk(); + } +} + +function SelectLastPickedColor() { + SetCurrentColor(LastPickedColor); + if (onAccept()) { + // window.close(); + return true; + } + + return false; +} + +function SetCurrentColor(color) { + // TODO: Validate color? + if (!color) { + color = ""; + } + gColor = TrimString(color).toLowerCase(); + if (gColor == "mixed") { + gColor = ""; + } + gDialog.ColorInput.value = gColor; + SetColorSwatch(); +} + +function SetColorSwatch() { + gDialog.ColorSwatch.setAttribute( + "style", + `background-color: ${TrimString(gDialog.ColorInput.value) || "inherit"}` + ); +} + +function SetDefaultToOk() { + gDialog.LastPickedButton.removeAttribute("default"); + gDialog.Ok.setAttribute("default", "true"); + LastPickedIsDefault = false; +} + +function ValidateData() { + if (LastPickedIsDefault) { + gColor = LastPickedColor; + } else { + gColor = gDialog.ColorInput.value; + } + + gColor = TrimString(gColor).toLowerCase(); + + // TODO: Validate the color string! + + if (NoDefault && !gColor) { + ShowInputErrorMessage(GetString("NoColorError")); + SetTextboxFocus(gDialog.ColorInput); + return false; + } + return true; +} + +function onAccept(event) { + if (!ValidateData()) { + event.preventDefault(); + return; + } + + // Set return values and save in persistent color attributes + if (TextType) { + gColorObj.TextColor = gColor; + if (gColor.length > 0) { + gDialog.LastPickedColor.setAttribute("LastTextColor", gColor); + gColorObj.LastTextColor = gColor; + } + } else if (HighlightType) { + gColorObj.HighlightColor = gColor; + if (gColor.length > 0) { + gDialog.LastPickedColor.setAttribute("LastHighlightColor", gColor); + gColorObj.LastHighlightColor = gColor; + } + } else { + gColorObj.BackgroundColor = gColor; + if (gColor.length > 0) { + gDialog.LastPickedColor.setAttribute("LastBackgroundColor", gColor); + gColorObj.LastBackgroundColor = gColor; + } + // If table or cell requested, tell caller which element to set on + if (TableOrCell && gDialog.TableRadio.selected) { + gColorObj.Type = "Table"; + } + } + SaveWindowLocation(); +} + +function onCancelColor() { + // Tells caller that user canceled + gColorObj.Cancel = true; + SaveWindowLocation(); +} |