diff --git a/.obsidian/plugins/obsidian-image-toolkit/main.js b/.obsidian/plugins/obsidian-image-toolkit/main.js index 40cc1f4..3324f2c 100644 --- a/.obsidian/plugins/obsidian-image-toolkit/main.js +++ b/.obsidian/plugins/obsidian-image-toolkit/main.js @@ -1,8 +1,9 @@ 'use strict'; var obsidian = require('obsidian'); +var crypto = require('crypto'); -/*! ***************************************************************************** +/****************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any @@ -42,13 +43,18 @@ var de = {}; // English var en = { // settings - IMAGE_TOOLKIT_SETTINGS_TITLE: "Image Toolkit Settings", + IMAGE_TOOLKIT_SETTINGS_TITLE: 'Image Toolkit Settings', + // >>>Common Settings: + COMMON_SETTINGS: 'Common Settings:', + VIEW_MODE_NAME: 'Choose a mode to view images', + VIEW_MODE_NORMAL: '🖼 Normal', + VIEW_MODE_PIN: '📌 Pin', // >>>View Trigger Settings: VIEW_TRIGGER_SETTINGS: 'View Trigger Settings:', VIEW_IMAGE_GLOBAL_NAME: 'Click and view an image globally', VIEW_IMAGE_GLOBAL_DESC: 'You can zoom, rotate, drag, and invert it on the popup layer when clicking an image.', - VIEW_IMAGE_EDITOR_NAME: 'Click and view an image in the Editor Area', - VIEW_IMAGE_EDITOR_DESC: 'Turn on this option if you want to click and view an image in the Editor Area.', + VIEW_IMAGE_IN_EDITOR_NAME: 'Click and view an image in the Editor Area', + VIEW_IMAGE_IN_EDITOR_DESC: 'Turn on this option if you want to click and view an image in the Editor Area.', // CPB = COMMUNITY_PLUGINS_BROWSER VIEW_IMAGE_IN_CPB_NAME: 'Click and view an image in the Community Plugins browser', VIEW_IMAGE_IN_CPB_DESC: 'Turn on this option if you want to click and view an image in the Community Plugins browser.', @@ -60,9 +66,10 @@ var en = { PIN_MODE_SETTINGS: "Pin Mode Settings:", PIN_MODE_NAME: "📌 Pin an image", PIN_MODE_DESC: "You can pin an image onto the top of the screen. And have more options by right click. (press Esc to close the image where your mouse cursor is hovering)", - PIN_MAXIMUM_NAME: "The maximum image you can pin", + PIN_MAXIMUM_NAME: "The maximum images you can pin", PIN_COVER_NAME: "Cover mode", PIN_COVER_DESC: "After those pinned images reach maximum, you can cover the earliest pinned image when you click an image once again.", + PIN_MAXIMUM_NOTICE: "Exceeded maximum images you can pin (non cover mode)", // >>>View Detail Settings: VIEW_DETAILS_SETTINGS: 'View Detail Settings:', IMAGE_MOVE_SPEED_NAME: 'Set the moving speed of the image', @@ -214,13 +221,18 @@ var tr = {}; // 简体中文 var zhCN = { // settings - IMAGE_TOOLKIT_SETTINGS_TITLE: "Image Toolkit 插件设置", + IMAGE_TOOLKIT_SETTINGS_TITLE: "Image Toolkit 设置", + // >>>Common Settings: + COMMON_SETTINGS: '通用设置:', + VIEW_MODE_NAME: '选择查看模式', + VIEW_MODE_NORMAL: '🖼 普通', + VIEW_MODE_PIN: '📌 贴图', // >>> 预览触发配置: VIEW_TRIGGER_SETTINGS: '预览触发配置:', VIEW_IMAGE_GLOBAL_NAME: '支持全局预览图片', VIEW_IMAGE_GLOBAL_DESC: '开启后,在任何地方点击图片都可以弹出预览界面,可对图片进行缩放、旋转、拖动、和反色等。', - VIEW_IMAGE_EDITOR_NAME: '支持在编辑区域预览图片', - VIEW_IMAGE_EDITOR_DESC: '开启后,支持在编辑区域,点击图片预览。', + VIEW_IMAGE_IN_EDITOR_NAME: '支持在编辑区域预览图片', + VIEW_IMAGE_IN_EDITOR_DESC: '开启后,支持在编辑区域,点击图片预览。', // CPB = COMMUNITY_PLUGINS_BROWSER VIEW_IMAGE_IN_CPB_NAME: '支持在社区插件页面预览图片', VIEW_IMAGE_IN_CPB_DESC: '开启后,支持在社区插件页面,点击图片预览。', @@ -235,6 +247,7 @@ var zhCN = { PIN_MAXIMUM_NAME: "最大贴图数量", PIN_COVER_NAME: "覆盖模式", PIN_COVER_DESC: "当贴图数量达到最大值后,此时再次点击图片,该图片会覆盖最早弹出的那个贴图。", + PIN_MAXIMUM_NOTICE: "超过最大Pin图设置(非覆盖模式)", // >>>查看细节设置: VIEW_DETAILS_SETTINGS: '查看细节设置:', IMAGE_MOVE_SPEED_NAME: '图片移动速度设置', @@ -373,11 +386,33 @@ const localeMap = { const locale = localeMap[obsidian.moment.locale()]; function t(str) { if (!locale) { - console.error("Error: Image toolkit locale not found", obsidian.moment.locale()); + console.error("[oit] Image toolkit locale not found", obsidian.moment.locale()); } return (locale && locale[str]) || en[str]; } +var ViewMode; +(function (ViewMode) { + ViewMode["Normal"] = "Normal"; + ViewMode["Pin"] = "Pin"; +})(ViewMode || (ViewMode = {})); +const DEFAULT_VIEW_MODE = ViewMode.Normal; +const OIT_CLASS = { + CONTAINER_ROOT: 'oit', + CONTAINER_NORMAL: 'oit-normal', + CONTAINER_PIN: 'oit-pin', + // the place for storing images + IMG_CONTAINER: 'oit-img-container', + IMG_VIEW: 'oit-img-view', + IMG_TTP: 'oit-img-tip', + IMG_FOOTER: 'oit-img-footer', + IMG_TITLE: 'oit-img-title', + IMG_TITLE_NAME: 'oit-img-title-name', + IMG_TITLE_INDEX: 'oit-img-title-index', + IMG_TOOLBAR: 'oit-img-toolbar', + IMG_PLAYER: 'img-player', + IMG_FULLSCREEN: 'img-fullscreen', +}; const ZOOM_FACTOR = 0.8; const IMG_VIEW_MIN = 30; const ICONS = [{ @@ -483,8 +518,8 @@ const IMG_FULL_SCREEN_MODE = { const VIEW_IMG_SELECTOR = { EDITOR_AREAS: `.workspace-leaf-content[data-type='markdown'] img,.workspace-leaf-content[data-type='image'] img`, EDITOR_AREAS_NO_LINK: `.workspace-leaf-content[data-type='markdown'] img:not(a img),.workspace-leaf-content[data-type='image'] img:not(a img)`, - CPB: `.community-plugin-readme img`, - CPB_NO_LINK: `.community-plugin-readme img:not(a img)`, + CPB: `.community-modal-details img`, + CPB_NO_LINK: `.community-modal-details img:not(a img)`, OTHER: `#sr-flashcard-view img`, OTHER_NO_LINK: `#sr-flashcard-view img:not(a img)`, }; @@ -570,11 +605,12 @@ var pickr_min = createCommonjsModule(function (module, exports) { var Pickr = /*@__PURE__*/getDefaultExportFromCjs(pickr_min); const DEFAULT_SETTINGS = { - viewImageEditor: true, + viewMode: ViewMode.Normal, + viewImageInEditor: true, viewImageInCPB: true, - viewImageWithALink: true, + viewImageWithLink: true, viewImageOther: true, - pinMode: false, + // pinMode: false, pinMaximum: 3, pinCoverMode: true, imageMoveSpeed: 10, @@ -605,93 +641,12 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab { let { containerEl } = this; containerEl.empty(); containerEl.createEl('h2', { text: t("IMAGE_TOOLKIT_SETTINGS_TITLE") }); - //region >>> VIEW_TRIGGER_SETTINGS - containerEl.createEl('h3', { text: t("VIEW_TRIGGER_SETTINGS") }); - new obsidian.Setting(containerEl) - .setName(t("VIEW_IMAGE_EDITOR_NAME")) - .setDesc(t("VIEW_IMAGE_EDITOR_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.viewImageEditor) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.viewImageEditor = value; - this.plugin.toggleViewImage(); - yield this.plugin.saveSettings(); - }))); - new obsidian.Setting(containerEl) - .setName(t("VIEW_IMAGE_IN_CPB_NAME")) - .setDesc(t("VIEW_IMAGE_IN_CPB_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.viewImageInCPB) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.viewImageInCPB = value; - this.plugin.toggleViewImage(); - yield this.plugin.saveSettings(); - }))); - new obsidian.Setting(containerEl) - .setName(t("VIEW_IMAGE_WITH_A_LINK_NAME")) - .setDesc(t("VIEW_IMAGE_WITH_A_LINK_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.viewImageWithALink) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.viewImageWithALink = value; - this.plugin.toggleViewImage(); - yield this.plugin.saveSettings(); - }))); - new obsidian.Setting(containerEl) - .setName(t("VIEW_IMAGE_OTHER_NAME")) - .setDesc(t("VIEW_IMAGE_OTHER_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.viewImageOther) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.viewImageOther = value; - this.plugin.toggleViewImage(); - yield this.plugin.saveSettings(); - }))); - //endregion - //region >>> PIN_MODE_SETTINGS - let pinMaximumSetting, pinCoverSetting; - containerEl.createEl('h3', { text: t("PIN_MODE_SETTINGS") }); - new obsidian.Setting(containerEl) - .setName(t("PIN_MODE_NAME")) - .setDesc(t("PIN_MODE_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.pinMode) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.pinMode = value; - this.switchSettingsDisabled(!value, pinMaximumSetting, pinCoverSetting); - this.plugin.togglePinMode(value); - yield this.plugin.saveSettings(); - }))); - let pinMaximumScaleText; - pinMaximumSetting = new obsidian.Setting(containerEl) - .setName(t("PIN_MAXIMUM_NAME")) - .addSlider(slider => slider - .setLimits(1, 5, 1) - .setValue(this.plugin.settings.pinMaximum) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - var _a; - pinMaximumScaleText.innerText = " " + value.toString(); - this.plugin.settings.pinMaximum = value; - (_a = this.plugin.containerView) === null || _a === void 0 ? void 0 : _a.setPinMaximum(value); - this.plugin.saveSettings(); - }))); - pinMaximumSetting.settingEl.createDiv('', (el) => { - pinMaximumScaleText = el; - el.style.minWidth = "2.3em"; - el.style.textAlign = "right"; - el.innerText = " " + this.plugin.settings.pinMaximum.toString(); - }); - pinCoverSetting = new obsidian.Setting(containerEl) - .setName(t("PIN_COVER_NAME")) - .setDesc(t("PIN_COVER_DESC")) - .addToggle(toggle => toggle - .setValue(this.plugin.settings.pinCoverMode) - .onChange((value) => __awaiter(this, void 0, void 0, function* () { - this.plugin.settings.pinCoverMode = value; - yield this.plugin.saveSettings(); - }))); - this.switchSettingsDisabled(!this.plugin.settings.pinMode, pinMaximumSetting, pinCoverSetting); - //endregion + // Common Settings: + this.displayCommonSettings(containerEl); + // View Trigger Settings: + this.displayViewTriggerSettings(containerEl); + // Pin Mode Settings: + this.displayPinModeSettings(containerEl); //region >>> VIEW_DETAILS_SETTINGS containerEl.createEl('h3', { text: t("VIEW_DETAILS_SETTINGS") }); let imgMoveSpeedScaleText; @@ -895,6 +850,109 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab { })); //endregion } + displayCommonSettings(containerEl) { + containerEl.createEl('h3', { text: t('COMMON_SETTINGS') }); + new obsidian.Setting(containerEl) + .setName(t("VIEW_MODE_NAME")) + .addDropdown((dropdown) => __awaiter(this, void 0, void 0, function* () { + for (const key in ViewMode) { + // @ts-ignore + dropdown.addOption(key, t('VIEW_MODE_' + key.toUpperCase())); + } + dropdown.setValue(this.plugin.settings.viewMode); + dropdown.onChange((option) => __awaiter(this, void 0, void 0, function* () { + yield this.plugin.switchViewMode(option); + })); + })); + } + displayViewTriggerSettings(containerEl) { + containerEl.createEl('h3', { text: t("VIEW_TRIGGER_SETTINGS") }); + new obsidian.Setting(containerEl) + .setName(t("VIEW_IMAGE_IN_EDITOR_NAME")) + .setDesc(t("VIEW_IMAGE_IN_EDITOR_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.viewImageInEditor) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + this.plugin.settings.viewImageInEditor = value; + this.plugin.refreshViewTrigger(); + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName(t("VIEW_IMAGE_IN_CPB_NAME")) + .setDesc(t("VIEW_IMAGE_IN_CPB_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.viewImageInCPB) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + this.plugin.settings.viewImageInCPB = value; + this.plugin.refreshViewTrigger(); + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName(t("VIEW_IMAGE_WITH_A_LINK_NAME")) + .setDesc(t("VIEW_IMAGE_WITH_A_LINK_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.viewImageWithLink) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + this.plugin.settings.viewImageWithLink = value; + this.plugin.refreshViewTrigger(); + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName(t("VIEW_IMAGE_OTHER_NAME")) + .setDesc(t("VIEW_IMAGE_OTHER_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.viewImageOther) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + this.plugin.settings.viewImageOther = value; + this.plugin.refreshViewTrigger(); + yield this.plugin.saveSettings(); + }))); + } + displayPinModeSettings(containerEl) { + //region >>> PIN_MODE_SETTINGS + let pinMaximumSetting; + containerEl.createEl('h3', { text: t("PIN_MODE_SETTINGS") }); + /*new Setting(containerEl) + .setName(t("PIN_MODE_NAME")) + .setDesc(t("PIN_MODE_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.pinMode) + .onChange(async (value) => { + this.plugin.settings.pinMode = value; + this.switchSettingsDisabled(!value, pinMaximumSetting, pinCoverSetting); + //this.plugin.togglePinMode(value); + await this.plugin.saveSettings(); + }));*/ + let pinMaximumScaleText; + pinMaximumSetting = new obsidian.Setting(containerEl) + .setName(t("PIN_MAXIMUM_NAME")) + .addSlider(slider => slider + .setLimits(1, 5, 1) + .setValue(this.plugin.settings.pinMaximum) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + pinMaximumScaleText.innerText = " " + value.toString(); + this.plugin.settings.pinMaximum = value; + // this.plugin.containerView?.setPinMaximum(value); + this.plugin.saveSettings(); + }))); + pinMaximumSetting.settingEl.createDiv('', (el) => { + pinMaximumScaleText = el; + el.style.minWidth = "2.3em"; + el.style.textAlign = "right"; + el.innerText = " " + this.plugin.settings.pinMaximum.toString(); + }); + new obsidian.Setting(containerEl) + .setName(t("PIN_COVER_NAME")) + .setDesc(t("PIN_COVER_DESC")) + .addToggle(toggle => toggle + .setValue(this.plugin.settings.pinCoverMode) + .onChange((value) => __awaiter(this, void 0, void 0, function* () { + this.plugin.settings.pinCoverMode = value; + yield this.plugin.saveSettings(); + }))); + //this.switchSettingsDisabled(!this.plugin.settings.pinMode, pinMaximumSetting, pinCoverSetting); + //endregion + } switchSettingsDisabled(disabled, ...settings) { for (const setting of settings) { setting === null || setting === void 0 ? void 0 : setting.setDisabled(disabled); @@ -971,7 +1029,6 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab { }); } setAndSavePickrSetting(name, savedColor) { - var _a; if ('GALLERY_NAVBAR_DEFAULT_COLOR_NAME' === name) { this.plugin.settings.galleryNavbarDefaultColor = savedColor; } @@ -983,7 +1040,10 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab { } else if ('IMG_VIEW_BACKGROUND_COLOR_NAME' === name) { this.plugin.settings.imgViewBackgroundColor = savedColor; - (_a = this.plugin.containerView) === null || _a === void 0 ? void 0 : _a.setImgViewDefaultBackgroundForImgList(); + // this.plugin.containerView?.setImgViewDefaultBackgroundForImgList(); + this.plugin.getAllContainerViews().forEach(container => { + container.setImgViewDefaultBackgroundForImgList(); + }); } this.plugin.saveSettings(); } @@ -1011,7 +1071,7 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab { } /** - * typescript class object for defining operating status of the image + * ts class object: image operating status */ class ImgStatusCto { constructor() { @@ -1025,10 +1085,13 @@ class ImgStatusCto { this.arrowLeft = false; this.arrowRight = false; this.fullScreen = false; - this.activeImgZIndex = 0; + this.activeImgZIndex = 0; /*--layer-status-bar*/ this.clickCount = 0; } } +/** + * ts class object: image information including all html elements + */ class ImgInfoCto { constructor() { this.imgList = new Array(); @@ -1118,9 +1181,13 @@ class ImgUtil { }; } } -ImgUtil.calculateImgZoomSize = (realImg, imgCto) => { - const windowWidth = document.documentElement.clientWidth || document.body.clientWidth; - const windowHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 100; +ImgUtil.calculateImgZoomSize = (realImg, imgCto, windowWidth, windowHeight) => { + if (!windowWidth) { + windowWidth = document.documentElement.clientWidth || document.body.clientWidth; + } + if (!windowHeight) { + windowHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 100; + } const windowZoomWidth = windowWidth * ZOOM_FACTOR; const windowZoomHeight = windowHeight * ZOOM_FACTOR; let tempWidth = realImg.width, tempHeight = realImg.height; @@ -1221,16 +1288,22 @@ ImgUtil.invertImgColor = (imgEle, open) => { }; class ContainerView { - constructor(plugin, containerType, pinMaximum) { + constructor(plugin) { this.lastClickedImgDefaultStyle = { borderWidth: '', borderStyle: '', borderColor: '' }; this.imgGlobalStatus = new ImgStatusCto(); - this.imgInfoCto = new ImgInfoCto(); + this.imgInfo = new ImgInfoCto(); + this.getViewMode = () => { + return this.plugin.settings.viewMode; + }; this.isPinMode = () => { - return 'PIN' === this.containerType; + return ViewMode.Pin === this.getViewMode(); + }; + this.isNormalMode = () => { + return ViewMode.Normal === this.getViewMode(); }; this.setMenuView = (menuView) => { this.menuView = menuView; @@ -1244,22 +1317,35 @@ class ContainerView { this.getActiveImg = () => { return this.imgGlobalStatus.activeImg; }; - this.setPinMaximum = (val) => { - this.pinMaximum = val; + this.getDoc = () => { + return this.doc; }; + /*public setPinMaximum = (val: number) => { + this.pinMaximum = val; + }*/ this.getOitContainerViewEl = () => { - return this.imgInfoCto.imgContainerEl; + return this.imgInfo.imgContainerEl; + }; + this.getParentContainerEl = (targetEl) => { + if (!targetEl) { + return this.parentContainerEl; + } + if (!this.parentContainerEl) { + this.parentContainerEl = targetEl.matchParent('body'); + this.doc = this.parentContainerEl.ownerDocument; + } + return this.parentContainerEl; }; //region ================== Container View & Init ======================== /** - * render when clicking an image - * @param targetEl the clicked image's element + * Render when clicking an image (core step) + * @param targetEl clicked image's element * @returns */ - this.renderContainerView = (targetEl) => { + this.renderContainer = (targetEl) => { if (!this.checkStatus()) return; - const matchedImg = this.initContainerView(targetEl, this.plugin.app.workspace.containerEl); + const matchedImg = this.initContainerView(targetEl, this.getParentContainerEl(targetEl)); if (!matchedImg) return; this.openOitContainerView(matchedImg); @@ -1267,8 +1353,13 @@ class ContainerView { this.refreshImg(matchedImg, targetEl.src, targetEl.alt); matchedImg.mtime = new Date().getTime(); }; - this.initContainerView = (targetEl, containerEl) => { - const matchedImg = this.initContainerViewDom(containerEl); + /** + * initContainerDom -> + * @param targetEl + * @param parentContainerEl targetEl's body + */ + this.initContainerView = (targetEl, parentContainerEl) => { + const matchedImg = this.initContainerDom(parentContainerEl); if (!matchedImg) return null; matchedImg.targetOriginalImgEl = targetEl; @@ -1282,50 +1373,37 @@ class ContainerView { var _a; this.restoreBorderForLastClickedImg(); this.removeGalleryNavbar(); - (_a = this.imgInfoCto.oitContainerViewEl) === null || _a === void 0 ? void 0 : _a.remove(); - this.imgInfoCto.oitContainerViewEl = null; - this.imgInfoCto.imgContainerEl = null; + (_a = this.imgInfo.oitContainerEl) === null || _a === void 0 ? void 0 : _a.remove(); + this.imgInfo.oitContainerEl = null; + this.imgInfo.imgContainerEl = null; this.imgGlobalStatus.dragging = false; this.imgGlobalStatus.popup = false; this.imgGlobalStatus.activeImgZIndex = 0; this.imgGlobalStatus.fullScreen = false; this.imgGlobalStatus.activeImg = null; // clear imgList - this.imgInfoCto.imgList.length = 0; + this.imgInfo.imgList.length = 0; }; this.checkStatus = () => { - if (!this.containerType) + const viewMode = this.plugin.getViewMode(); + if (!viewMode) return false; - let oitContainerViewClass; - switch (this.containerType) { - case 'MAIN': - if (this.plugin.settings.pinMode) { - return false; - } - oitContainerViewClass = 'oit-main-container-view'; - break; - case 'PIN': - if (!this.plugin.settings.pinMode) { - return false; - } - oitContainerViewClass = 'oit-pin-container-view'; - break; - default: - return false; - } - if (this.imgInfoCto.oitContainerViewEl) { - const containerElList = document.getElementsByClassName(oitContainerViewClass); - if (!containerElList || 0 >= containerElList.length) { - // when switch between workspaces, you should remove ContainerView - this.removeOitContainerView(); - } - } - if (this.isPinMode() && this.plugin.settings.pinCoverMode) { - return true; - } + // none of popped-up-images if (!this.imgGlobalStatus.popup) return true; - return this.pinMaximum > this.imgInfoCto.getPopupImgNum(); + // Pin mode && Cover mode + if (this.isPinMode() && this.plugin.settings.pinCoverMode) + return true; + // configured max images > current pop-up images + if (this.getConfiguredPinMaximum() > this.imgInfo.getPopupImgNum()) + return true; + new obsidian.Notice(t("PIN_MAXIMUM_NOTICE")); + return false; + }; + this.getConfiguredPinMaximum = () => { + if (this.isPinMode()) + return this.plugin.settings.pinMaximum; + return 1; }; this.initDefaultData = (matchedImg, targetImgStyle) => { if (targetImgStyle) { @@ -1393,35 +1471,35 @@ class ContainerView { }; //endregion //region ================== Image ======================== - this.updateImgViewElAndList = (pinMaximum) => { - if (!this.imgInfoCto.imgContainerEl) + this.updateImgViewElAndList = (imgInfo) => { + if (!(imgInfo === null || imgInfo === void 0 ? void 0 : imgInfo.imgContainerEl)) return; - const imgNum = this.imgInfoCto.imgList.length; + const pinMaximum = this.getConfiguredPinMaximum(); + const imgNum = this.imgInfo.imgList.length; if (pinMaximum < imgNum) { - if (this.imgInfoCto.imgContainerEl) { - // remove all imgViewEl and imgList - this.imgInfoCto.imgContainerEl.innerHTML = ''; - } + // remove all imgViewEl and imgList + imgInfo.imgContainerEl.innerHTML = ''; // clear imgList - this.imgInfoCto.imgList.length = 0; + imgInfo.imgList.length = 0; } - let imgViewEl; + // let isUpdate: boolean = false; const curTime = new Date().getTime(); for (let i = imgNum; i < pinMaximum; i++) { - //