更改颜色而不是 etherpad 中文本的背景颜色

Change color instead of background color of text in etherpad

我正在尝试在 etherpad 中找到“作者颜色”的解决方案。没有用过etherpad的人,请忽略这个问题,他们不会理解的。

所以通常 "Authorship Color" 是作为文本背景颜色提供的颜色,它可以在初始化 pad 时作为参数给出。它有助于识别谁在垫子上写了什么。

我想为所有文本设置白色背景,并根据用户更改 text-color 而不是背景颜色。所以就像我在初始化垫子时提供红色一样,我想在垫子上写红色而不是像往常一样在垫子上写红色背景和白色文字。

请不要搁置这个问题,因为我没有任何与此问题相关的具体代码可以提供。请在评论中提问,我会清除任何不明白的地方。

谢谢,

首先,感谢大家没有在Post上屏蔽或提出这个问题,因为没有提供任何代码。

当我决定再试一次时,我正要悬赏这个问题,经过很多努力,我已经解决了这个问题。不过,它帮助我更好地理解了 etherpad。

我想列出两个与 etherpad 相关的重要链接:

  1. https://github.com/ether/etherpad-lite/wiki
  2. 关于 src - https://github.com/ether/etherpad-lite/wiki/Introduction-to-the-source

如果您想了解 etherpad 或想自己做一些修改,它们可能非常重要。

所以这是你如何做的:

src/static/js/ace2_inner.js 中,转到 setAuthorStyle 函数并替换:

        // author color
        authorStyle.backgroundColor = bgcolor;
        parentAuthorStyle.backgroundColor = bgcolor;

        // text contrast
        if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
        {
          authorStyle.color = '#ffffff';
          parentAuthorStyle.color = '#ffffff';
        }else{
          authorStyle.color = null;
          parentAuthorStyle.color = null;
        }

        // anchor text contrast
        if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
        {
          anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
        }else{
          anchorStyle.color = null;
        }

有:

authorStyle.backgroundColor = '#ffffff';
parentAuthorStyle.backgroundColor = '#ffffff';

authorStyle.color = bgcolor;
parentAuthorStyle.color = bgcolor;

并注释掉:

if ((typeof info.fade) == "number")
{
  bgcolor = fadeColor(bgcolor, info.fade);
}

Ofcource 不要忘记在 bin/run.sh 之前重新启动进程以进行更改。

有兴趣了解其工作原理的人可以继续阅读。

所以 etherpad 接收在 src/static/js/pad.js 中初始化 etherpad 的参数,所以如果你定义了: 'userColor' 当你初始化 pad 时,它将进入 globalUserColor 中提到的文件。

然后这个变量 globalUserColor 在同一文件中填充 pad.myUserInfo.colorId

现在在 collab_client.js 中,此 colorId 存储在函数 tellAceAuthorInfocssColor 中,并且通过给定参数 [=29= 调用 editor.setAuthorInfo ].

现在这个函数 setAuthorInfo 存在于 src/static/js/ace2_inner.js 中,它调用其他本机函数(同一文件)setAuthorStyle 我们已经进行了更改。

我所做的是,而不是使用提供的变量 bgcolor 更改背景颜色,它实际上包含 userColor :

authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor;

我将 backgroundColor 更改为白色 (#ffffff) 并将文本颜色更改为 bgcolor :

authorStyle.backgroundColor = '#ffffff';
 parentAuthorStyle.backgroundColor = '#ffffff';

 authorStyle.color = bgcolor;
 parentAuthorStyle.color = bgcolor;

我也删了:

         // text contrast
         if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
         {
           authorStyle.color = '#ffffff';
           parentAuthorStyle.color = '#ffffff';
         }else{
           authorStyle.color = null;
           parentAuthorStyle.color = null;
         }

        // anchor text contrast
         if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
         {
           anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
         }else{
           anchorStyle.color = null;
         }

因为,这些行根据所选背景颜色设置文本颜色的对比度。但是我已经将背景设为白色并将文本颜色设置为给定 userColor 所以我不再需要对比度功能了。

最后我也评论了:

    if ((typeof info.fade) == "number")
    {
      bgcolor = fadeColor(bgcolor, info.fade);
    }

因为当用户不在线时它会使文本淡出,至少对我来说是这样。

就是这样。 我希望它能帮助 想要和我一样的功能的人。