推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
Aresn

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

  •  6
     
  •   Aresn · Dec 25, 2018 · 7095 views
    This topic created in 2729 days ago, the information mentioned may be changed or developed.

    今天的 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 也会不断带来新的彩蛋,给用户带来惊喜,当然,它只会出现在文档中,源码是不用担心的!

    Supplement 1  ·  Dec 26, 2018

    第三枚彩蛋在 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 replies    2018-12-26 10:37:26 +08:00
    ksco
        1
    ksco  
       Dec 25, 2018   ❤️ 2
    恭喜你找到第三枚彩蛋
    Keywords: Apple; Chapter 24

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

    哈哈哈很好玩~
    noaccounthere
        6
    noaccounthere  
       Dec 25, 2018
    这确实才是正确的加彩蛋方法
    ksco
        7
    ksco  
       Dec 25, 2018
    @MoeXian #4 这不是兑换码,是个线索,看我上面的回复,已经被我兑换啦~

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

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

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

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

    这样搞还有点意思~考虑下
    kY8mbXW833Lu28xn
        21
    kY8mbXW833Lu28xn  
       Dec 25, 2018 via Android   ❤️ 3
    无聊
    loading
        22
    loading  
       Dec 25, 2018 via Android
    我真的搞不清 iview 和 ant。
    jim9606
        23
    jim9606  
       Dec 26, 2018
    彩蛋通常是要特意挖才能找到的,很容易遇到的不叫彩蛋。
    我的理解是彩蛋通常是表达某种精神的,例如 python 的 import this。
    google doodles 通常也算是 Google 表达公共观点的手段
    yoqu
        24
    yoqu  
       Dec 26, 2018
    这波热点操作可以,
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1158 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 57ms · UTC 18:00 · PVG 02:00 · LAX 11:00 · JFK 14:00
    ♥ Do have faith in what you're doing.