Skip to content

Set adaptive width for individual documents #9107

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
Shad0wpf opened this issue Sep 4, 2023 · 7 comments
Closed

Set adaptive width for individual documents #9107

Shad0wpf opened this issue Sep 4, 2023 · 7 comments
Assignees
@88250 @Vanessa219
Labels
Enhancement
Milestone
2.10.5

Comments

@Shad0wpf
Copy link

Shad0wpf commented Sep 4, 2023 •
edited by 88250
Loading

独立设置笔记页面的只读模式和自适应宽度

In what scenarios do you need this feature?

  1. 笔记中部分页面需要随时编辑，还有部分平时基本不会做编辑的，现在的只读模式切换方式，会切换整个软件的状态，需要频繁切换。
  2. 根据笔记内容的不同，有些适合自适应模式展示（如包含多列表格的），有些适合固定宽度展示，希望能增加独立设置自适应宽度的功能。

Describe the optimal solution

每篇笔记页面增加记录只读模式和自适应宽度的参数信息，未设置时，使用系统默认方式，设置了只读或自适应宽度时，则使用笔记自身的参数状态。

Describe the candidate solution

No response

Other information

No response
@88250
Copy link
Member

88250 commented Sep 5, 2023

独立设置只读模式请关注 #8417

@88250 88250 changed the title 独立设置笔记页面的只读模式和自适应宽度 Set Adaptive Width for individual documents Sep 5, 2023
@88250 88250 modified the milestones: backlog, 2.10.5 Sep 8, 2023
Vanessa219 added a commit that referenced this issue Sep 8, 2023
@Vanessa219
🎨 #9107
b5c45cb
88250 added a commit that referenced this issue Sep 8, 2023
@88250
🎨 Set Adaptive Width for individual documents #9107

Verified

This commit was signed with the committer’s verified signature.
88250 D
GPG key ID: 86211BA83DF03017
Verified
Learn about vigilant mode
3930525
@88250
Copy link
Member

88250 commented Sep 8, 2023

image

@88250 88250 closed this as completed Sep 8, 2023
@88250 88250 changed the title Set Adaptive Width for individual documents Set adaptive width for individual documents Sep 9, 2023
EightDoor added a commit to EightDoor/siyuan that referenced this issue Sep 9, 2023
@EightDoor
Merge commit '7a7af86b11b6ded088bc3db6769dd63f1ce6229f' into develop
1ce6306 
* commit '7a7af86b11b6ded088bc3db6769dd63f1ce6229f': (26 commits)
  🎨 aria label
  🎨 Pandoc template for exporting docx Fix siyuan-note#8740
  🎨 Pandoc template for exporting docx Fix siyuan-note#8740
  🎨 Cancel the read-only mode message notification after startup Fix siyuan-note#9100
  🎨 siyuan-note#8417
  🐛 An issue that caused cloud data corruption Fix siyuan-note#9144
  🐛 fix siyuan-note#9142
  🐛 fix siyuan-note#9141
  🐛 fix siyuan-note#9141
  🎨 Set Adaptive Width for individual documents siyuan-note#9107
  🎨 siyuan-note#9107
  🎨 siyuan-note#9134
  ♻️
  🎨 siyuan-note#9134
  🎨 Physically delete a workspace on the mobile siyuan-note#9134
  🎨 Physically delete a workspace on the mobile siyuan-note#9134
  🎨 fix siyuan-note#9134
  🎨 fix siyuan-note#9140
  🎨 Physically delete a workspace on the mobile siyuan-note#9134
  🔖 Release v2.10.4
  ...
@Zuoqiu-Yingyi
Copy link
Contributor

Zuoqiu-Yingyi commented Sep 16, 2023 •
edited
Loading

@Vanessa219 开启全局 自适应宽度 后鼠标悬浮预览编辑器的 protyle-content 元素未设置 data-fullwidth="true" (v2.10.6-dev2)

@Vanessa219
Copy link
Member

