@odoo/o-spreadsheet 14.0.1 → 15.0.0

package/src/plugins/formatting.ts

@@ -1,630 +0,0 @@
-import { BasePlugin } from "../base_plugin";
-import { DEFAULT_FONT, DEFAULT_FONT_SIZE, DEFAULT_FONT_WEIGHT } from "../constants";
-import { fontSizeMap } from "../fonts";
-import { maximumDecimalPlaces, stringify, toCartesian, toXC } from "../helpers/index";
-import { Border, BorderCommand, Cell, Command, Style, WorkbookData, Zone } from "../types/index";
-
-// -----------------------------------------------------------------------------
-// Constants / Types / Helpers
-// -----------------------------------------------------------------------------
-
-const commandToSides = {
-  top: ["top"],
-  left: ["left"],
-  right: ["right"],
-  bottom: ["bottom"],
-  all: ["top", "left", "bottom", "right"],
-};
-
-const DEFAULT_STYLE: Style = {
-  fillColor: "white",
-  textColor: "black",
-  fontSize: 11,
-};
-
-type FormatInfo = {
-  border?: number;
-  style?: number;
-  format?: string;
-};
-
-function getTargetZone(zone: Zone, side: string): Zone {
-  const { left, right, top, bottom } = zone;
-  switch (side) {
-    case "left":
-      return { left, top, right: left, bottom };
-    case "top":
-      return { left, top, right, bottom: top };
-    case "right":
-      return { left: right, top, right, bottom };
-    case "bottom":
-      return { left, top: bottom, right, bottom };
-  }
-  return zone;
-}
-
-/**
- * Formatting plugin.
- *
- * This plugin manages all things related to a cell look:
- * - styles
- * - borders
- * - value formatters
- */
-export class FormattingPlugin extends BasePlugin {
-  static getters = [
-    "getCurrentStyle",
-    "getCellWidth",
-    "getTextWidth",
-    "getCellHeight",
-    "getCellStyle",
-    "getCellBorder",
-  ];
-  private ctx = document.createElement("canvas").getContext("2d")!;
-
-  private styles: { [key: number]: Style } = {};
-  private borders: { [key: number]: Border } = {};
-  private nextId: number = 1;
-
-  // ---------------------------------------------------------------------------
-  // Command Handling
-  // ---------------------------------------------------------------------------
-
-  handle(cmd: Command) {
-    switch (cmd.type) {
-      case "SET_FORMATTING":
-        if (cmd.style) {
-          this.setStyle(cmd.sheet, cmd.target, cmd.style);
-        }
-        if (cmd.border) {
-          this.setBorder(cmd.sheet, cmd.target, cmd.border);
-        }
-        break;
-      case "CLEAR_FORMATTING":
-        this.clearFormatting(cmd.target);
-        break;
-      case "SET_FORMATTER":
-        this.setFormatter(cmd.sheet, cmd.target, cmd.formatter);
-        break;
-      case "SET_DECIMAL":
-        this.setDecimal(cmd.sheet, cmd.target, cmd.step);
-        break;
-      case "ADD_COLUMNS":
-        const start_col = cmd.position === "before" ? cmd.column - 1 : cmd.column;
-        const end_col = start_col + cmd.quantity + 1;
-        this.onAddElements(start_col, end_col, true, cmd.position === "before");
-        break;
-      case "ADD_ROWS":
-        const start_row = cmd.position === "before" ? cmd.row - 1 : cmd.row;
-        const end_row = start_row + cmd.quantity + 1;
-        this.onAddElements(start_row, end_row, false, cmd.position === "before");
-        break;
-    }
-  }
-
-  // ---------------------------------------------------------------------------
-  // Getters
-  // ---------------------------------------------------------------------------
-
-  getCellWidth(cell: Cell): number {
-    const styleId = cell.style || 0;
-    const text = this.getters.getCellText(cell);
-    return this.getTextWidth(text, styleId);
-  }
-
-  getTextWidth(text: string, styleId: number = 0): number {
-    const style = this.styles[styleId];
-    const italic = style.italic ? "italic " : "";
-    const weight = style.bold ? "bold" : DEFAULT_FONT_WEIGHT;
-    const sizeInPt = style.fontSize || DEFAULT_FONT_SIZE;
-    const size = fontSizeMap[sizeInPt];
-    this.ctx.font = `${italic}${weight} ${size}px ${DEFAULT_FONT}`;
-    return this.ctx.measureText(text).width;
-  }
-
-  getCellHeight(cell: Cell): number {
-    const style = this.styles[cell ? cell.style || 0 : 0];
-    const sizeInPt = style.fontSize || DEFAULT_FONT_SIZE;
-    return fontSizeMap[sizeInPt];
-  }
-
-  getCellStyle(cell: Cell): Style {
-    return cell.style ? this.styles[cell.style] : {};
-  }
-
-  getCellBorder(cell: Cell): Border | null {
-    return cell.border ? this.borders[cell.border] : null;
-  }
-
-  getCurrentStyle(): Style {
-    const cell = this.getters.getActiveCell();
-    return cell && cell.style ? this.styles[cell.style] : {};
-  }
-
-  // ---------------------------------------------------------------------------
-  // Styles
-  // ---------------------------------------------------------------------------
-
-  private setStyle(sheet: string, target: Zone[], style: Style) {
-    for (let zone of target) {
-      for (let col = zone.left; col <= zone.right; col++) {
-        for (let row = zone.top; row <= zone.bottom; row++) {
-          this.setStyleToCell(col, row, style);
-        }
-      }
-    }
-  }
-
-  private setStyleToCell(col: number, row: number, style) {
-    const cell = this.getters.getCell(col, row);
-    const currentStyle = cell && cell.style ? this.styles[cell.style] : {};
-    const nextStyle = Object.assign({}, currentStyle, style);
-    const id = this.registerStyle(nextStyle);
-    this.dispatch("UPDATE_CELL", {
-      sheet: this.workbook.activeSheet.id,
-      col,
-      row,
-      style: id,
-    });
-  }
-
-  private registerStyle(style) {
-    const strStyle = stringify(style);
-    for (let k in this.styles) {
-      if (stringify(this.styles[k]) === strStyle) {
-        return parseInt(k, 10);
-      }
-    }
-    const id = this.nextId++;
-    this.styles[id] = style;
-    return id;
-  }
-
-  // ---------------------------------------------------------------------------
-  // Borders
-  // ---------------------------------------------------------------------------
-
-  private setBorder(sheet: string, zones: Zone[], command: BorderCommand) {
-    // this object aggregate the desired final border command for a cell
-    const borderMap: { [xc: string]: number } = {};
-    for (let zone of zones) {
-      this.aggregateBorderCommands(sheet, zone, command, borderMap);
-    }
-    for (let [xc, borderId] of Object.entries(borderMap)) {
-      const [col, row] = toCartesian(xc);
-      const cell = this.getters.getCell(col, row);
-      const current = (cell && cell.border) || 0;
-      if (current !== borderId) {
-        this.dispatch("UPDATE_CELL", {
-          sheet: sheet,
-          col,
-          row,
-          border: borderId,
-        });
-      }
-    }
-  }
-
-  private aggregateBorderCommands(
-    sheet: string,
-    zone: Zone,
-    command: BorderCommand,
-    borderMap: { [xc: string]: number }
-  ) {
-    if (command === "clear") {
-      for (let row = zone.top; row <= zone.bottom; row++) {
-        for (let col = zone.left; col <= zone.right; col++) {
-          this.clearBorder(sheet, col, row, borderMap);
-        }
-      }
-      return;
-    }
-    if (command === "external") {
-      this.aggregateBorderCommands(sheet, zone, "left", borderMap);
-      this.aggregateBorderCommands(sheet, zone, "right", borderMap);
-      this.aggregateBorderCommands(sheet, zone, "top", borderMap);
-      this.aggregateBorderCommands(sheet, zone, "bottom", borderMap);
-      return;
-    }
-    if (command === "hv") {
-      this.aggregateBorderCommands(sheet, zone, "h", borderMap);
-      this.aggregateBorderCommands(sheet, zone, "v", borderMap);
-      return;
-    }
-    const { left, top, right, bottom } = zone;
-    if (command === "h") {
-      for (let r = top + 1; r <= bottom; r++) {
-        this.aggregateBorderCommands(sheet, { left, top: r, right, bottom: r }, "top", borderMap);
-      }
-      return;
-    }
-    if (command === "v") {
-      for (let c = left + 1; c <= right; c++) {
-        this.aggregateBorderCommands(sheet, { left: c, top, right: c, bottom }, "left", borderMap);
-      }
-      return;
-    }
-
-    const border: Border = {};
-    for (let side of commandToSides[command]) {
-      border[side] = ["thin", "#000"];
-    }
-
-    const target = getTargetZone(zone, command);
-    for (let row = target.top; row <= target.bottom; row++) {
-      for (let col = target.left; col <= target.right; col++) {
-        this.setBorderToMap(sheet, col, row, border, borderMap);
-      }
-    }
-  }
-
-  private clearBorder(
-    sheet: string,
-    col: number,
-    row: number,
-    borderMap: { [xc: string]: number }
-  ) {
-    const cell = this.getters.getCell(col, row);
-    const xc = cell ? cell.xc : toXC(col, row);
-    borderMap[xc] = 0;
-
-    if (col > 0) {
-      this.clearSide(sheet, col - 1, row, "right", borderMap);
-    }
-    if (row > 0) {
-      this.clearSide(sheet, col, row - 1, "bottom", borderMap);
-    }
-    if (col < this.workbook.activeSheet.cols.length - 1) {
-      this.clearSide(sheet, col + 1, row, "left", borderMap);
-    }
-    if (row < this.workbook.activeSheet.rows.length - 1) {
-      this.clearSide(sheet, col, row + 1, "top", borderMap);
-    }
-  }
-
-  private clearSide(
-    sheet: string,
-    col: number,
-    row: number,
-    side: string,
-    borderMap: { [xc: string]: number }
-  ) {
-    const cell = this.getters.getCell(col, row);
-    const xc = cell ? cell.xc : toXC(col, row);
-    const currentBorderId = xc in borderMap ? borderMap[xc] : cell && cell.border ? cell.border : 0;
-    const currentBorder = this.borders[currentBorderId] || {};
-    if (side in currentBorder) {
-      const newBorder = Object.assign({}, currentBorder);
-      delete newBorder[side];
-      borderMap[xc] = this.registerBorder(newBorder);
-    }
-  }
-
-  private setBorderToMap(
-    sheet: string,
-    col: number,
-    row: number,
-    border: Border,
-    borderMap: { [xc: string]: number }
-  ) {
-    const cell = this.getters.getCell(col, row);
-    const xc = cell ? cell.xc : toXC(col, row);
-    const currentBorderId = xc in borderMap ? borderMap[xc] : cell && cell.border ? cell.border : 0;
-    const currentBorder = this.borders[currentBorderId] || {};
-    const nextBorder = Object.assign({}, currentBorder, border);
-    const id = this.registerBorder(nextBorder);
-    borderMap[xc] = id;
-  }
-
-  private registerBorder(border: Border): number {
-    if (!Object.keys(border).length) {
-      return 0;
-    }
-    const strBorder = stringify(border);
-    for (let k in this.borders) {
-      if (stringify(this.borders[k]) === strBorder) {
-        return parseInt(k, 10);
-      }
-    }
-    const id = this.nextId++;
-    this.borders[id] = border;
-    return id;
-  }
-
-  // ---------------------------------------------------------------------------
-  // Clear formatting
-  // ---------------------------------------------------------------------------
-
-  /**
-   * Note that here, formatting refers to styles+border, not value formatters
-   */
-  private clearFormatting(zones: Zone[]) {
-    for (let zone of zones) {
-      for (let col = zone.left; col <= zone.right; col++) {
-        for (let row = zone.top; row <= zone.bottom; row++) {
-          this.dispatch("UPDATE_CELL", {
-            sheet: this.workbook.activeSheet.id,
-            col,
-            row,
-            style: 0,
-            border: 0,
-          });
-        }
-      }
-    }
-  }
-
-  // ---------------------------------------------------------------------------
-  // Formatters
-  // ---------------------------------------------------------------------------
-
-  private setFormatter(sheet: string, zones: Zone[], format: string) {
-    for (let zone of zones) {
-      for (let row = zone.top; row <= zone.bottom; row++) {
-        for (let col = zone.left; col <= zone.right; col++) {
-          this.dispatch("UPDATE_CELL", {
-            sheet,
-            col,
-            row,
-            format,
-          });
-        }
-      }
-    }
-  }
-
-  /**
-   * This function allows to adjust the quantity of decimal places after a decimal
-   * point on cells containing number value. It does this by changing the cells
-   * format. Values aren't modified.
-   *
-   * The change of the decimal quantity is done one by one, the sign of the step
-   * variable indicates whether we are increasing or decreasing.
-   *
-   * If several cells are in the zone, the format resulting from the change of the
-   * first cell (with number type) will be applied to the whole zone.
-   */
-  private setDecimal(sheet: string, zones: Zone[], step: number) {
-    // Find the first cell with a number value and get the format
-    const numberFormat = this.searchNumberFormat(zones);
-    if (numberFormat !== undefined) {
-      // Depending on the step sign, increase or decrease the decimal representation
-      // of the format
-      const newFormat = this.changeDecimalFormat(numberFormat, step);
-      // Aply the new format on the whole zone
-      this.setFormatter(sheet, zones, newFormat!);
-    }
-  }
-
-  /**
-   * Take a range of cells and return the format of the first cell containing a
-   * number value. Returns a default format if the cell hasn't format. Returns
-   * undefined if no number value in the range.
-   */
-  private searchNumberFormat(zones: Zone[]): string | undefined {
-    for (let zone of zones) {
-      for (let row = zone.top; row <= zone.bottom; row++) {
-        for (let col = zone.left; col <= zone.right; col++) {
-          const cell = this.getters.getCell(col, row);
-          if (
-            cell &&
-            (cell.type === "number" || (cell.type === "formula" && typeof cell.value === "number"))
-          ) {
-            return cell.format || this.setDefaultNumberFormat(cell.value);
-          }
-        }
-      }
-    }
-    return undefined;
-  }
-
-  /**
-   * Function used to give the default format of a cell with a number for value.
-   * It is considered that the default format of a number is 0 followed by as many
-   * 0 as there are decimal places.
-   *
-   * Exemple:
-   * - 1 --> '0'
-   * - 123 --> '0'
-   * - 12345 --> '0'
-   * - 42.1 --> '0.0'
-   * - 456.0001 --> '0.0000'
-   */
-  private setDefaultNumberFormat(cellValue: number): string {
-    const strValue = cellValue.toString();
-    const parts = strValue.split(".");
-    if (parts.length === 1) {
-      return "0";
-    }
-    return "0." + Array(parts[1].length + 1).join("0");
-  }
-
-  /**
-   * This function take a cell format representation and return a new format representtion
-   * with more or lesse decimal places.
-   *
-   * If the format doesn't look like a digital format (means that not contain '0')
-   * or if this one cannot be increased or decreased, the returned format will be
-   * the same.
-   *
-   * This function aims to work with all possible formats as well as custom formats.
-   *
-   * Examples of format changed by this function:
-   * - "0" (step = 1) --> "0.0"
-   * - "0.000%" (step = 1) --> "0.0000%"
-   * - "0.00" (step = -1) --> "0.0"
-   * - "0%" (step = -1) --> "0%"
-   * - "#,##0.0" (step = -1) --> "#,##0"
-   * - "#,##0;0.0%;0.000" (step = 1) --> "#,##0.0;0.00%;0.0000"
-   */
-  private changeDecimalFormat(format: string, step: number): string {
-    const sign = Math.sign(step);
-    // According to the representation of the cell format. A format can contain
-    // up to 4 sub-formats which can be applied depending on the value of the cell
-    // (among positive / negative / zero / text), each of these sub-format is separated
-    // by ';' in the format. We need to make the change on each sub-format.
-    const subFormats = format.split(";");
-    let newSubFormats: string[] = [];
-
-    for (let subFormat of subFormats) {
-      const decimalPointPosition = subFormat.indexOf(".");
-      const exponentPosition = subFormat.toUpperCase().indexOf("E");
-      let newSubFormat: string;
-
-      // the 1st step is to find the part of the zeros located before the
-      // exponent (when existed)
-      const subPart = exponentPosition > -1 ? subFormat.slice(0, exponentPosition) : subFormat;
-      const zerosAfterDecimal =
-        decimalPointPosition > -1 ? subPart.slice(decimalPointPosition).match(/0/g)!.length : 0;
-
-      // the 2nd step is to add (or remove) zero after the last zeros obtained in
-      // step 1
-      const lastZeroPosition = subPart.lastIndexOf("0");
-      if (lastZeroPosition > -1) {
-        if (sign > 0) {
-          // in this case we want to add decimal information
-          if (zerosAfterDecimal < maximumDecimalPlaces) {
-            newSubFormat =
-              subFormat.slice(0, lastZeroPosition + 1) +
-              (zerosAfterDecimal === 0 ? ".0" : "0") +
-              subFormat.slice(lastZeroPosition + 1);
-          } else {
-            newSubFormat = subFormat;
-          }
-        } else {
-          // in this case we want to remove decimal information
-          if (zerosAfterDecimal > 0) {
-            // remove last zero
-            newSubFormat =
-              subFormat.slice(0, lastZeroPosition) + subFormat.slice(lastZeroPosition + 1);
-            // if a zero always exist after decimal point else remove decimal point
-            if (zerosAfterDecimal === 1) {
-              newSubFormat =
-                newSubFormat.slice(0, decimalPointPosition) +
-                newSubFormat.slice(decimalPointPosition + 1);
-            }
-          } else {
-            // zero after decimal isn't present, we can't remove zero
-            newSubFormat = subFormat;
-          }
-        }
-      } else {
-        // no zeros are present in this format, we do nothing
-        newSubFormat = subFormat;
-      }
-      newSubFormats.push(newSubFormat);
-    }
-    return newSubFormats.join(";");
-  }
-
-  // ---------------------------------------------------------------------------
-  // Grid Manipulation
-  // ---------------------------------------------------------------------------
-
-  /**
-   * This function computes the style/border of a row/col based on the neighbours.
-   *
-   * @param index the index of the row/col of which we will change the style
-   * @param isColumn true if element is a column, false if row
-   * @param upper true if the style of the upper row/col should be used, false, if the lower should be used
-   */
-  private onAddElements(start: number, end: number, isColumn: boolean, upper: boolean) {
-    const length = isColumn
-      ? this.workbook.activeSheet.rows.length
-      : this.workbook.activeSheet.cols.length;
-    const index = start + 1;
-    for (let x = 0; x < length; x++) {
-      const xc = isColumn ? toXC(index, x) : toXC(x, index);
-      if (this.getters.isInMerge(xc)) {
-        continue;
-      }
-      const format: FormatInfo = {};
-      let lowerFormat: FormatInfo = isColumn
-        ? this.getFormat(toXC(start, x))
-        : this.getFormat(toXC(x, start));
-      let upperFormat: FormatInfo = isColumn
-        ? this.getFormat(toXC(end, x))
-        : this.getFormat(toXC(x, end));
-      if (upper) {
-        if (upperFormat.style) {
-          format["style"] = upperFormat.style;
-        }
-        if (upperFormat.format) {
-          format["format"] = upperFormat.format;
-        }
-      } else {
-        if (lowerFormat.style) {
-          format["style"] = lowerFormat.style;
-        }
-        if (lowerFormat.format) {
-          format["format"] = lowerFormat.format;
-        }
-      }
-      if (upperFormat.border && upperFormat.border === lowerFormat.border) {
-        format["border"] = upperFormat.border;
-      }
-      if (Object.keys(format).length !== 0) {
-        for (let i = index; i < end; i++) {
-          this.dispatch("UPDATE_CELL", {
-            sheet: this.workbook.activeSheet.id,
-            col: isColumn ? i : x,
-            row: isColumn ? x : i,
-            style: format.style,
-            border: format.border,
-            format: format.format,
-          });
-        }
-      }
-    }
-  }
-
-  /**
-   * gets the currently used style/border of a cell based on it's coordinates
-   *
-   * @param x column number of a cell
-   * @param y row number of a cell
-   */
-  private getFormat(xc: string): FormatInfo {
-    const format: FormatInfo = {};
-    xc = this.getters.getMainCell(xc);
-    if (xc in this.workbook.activeSheet.cells) {
-      if (this.workbook.activeSheet.cells[xc].border) {
-        format["border"] = this.workbook.activeSheet.cells[xc].border;
-      }
-      if (this.workbook.activeSheet.cells[xc].style) {
-        format["style"] = this.workbook.activeSheet.cells[xc].style;
-      }
-      if (this.workbook.activeSheet.cells[xc].format) {
-        format["format"] = this.workbook.activeSheet.cells[xc].format;
-      }
-    }
-    return format;
-  }
-
-  // ---------------------------------------------------------------------------
-  // Import/Export
-  // ---------------------------------------------------------------------------
-
-  import(data: WorkbookData) {
-    if (data.styles) {
-      this.styles = data.styles;
-    }
-    this.styles[0] = Object.assign({}, DEFAULT_STYLE, this.styles[0]);
-    if (data.borders) {
-      this.borders = data.borders;
-    }
-    let nextId = 1;
-    for (let k in this.styles) {
-      nextId = Math.max(k as any, nextId);
-    }
-    for (let k in this.borders) {
-      nextId = Math.max(k as any, nextId);
-    }
-    this.nextId = nextId + 1;
-  }
-
-  export(data: WorkbookData) {
-    data.styles = this.styles;
-    data.borders = this.borders;
-  }
-}