Skip to content

Commit

Permalink
refactoring utils (#6348)
Browse files Browse the repository at this point in the history
Co-authored-by: OlgaLarina <[email protected]>
  • Loading branch information
OlgaLarina and OlgaLarina authored Dec 27, 2024
1 parent 885389d commit 8bf9561
Show file tree
Hide file tree
Showing 31 changed files with 463 additions and 447 deletions.
2 changes: 1 addition & 1 deletion packages/survey-creator-core/src/components/item-value.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { SurveyCreatorModel } from "../creator-base";
import { DragDropChoices } from "survey-core";
require("./item-value.scss");
import { getLocString } from "../editorLocalization";
import { getNextItemText } from "../utils/utils";
import { getNextItemText } from "../utils/creator-utils";
import { ICollectionItemAllowOperations } from "../creator-settings";
import { StringEditorConnector } from "./string-editor";

Expand Down
2 changes: 1 addition & 1 deletion packages/survey-creator-core/src/components/matrix-cell.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import {
} from "survey-core";
import { defaultV2Css } from "survey-core";
import { SurveyCreatorModel } from "../creator-base";
import { toggleHovered } from "../utils/utils";
import { toggleHovered } from "../utils/html-element-utils";
import { SurveyHelper } from "../survey-helper";
import { editorLocalization } from "../editorLocalization";

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
} from "survey-core";
import { SurveyCreatorModel } from "../creator-base";
import { getLocString } from "../editorLocalization";
import { getNextValue, getQuestionFromObj } from "../utils/utils";
import { getNextValue, getQuestionFromObj } from "../utils/creator-utils";

require("./question-rating.scss");

Expand Down
3 changes: 1 addition & 2 deletions packages/survey-creator-core/src/components/question.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,7 @@ import { IPortableDragEvent, IPortableEvent, IPortableMouseEvent } from "../util
import {
isPropertyVisible,
propertyExists,
toggleHovered
} from "../utils/utils";
} from "../utils/creator-utils";
import { SurveyElementActionContainer, SurveyElementAdornerBase } from "./action-container-view-model";
require("./question.scss");
import { settings } from "../creator-settings";
Expand Down
5 changes: 3 additions & 2 deletions packages/survey-creator-core/src/components/string-editor.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import { Base, LocalizableString, Serializer, JsonObjectProperty, property, ItemValue, ComputedUpdater, sanitizeEditableContent, Event as SurveyEvent, Question, QuestionMultipleTextModel, MultipleTextItemModel, QuestionMatrixBaseModel, QuestionMatrixModel, QuestionMatrixDropdownModel, MatrixDropdownColumn, QuestionMatrixDynamicModel, QuestionSelectBase, QuestionImagePickerModel, EventBase, CharacterCounter, CssClassBuilder } from "survey-core";
import { SurveyCreatorModel } from "../creator-base";
import { editorLocalization } from "../editorLocalization";
import { clearNewLines, getNextValue, select } from "../utils/utils";
import { clearNewLines } from "../utils/utils";
import { getNextItemValue, getNextValue } from "../utils/creator-utils";
import { select } from "../utils/html-element-utils";
import { ItemValueWrapperViewModel } from "./item-value";
import { QuestionAdornerViewModel } from "./question";
import { QuestionRatingAdornerViewModel } from "./question-rating";
import { getNextItemValue } from "../utils/utils";