我这里是有的，是有经过什么操作后不见了吗？检查一下这个是否为默认
image

image

@Zuoqiu-Yingyi
Copy link
Contributor

Zuoqiu-Yingyi commented Sep 16, 2023 •
edited
Loading

我这里是有的，是有经过什么操作后不见了吗？检查一下这个是否为默认 image

悬浮窗口 打开后即是 默认, 同时没有 data-fullwidth 属性
将文档自适应宽度从 默认 切换至 启用 后 data-fullwidth="true" 属性才会出现, 再将其从 启用 切换至 默认 后 data-fullwidth="true" 会被保留

image

这里是悬浮窗口的 DOM 吗, 我的悬浮窗口既没有 data-fullwidth 也没有 data-scrolltop 属性
image

@Zuoqiu-Yingyi
Copy link
Contributor

@Vanessa219 经过我的测试, 在打开浮窗预览窗口时确实没有调用 WYSIWYG.renderCustom 方法

siyuan/app/src/protyle/wysiwyg/index.ts

Lines 110 to 134 in 5e21b21

public renderCustom(ial: IObject) {
let isFullWidth = ial[Constants.CUSTOM_SY_FULLWIDTH];
if (!isFullWidth) {
isFullWidth = window.siyuan.config.editor.fullWidth ? "true" : "false";
}
if (isFullWidth === "true") {
this.element.parentElement.setAttribute("data-fullwidth", "true");
} else {
this.element.parentElement.removeAttribute("data-fullwidth");
}
const ialKeys = Object.keys(ial);
for (let i = 0; i < this.element.attributes.length; i++) {
const oldKey = this.element.attributes[i].nodeName;
if (!["type", "class", "spellcheck", "contenteditable", "data-doc-type", "style", "scroll", "data-realwidth"].includes(oldKey) &&
!ialKeys.includes(oldKey)) {
this.element.removeAttribute(oldKey);
i--;
}
}
ialKeys.forEach((key: string) => {
if (!["title-img", "title", "updated", "icon", "id", "type", "class", "spellcheck", "contenteditable", "data-doc-type", "style", "data-realwidth"].includes(key)) {
this.element.setAttribute(key, ial[key]);
}
});
}

也没有调用 editor.onSetEditor 方法

siyuan/app/src/config/editor.ts

Lines 339 to 361 in 5e21b21

onSetEditor: (editorData: IEditor) => {
if (editorData.readOnly !== window.siyuan.config.editor.readOnly) {
editor.setReadonly(editorData.readOnly);
}
window.siyuan.config.editor = editorData;
getAllModels().editor.forEach((item) => {
reloadProtyle(item.editor.protyle, false);
let isFullWidth = item.editor.protyle.wysiwyg.element.getAttribute(Constants.CUSTOM_SY_FULLWIDTH);
if (!isFullWidth) {
isFullWidth = window.siyuan.config.editor.fullWidth ? "true" : "false";
}
if (isFullWidth === "true" && item.editor.protyle.contentElement.getAttribute("data-fullwidth") === "true") {
return;
}
resize(item.editor.protyle);
if (isFullWidth === "true") {
item.editor.protyle.contentElement.setAttribute("data-fullwidth", "true");
} else {
item.editor.protyle.contentElement.removeAttribute("data-fullwidth");
}
});
setInlineStyle();
}

而这两个地方是唯二设置 data-fullwidth 属性的位置

@Vanessa219
Copy link
Member

浮窗没有弄，下个版本加上，这里就不新建 issue 了。

Vanessa219 added a commit that referenced this issue Sep 17, 2023
@Vanessa219
🚨 #9107
e9bf86e
@88250 88250 mentioned this issue Apr 12, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@88250 88250

@Vanessa219 Vanessa219

Labels
Enhancement
Projects
None yet
Milestone
2.10.5
Development

No branches or pull requests
4 participants
@88250 @Vanessa219 @Shad0wpf @Zuoqiu-Yingyi