V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
Aresn
V2EX  ›  JavaScript

我们在开源项目中是怎样埋彩蛋的

  •  6
     
  •   Aresn · 2018-12-25 17:30:24 +08:00 · 6117 次点击
    这是一个创建于 2149 天前的主题,其中的信息可能已经有所发展或是发生改变。

    今天的 AntDesign 圣诞节彩蛋事件确实炸开了锅,加彩蛋的初衷是好的,只是这次玩过了火。

    在开源软件中,加彩蛋是一种乐趣,并不为奇,同为知名 UI 组件库的 iView 项目,也经常在 文档 中埋藏很多彩蛋,不过仅仅是在 文档 中,组件库中是没有的。本来就来介绍下我们在开源项目中是怎样埋彩蛋的。

    全民彩蛋计划

    为庆祝 iView 两周岁生日,以及 3.0 版本的发布,我们在 18 年 7 月 28 日更新后, iView 文档 中放置了三枚彩蛋,它们埋藏在不同的页面里,可能是一段隐藏的代码,或是一段需要破解的密码等等。当然,找到三枚彩蛋,你并不能继承 iView 作者的遗产!彩蛋可以到 iView 开发者社区 兑换大量的 IO 币,IO 币可以换取各种礼物。

    这个活动已经进行了 5 个月,已经有两名聪明的小伙伴成功找到了前两枚彩蛋,第一枚的位置是在 Collapse 折叠面板 页面的最后一个示例中:

    https://www.iviewui.com/components/collapse

    显示方法就是点击倒数第二个示例“简洁模式”中的第二个面板斯蒂夫·盖瑞·沃兹尼亚克,然后双击内容最后的 19840124,页面中就会弹出一个提示:

    19840124 是一个日期,也就是 1984 年 1 月 24 日,这一天,苹果发布了麦金塔电脑( Macintosh ),对于苹果来说具有历史性的意义。第一枚彩蛋就是为了纪念这个事件。

    第二枚彩蛋的位置在 Circle 进度环 页面的第二个示例总:

    https://www.iviewui.com/components/circle

    显示方法是点击“+号”按钮,当圆环到达 100% 后,再点击两次“+号”,页面中就会弹出一个提示:

    这串字符是用 base 64 编码过的,解码后,就是第二枚彩蛋的正确答案了:

    ToyStory-Pixar

    Pixar 就是皮克斯动画工作室,是由苹果前 CEO 乔布斯被“赶出家门”后收购的,ToyStory 就是《玩具总动员》,是皮克斯制作的一部计算机动画长片和第一部剧场影片,给无数小朋友带来了欢乐。第二枚彩蛋就是纪念它的。

    第三枚彩蛋至今( 2018-12-25 )仍未被找到,聪明的你要赶快行动哦!第三枚彩蛋与前两枚同样与苹果公司有关,这是因为 iView 的作者非常喜欢 Apple 和乔布斯!

    弹幕彩蛋

    在文档中埋彩蛋并不是 iView 的第一次活动了,在 16 年的 7 月 28 日( iView 一周岁),iView 文档首页增加了发弹幕的功能,你发的弹幕,同一时间打开文档首页的用户都可以实时看到。

    一开始,大家玩的都很愉快,比如说 PHP 是世界上最好的语言 的,还有要妹子微信的,这很程序员:

    再到后来,就被玩坏了,因为没有加验证,聪明的程序员各种 XSS 手段都用上了,于是画风就变成了这样:

    这是一次典型的 XSS 攻击案例,哈哈!活动持续了 1 星期,总共发布了 10 万多条弹幕,大家玩的很开心。

    节日彩蛋

    逢年过节,iView 首页都会装饰,比如万圣节、圣诞节、春节。主要会美化一下 Logo 和改变首页背景图,比如今天的圣诞节,iView 的 Logo 是这样的:

    比如 2018 年的春节:

    春节有两个细节,一个是首页会放烟花(因为是截图,看不到动画),另一个是右上角有一个“福”字,当时可以支持支付宝的扫福活动。

    2017 年的万圣节:

    2017 年的圣诞节:

    如果恰巧在一些特殊的时间节点发布了新版本,iView 在更新日志里也会做一个小彩蛋,或者说是纪念。比如 2018-03-14,这一天是史蒂芬·霍金离开这个世界的日子,我们在更新日志中和当天的文档首页也有纪念(首页为黑白色,现在无法找到当时的截图了),下面是更新日志:

    后记

    埋藏彩蛋是一个很有意思和意义的事情,许多游戏、电影、开源软件都有彩蛋。它们爱自己的用户,爱这个世界,希望给人们带来欢喜。iView 也会不断带来新的彩蛋,给用户带来惊喜,当然,它只会出现在文档中,源码是不用担心的!

    第 1 条附言  ·  2018-12-26 10:47:30 +08:00

    第三枚彩蛋在 2018-12-25 被找到。位置在 更新日志 的 3.0.0 版本号:

    https://www.iviewui.com/docs/guide/update

    显示方法是,双击 3.0.0 版本号的发布日期 2018-07-28,页面中就会弹出一个提示:

    这是一个关键词,并非最终答案。Apple ,Chapter 24 是指中文版《乔布斯传》第 24 章的标题:

    ThinkDifferent

    这同时也是苹果最知名的一则广告。

    24 条回复    2018-12-26 10:37:26 +08:00
    ksco
        1
    ksco  
       2018-12-25 19:03:10 +08:00   ❤️ 2
    恭喜你找到第三枚彩蛋
    Keywords: Apple; Chapter 24

    😅我也真是闲的慌哈哈
    Everyman
        2
    Everyman  
       2018-12-25 19:53:13 +08:00   ❤️ 1
    嗯...刚打算直接下载 js 文件搜"彩蛋"关键字找出第三枚彩蛋,刚打开控制台就发现了这个:
    https://imgur.com/OunCUn5
    代码强迫症有点不能忍...
    jackielin
        3
    jackielin  
       2018-12-25 19:59:30 +08:00   ❤️ 3
    蹭热点?
    MoeXian
        4
    MoeXian  
       2018-12-25 20:03:52 +08:00
    @ksco 无效的兑换码
    ksco
        5
    ksco  
       2018-12-25 20:04:36 +08:00
    兑换码是 ThinkDifferent,竟然没有空格~

    哈哈哈很好玩~
    noaccounthere
        6
    noaccounthere  
       2018-12-25 20:04:48 +08:00
    这确实才是正确的加彩蛋方法
    ksco
        7
    ksco  
       2018-12-25 20:06:29 +08:00
    @MoeXian #4 这不是兑换码,是个线索,看我上面的回复,已经被我兑换啦~

    Aresn
        8
    Aresn  
    OP
       2018-12-25 20:08:03 +08:00   ❤️ 1
    @ksco 恭喜,半年了,终于被找到了
    ksco
        9
    ksco  
       2018-12-25 20:08:42 +08:00
    @ksco #5 解释一下,因为乔布斯传中文版的第 24 章的标题叫 Think Different,这也是苹果的一个广告的名字。
    MoeXian
        10
    MoeXian  
       2018-12-25 20:10:06 +08:00
    @ksco 233 好吧
    MoeXian
        11
    MoeXian  
       2018-12-25 20:11:05 +08:00
    @ksco 在文档哪里发现的鸭
    ksco
        12
    ksco  
       2018-12-25 20:13:08 +08:00
    https://www.iviewui.com/docs/guide/update

    更新日志界面 3.0.0 Battleheart 这个版本,双击 更新日期 2018-07-28 就会弹出来了

    不过我是搜源码找到的哈哈,惭愧。
    MoeXian
        13
    MoeXian  
       2018-12-25 20:13:28 +08:00
    @Aresn 文档的 Avatar 头像组件最后一个示例 change 按钮点击两次后 Chrome 未响应了...
    shuirong1997
        14
    shuirong1997  
       2018-12-25 20:14:37 +08:00
    @yiranHZT #2 噗
    a4854857
        15
    a4854857  
       2018-12-25 20:15:11 +08:00
    讲真。我看到文档里面这么多浮窗广告就已经不想去了解这个框架了。。。
    MoeXian
        16
    MoeXian  
       2018-12-25 20:16:34 +08:00
    @ksco 唔 看到了
    Everyman
        17
    Everyman  
       2018-12-25 20:19:18 +08:00
    @Aresn 下次埋彩蛋可以考虑通过“双击”、“ hover ”等条件触发,然后请求服务器的彩蛋信息,再通过 notice 组件直接显示返回的结果。这样能简单地避免直接搜源码。😀
    Aresn
        18
    Aresn  
    OP
       2018-12-25 20:20:56 +08:00
    @yiranHZT 你们都太聪明了
    FindHao
        19
    FindHao  
       2018-12-25 20:31:37 +08:00 via Android
    @ksco 哈哈哈哈,恭喜你是半年来第一个 找 彩蛋的。
    shuirong1997
        20
    shuirong1997  
       2018-12-25 20:49:33 +08:00
    @Aresn #18
    虽然前端可以直接搜源码比较恶心,但直接汉字“彩蛋”放在代码里就没意思了~

    可以考虑先将汉字转码(比如彩蛋的 unicode 码是“彩蛋”),然后将之切割成多股字符串,再将这些字符串藏到代码的不同地方。最后弹框显示的时候,拿到那些字符串,拼接下直接交给浏览器渲染出来就好了。

    这样搞还有点意思~考虑下
    1024MB
        21
    1024MB  
       2018-12-25 20:52:07 +08:00 via Android   ❤️ 3
    无聊
    loading
        22
    loading  
       2018-12-25 20:58:35 +08:00 via Android
    我真的搞不清 iview 和 ant。
    jim9606
        23
    jim9606  
       2018-12-26 02:29:33 +08:00
    彩蛋通常是要特意挖才能找到的,很容易遇到的不叫彩蛋。
    我的理解是彩蛋通常是表达某种精神的,例如 python 的 import this。
    google doodles 通常也算是 Google 表达公共观点的手段
    yoqu
        24
    yoqu  
       2018-12-26 10:37:26 +08:00
    这波热点操作可以,
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5378 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 07:23 · PVG 15:23 · LAX 23:23 · JFK 02:23
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.