export abstract class StringItemsNavigatorBase {
constructor(protected question: any) { }
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { Base, property, ListModel, Action, ComputedUpdater } from "survey-core"
import { SurveyCreatorModel } from "../../creator-base";
import { ICreatorPlugin } from "../../creator-settings";
import { SurveyTextWorker, SurveyTextWorkerError } from "../../textWorker";
import { saveToFileHandler } from "../../utils/utils";
import { saveToFileHandler } from "../../utils/html-element-utils";
import { settings } from "../../creator-settings";

const maxErrorLength = 150;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@ import { SurveyLogicType, getLogicString } from "./logic-types";
import { editorLocalization } from "../../editorLocalization";
import { SurveyHelper } from "../../survey-helper";
import { logicCss } from "./logic-theme";
import { assignDefaultV2Classes, copyCssClasses } from "../../utils/utils";
import { copyCssClasses } from "../../utils/utils";
import { assignDefaultV2Classes } from "../../utils/creator-utils";
import { QuestionLinkValueModel } from "../../components/link-value";
import { LogicActionModelBase, LogicActionModel, LogicActionTriggerModel } from "./logic-actions-model";
import { propertyGridCss } from "../../property-grid-theme/property-grid";
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { ExpressionRemoveVariable } from "../../expressionToDisplayText";
import { updateLogicExpression } from "./logic-expression";
import { SurveyLogicType, getLogicString } from "./logic-types";
import { settings } from "../../creator-settings";
import { wrapTextByCurlyBraces } from "../../utils/utils";
import { wrapTextByCurlyBraces } from "../../utils/creator-utils";
import { SurveyHelper } from "../../survey-helper";

export class SurveyLogicAction {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
import { editorLocalization } from "../../editorLocalization";
import { ExpressionToDisplayText } from "../../expressionToDisplayText";
import { ISurveyCreatorOptions } from "../../creator-settings";
import { wrapTextByCurlyBraces } from "../../utils/utils";
import { wrapTextByCurlyBraces } from "../../utils/creator-utils";

export function getLogicString(name: string) {
return editorLocalization.getString("ed.lg." + name);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { ComponentCollection, Question, QuestionCompositeModel, Serializer } from "survey-core";
import { getLocString } from "../../../editorLocalization";
import { ingectAlpha, parseColor, parseRgbaFromString } from "../../../utils/utils";
import { ingectAlpha, parseColor, parseRgbaFromString } from "../../../utils/color-utils";
function getElementsJSON() {
return [
{
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ import { backgroundCornerRadiusFromCssVariable, backgroundCornerRadiusToCssVaria
import { createBoxShadowReset, trimBoxShadowValue } from "./theme-custom-questions/shadow-effects";
import { HeaderModel } from "./header-model";
import * as LibraryThemes from "survey-core/themes";
import { ColorCalculator, assign, ingectAlpha, parseColor, roundTo2Decimals } from "../../utils/utils";
import { assign, roundTo2Decimals } from "../../utils/utils";
import { ColorCalculator, ingectAlpha, parseColor } from "../../utils/color-utils";
import { UndoRedoManager } from "../../plugins/undo-redo/undo-redo-manager";
import { updateCustomQuestionJSONs } from "./theme-custom-questions";
import { SurveyCreatorModel } from "../../creator-base";
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@ import { editorLocalization, getLocString } from "../../editorLocalization";
import { ThemeTabViewModel } from "./theme-builder";
import { SidebarPageModel } from "../side-bar/side-bar-page-model";
import { getPredefinedColorsItemValues, PredefinedColors, PredefinedThemes, Themes } from "./themes";
import { assign, notShortCircuitAnd, saveToFileHandler } from "../../utils/utils";
import { assign, notShortCircuitAnd } from "../../utils/utils";
import { saveToFileHandler } from "../../utils/html-element-utils";
import { PropertyGridModel } from "../../property-grid";
import { PropertyGridViewModel } from "../../property-grid/property-grid-view-model";
import { ThemeModel, findSuitableTheme, getThemeChanges, getThemeFullName, isThemeEmpty } from "./theme-model";
Expand Down
3 changes: 2 additions & 1 deletion packages/survey-creator-core/src/creator-base.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,8 @@ import { IsTouch } from "survey-core";
import { QuestionConverter } from "./questionconverter";
import { SurveyTextWorker } from "./textWorker";
import { QuestionToolbox, QuestionToolboxItem } from "./toolbox";
import { getNextItemValue, getNextItemText, assign } from "./utils/utils";
import { assign } from "./utils/utils";
import { getNextItemValue, getNextItemText } from "./utils/creator-utils";
import { PropertyGridModel } from "./property-grid";
import { ObjType, SurveyHelper } from "./survey-helper";
import { ICreatorSelectionOwner } from "./selection-owner";
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { Serializer, Base, property, ArrayChanges, EventBase, ILoadFromJSONOptions, ISaveToJSONOptions } from "survey-core";
import { getLocString } from "../editorLocalization";
import { assign, roundTo2Decimals, ColorCalculator, colorsAreEqual } from "../utils/utils";
import { assign, roundTo2Decimals } from "../utils/utils";
import { ColorCalculator, colorsAreEqual } from "../utils/color-utils";
import { CreatorThemes, ICreatorTheme, PredefinedCreatorThemes } from "./creator-themes";
import * as Themes from "survey-creator-core/themes";
import { PredefinedBackgroundColors, PredefinedColors } from "../components/tabs/themes";
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Action, ComputedUpdater, CssClassBuilder, IAction, IsTouch, ItemValue, ListModel, PopupModel, QuestionFactory, QuestionTextModel, Serializer, createDropdownActionModel, createDropdownActionModelAdvanced, property, propertyArray } from "survey-core";
import { parseColor } from "../utils/utils";
import { parseColor } from "../utils/color-utils";
import { listComponentCss } from "../components/list-theme";

const DEFAULT_COLOR: string = "#000000";
Expand Down
3 changes: 3 additions & 0 deletions packages/survey-creator-core/src/entries/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,9 @@ export * from "../components/side-bar/tab-control-model";
export * from "../components/switcher/switcher";
export * from "../utils/events";
export * from "../utils/utils";
export * from "../utils/html-element-utils";
export * from "../utils/color-utils";
export * from "../utils/creator-utils";
export { MenuButton } from "../utils/actions";
export * from "../question-editor/definition";
export * from "../question-editor/properties";
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import * as Survey from "survey-core";
import { editorLocalization } from "./editorLocalization";
import { wrapTextByCurlyBraces } from "./utils/utils";
import { wrapTextByCurlyBraces } from "./utils/creator-utils";

export class ExpressionToDisplayText {
private currentQuestion: Survey.Question;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { ISurveyCreatorOptions, settings } from "../creator-settings";
import { editorLocalization } from "../editorLocalization";
import { SurveyHelper } from "../survey-helper";
import { PropertyEditorSetupValue } from "./index";
import { assignDefaultV2Classes, wrapTextByCurlyBraces } from "../utils/utils";
import { assignDefaultV2Classes, wrapTextByCurlyBraces } from "../utils/creator-utils";
import { logicCss } from "../components/tabs/logic-theme";
import { getLogicString } from "../components/tabs/logic-types";
import { CreatorBase } from "../creator-base";
Expand Down
2 changes: 1 addition & 1 deletion packages/survey-creator-core/src/property-grid/matrices.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { Base, ComputedUpdater, IAction, ISurveyData, ItemValue, JsonMetadata, J
import { editorLocalization } from "../editorLocalization";
import { SurveyQuestionProperties } from "../question-editor/properties";
import { ISurveyCreatorOptions, settings } from "../creator-settings";
import { getAcceptedTypesByContentMode, getNextItemText, getNextValue, getQuestionFromObj } from "../utils/utils";
import { getNextItemText, getNextValue, getQuestionFromObj } from "../utils/creator-utils";
import { FastEntryEditor, FastEntryEditorBase } from "./fast-entry";
import {
IPropertyEditorSetup,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { Action, ComputedUpdater, IElement, Question, SurveyModel, property, settings } from "survey-core";
import { getLocString } from "../editorLocalization";
import { scrollElementIntoView } from "../utils/utils";
import { scrollElementIntoView } from "../utils/creator-utils";
import { SearchManager } from "../components/search-manager";
export class SearchManagerPropertyGrid extends SearchManager {
private highlightedEditorClass = " spg-question--highlighted";
Expand Down
2 changes: 1 addition & 1 deletion packages/survey-creator-core/src/survey-helper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {
} from "survey-core";
import { editorLocalization } from "./editorLocalization";
import { ISurveyCreatorOptions } from "./creator-settings";
import { wrapTextByCurlyBraces } from "./utils/utils";
import { wrapTextByCurlyBraces } from "./utils/creator-utils";

export enum ObjType {
Unknown = "unknown",
Expand Down
118 changes: 118 additions & 0 deletions packages/survey-creator-core/src/utils/color-utils.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
import { roundTo2Decimals } from "./utils";

export class ColorCalculator {
colorSettings = { baseColorAlpha: 1, darkColorAlpha: 1, lightColorAlpha: 1, deltaDarkColor: 0, deltaLightColor: 0, newColorLight: "", newColorDark: "" };

initialize(baseColor: string, lightColor: string, darkColor: string) {
let primaryColorRgba = parseRgbaFromString(baseColor);
if (primaryColorRgba.length === 0) {
primaryColorRgba = parseRgbaFromString(ingectAlpha(baseColor, 1));
}
let primaryColorDarkRgba = parseRgbaFromString(darkColor);
if (primaryColorDarkRgba.length === 0) {
primaryColorDarkRgba = parseRgbaFromString(ingectAlpha(darkColor, 1));
}
let primaryColorLightRgba = parseRgbaFromString(lightColor);
if (primaryColorLightRgba.length === 0) {
primaryColorLightRgba = parseRgbaFromString(ingectAlpha(lightColor, 1));
}
this.colorSettings.baseColorAlpha = primaryColorRgba[3];
this.colorSettings.darkColorAlpha = primaryColorDarkRgba[3];
this.colorSettings.lightColorAlpha = primaryColorLightRgba[3];

const primaryColorHSB = RGBToHSB(primaryColorRgba[0], primaryColorRgba[1], primaryColorRgba[2]);
const primaryColorDarkHSB = RGBToHSB(primaryColorDarkRgba[0], primaryColorDarkRgba[1], primaryColorDarkRgba[2]);
const primaryColorLightHSB = RGBToHSB(primaryColorLightRgba[0], primaryColorLightRgba[1], primaryColorLightRgba[2]);

this.colorSettings.deltaDarkColor = primaryColorHSB[2] - primaryColorDarkHSB[2];
this.colorSettings.deltaLightColor = primaryColorHSB[2] - primaryColorLightHSB[2];
}

calculateColors(newColor: string) {
let newColorRbg = parseRgbaFromString(newColor);
if (newColorRbg.length === 0) {
newColorRbg = parseRgbaFromString(ingectAlpha(newColor, 1));
}
const newColorHsb = RGBToHSB(newColorRbg[0], newColorRbg[1], newColorRbg[2]);
const newPrimaryColorDarkRGB = HSBToRGB(newColorHsb[0], newColorHsb[1], newColorHsb[2] - this.colorSettings.deltaDarkColor);
const newPrimaryColorLightRGB = HSBToRGB(newColorHsb[0], newColorHsb[1], newColorHsb[2] - this.colorSettings.deltaLightColor);

this.colorSettings.newColorLight = convertRgbaToString(newPrimaryColorLightRGB, this.colorSettings.lightColorAlpha);
this.colorSettings.newColorDark = convertRgbaToString(newPrimaryColorDarkRGB, this.colorSettings.darkColorAlpha);
}
}

export function ingectAlpha(baseColor: any, alpha: number): any {
if (!!baseColor && alpha !== undefined) {
const rgbValue = HEXToRGB(baseColor);
return `rgba(${rgbValue[0]}, ${rgbValue[1]}, ${rgbValue[2]}, ${rgbValue[3] || alpha})`;
}
}

export function convertRgbaToString(rgbValues: Array<number>, alpha: number): string {
return `rgba(${rgbValues[0]}, ${rgbValues[1]}, ${rgbValues[2]}, ${alpha})`;
}

export function parseRgbaFromString(value: string = ""): Array<number> {
const matchRgb = value.match(/\((.*)\)/);
if (matchRgb) {
return matchRgb[1].split(",").map(i => parseFloat(i));
} else {
return [];
}
}

export function parseColor(value: string = ""): { color: string, opacity: number } {
const rgbValues = parseRgbaFromString(value);
if (rgbValues.length !== 0) {
let opacity = 1;
if (rgbValues.length == 4) {
opacity = rgbValues.pop();
}
const color = rgbValues.reduce((res: string, color: number) => {
const hex = color.toString(16);
return res + (hex.length == 1 ? "0" + hex : hex);
}, "#");
return { color, opacity: roundTo2Decimals(opacity * 100) };
}
else {
return { color: value, opacity: 100 };
}
}
export function HEXToRGB(baseColor: any): any {
if (!!baseColor) {
const r = parseInt(baseColor.slice(1, 3), 16);
const g = parseInt(baseColor.slice(3, 5), 16);
const b = parseInt(baseColor.slice(5, 7), 16);
const alpha = roundTo2Decimals(parseInt(baseColor.slice(7, 9), 16) / 255);

return [r, g, b, alpha];
}
return [];
}

export function HSBToRGB(h, s, b) {
s /= 100;
b /= 100;
const k = (n) => (n + h / 60) % 6;
const f = (n) => b * (1 - s * Math.max(0, Math.min(k(n), 4 - k(n), 1)));
return [Math.round(255 * f(5)), Math.round(255 * f(3)), Math.round(255 * f(1))];
}

export function RGBToHSB(r, g, b) {
r /= 255;
g /= 255;
b /= 255;
const v = Math.max(r, g, b),
n = v - Math.min(r, g, b);
const h = n === 0 ? 0 : n && v === r ? (g - b) / n : v === g ? 2 + (b - r) / n : 4 + (r - g) / n;
return [60 * (h < 0 ? h + 6 : h), v && (n / v) * 100, v * 100];
}

export function colorsAreEqual(color1: string, color2: string) {
const color1Value = parseColor(color1);
color1Value.color = color1Value.color.substring(0, 7).toUpperCase();
const color2Value = parseColor(color2);
color2Value.color = color2Value.color.substring(0, 7).toUpperCase();
return color1Value.color === color2Value.color && color1Value.opacity === color2Value.opacity;
}
Loading

0 comments on commit 8bf9561

Please sign in to comment.