[MySym] - 自定义 Sym 论坛编辑器中 emoji 列表提示

本贴最后更新于 3031 天前,其中的信息可能已经时过境迁

通过问 D 大,得知 ctrl+/的代码在 common.js 里,搜索 emoji 关键字找到 emojiString,此处存放了所有 emoji 名称的字符串(老长了 D 大怎么做到的……)
于是在此处添加 ajax 方法,以从后台获取该用户相关的 emoji 列表:

$.ajax({
   async: false,
   url: Label.servePath + "/users/emotions",
   type: "GET",
   success: function (result) {
       console.log('ajax:'+result.emotions);
       emojString=result.emotions;
   }
});

其实我不太清楚 async 的含义,也懒得管,能用就行 0.0~
这里其实用了一个 CodeMirror 的插件(似乎是做代码自动补全的,D 大将它用到了表情符号上👍)
鉴于这块代码内也有其他 ajax 并且调用了 UserProcessor(类似于 Controller),我也将 emotion 获取的 controller 写在了这里(因为是获取该用户的 emoji,所以也不算打乱,应该是吧)

@RequestProcessing(value = "/users/emotions", method = HTTPRequestMethod.GET)
public void getEmotions(final HTTPRequestContext context, final HttpServletRequestrequest,final HttpServletResponse response) throws Exception {
    String emotions;
    context.renderJSON();//context包含request和resposne对象,不知道是否一致
    final JSONObject currentUser = (JSONObject) request.getAttribute(User.USER); //获到的包含用户信息的JSON对象
    final String userId = currentUser.optString(Keys.OBJECT_ID); //取得用户ID1470108766562
    emotions=emotionQueryService.getEmotions(userId);//保存
    context.renderJSONValue("emotions",emotions);
}

这段代码是拷贝的其他方法里的再做修改,注释是我通过调试读取到的值,以明白这段代码是用来做什么的(这段时间工作的新技能,不必探查源码考究代码的功能,通过调试知道其能获取什么值就直接拿来用好了)
可以看到,这里建立了 emotionQueryService,需要如下引入:

@Inject
private EmotionQueryService emotionQueryService;

虽然这个 ajax 是 void 类型的,不过可以通过 context.renderJSONValue 方法将值带回去(这个是向 D 讨教类似功能的代码得出的结论)
于是,进入 getEmotions 方法。
在论坛上问过 D 大 Service,Repository,Cache,以及 Model 类的关系(查看帖子
如 D 所言,Repository 就是执行数据库查询操作的 DAO,不过我得说,Service 也有 Query 代码,这属于分层不够明确:P
Service 是服务类,按我的理解就是调用 Repository 以完成 Processing 需要的动作,Cache,D 大的解释是放入内存,有些操作就是先对内存数据进行操作,完后再写回数据库的,如此大概会提高速度(积分就是如此,以至于直接通过该数据库库字段的话,积分不会变化,需要重启服务才能生效)
于是,我照着原有规则,写了一个 EmotionQueryService 和 EmotionMgmtService,目前只用到了前者:
完整代码由于包含完整 emoji 列表比较长,就不贴了,关键代码如下:

try {
  String emojis=emotionRepository.getUserEmotions(userId);
  if(emojis!=null&&emojis.length()!=0)
        return emojis;
} catch (final RepositoryException e) {
LOGGER.log(Level.ERROR, e.getMessage());
  return allEmojis;
}

这块没什么可说的了,关键在于 Repository 里面:

@Repository
public class EmotionRepository extends AbstractRepository {
    public EmotionRepository() {
        super("emotions");//此处据我推测应该与repository.json里的name有关
    }
    public String getUserEmotions(final String userId) throws RepositoryException {
        final PropertyFilter pf=new PropertyFilter(Emotion.EmotionUser, FilterOperator.EQUAL, userId);//定义查询条件
        final Query query = new Query().setFilter(pf);//添加查询条件
        final JSONObject result = get(query);//执行查询
        final JSONArray array = result.optJSONArray(Keys.RESULTS);
        if (0 == array.length()) {
            return null;
        }
        String resultString="";
        try {
            
            for(int i=0;i<array.length();i++){
                resultString+=array.optJSONObject(i).get("emotionName").toString();
                if(i!=array.length()-1)
                    resultString+=",";
            }
        } catch (JSONException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        return resultString;
    }
}

Query 或者 Filter 的具体逻辑无需关心,直接可用(一般情况下应该很容易吧,再复杂我还没有考虑过,我这里只需要通过 userid 获取到所有结果就行)
这个项目 json 处处可见,此处亦然,只定义 Repository 还不行,还需要在 repository.json 里添加数据表的对应:

{
    "name": "emotions",
    "keys": [
        {
            "name": "oId",
            "type": "String",
            "length": 19
        },
        {
            "name": "user_oId",
            "type": "String",
            "length": 19
        },
        {
            "name": "emotionName",
            "type": "String",
            "length": 25
        },
        {
            "name": "emotionSort",
            "type": "int"
        },
        {
            "name": "emotionType",
            "type": "int"
        }
    ]
}

第一个 name 疑似 repository 的 super 里传入的参数,其他的则对应数据表的列名了。
如此,emoji 快捷键调出来的 emoji 列表就掌握在自己手中了,还有相应的管理等功能,尚未完成,装逼要趁早,所以先写了个这个流水账。实际开发的流程其实是逆推过来的,先模拟了 service,repository 等再反过来向上写。

  • Sym

    Sym 是一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)系统平台。

    下一代的社区系统,为未来而构建

    524 引用 • 4601 回帖 • 700 关注

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • ZephyrJung

    PS. 我觉得微博分享应该来个长图生成之类的(类似于简书)

  • ZephyrJung

    PS2. D 大,代码格式怎么整 orz @88250

  • 714593351 1

    async: false 同步调用

    默认 async: true,异步

  • 88250 1

    @Zephyr 用 GFM 语法

  • 88250

    刚刚看完主贴,首先多谢你抽出时间来帮忙完善 Sym 👍

    提点疑问:对于表设计,emotionName 这个字段是做什么的?存的是表情的字符集么?

  • ZephyrJung

    @88250 emotionName 就是表情的名字,比如👍,就是 +1,我是讲所有 emotionName 取出来然后加上逗号,组成原先的 emojiString 的

  • 88250

    @Zephyr 哦,明白了。也为了扩展考虑,要不这个字段用 text 吧(repository.json 里面长度设置为 1024 或者更大,生成的时候就是 text 了),里面也可以存上传的图片地址(自定义表情)。

  • ZephyrJung

    @88250 我觉得 name 也有点快捷键的意思吧,如果保存上传地址什么的,可以再加字段

  • 88250

    @Zephyr 能一次性弄好就一次性吧~

  • ZephyrJung

    @88250 发现了一个小 bug,不过我觉得可以忽略。。ctrl+/后,输入-,列表消失,再输入 1,列表又显示,并且选中正确的 emoji,然而回车会变成-:-1(:)

请输入回帖内容 ...
ZephyrJung
一切有为法,如梦幻泡影,如露亦如电,应作如是观 北京

推荐标签 标签

  • Hadoop

    Hadoop 是由 Apache 基金会所开发的一个分布式系统基础架构。用户可以在不了解分布式底层细节的情况下,开发分布式程序。充分利用集群的威力进行高速运算和存储。

    86 引用 • 122 回帖 • 625 关注
  • Postman

    Postman 是一款简单好用的 HTTP API 调试工具。

    4 引用 • 3 回帖 • 3 关注
  • abitmean

    有点意思就行了

    29 关注
  • Mobi.css

    Mobi.css is a lightweight, flexible CSS framework that focus on mobile.

    1 引用 • 6 回帖 • 733 关注
  • 京东

    京东是中国最大的自营式电商企业,2015 年第一季度在中国自营式 B2C 电商市场的占有率为 56.3%。2014 年 5 月,京东在美国纳斯达克证券交易所正式挂牌上市(股票代码:JD),是中国第一个成功赴美上市的大型综合型电商平台,与腾讯、百度等中国互联网巨头共同跻身全球前十大互联网公司排行榜。

    14 引用 • 102 回帖 • 376 关注
  • GitHub

    GitHub 于 2008 年上线,目前,除了 Git 代码仓库托管及基本的 Web 管理界面以外,还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱(报表)、代码片段分享(Gist)等功能。正因为这些功能所提供的便利,又经过长期的积累,GitHub 的用户活跃度很高,在开源世界里享有深远的声望,并形成了社交化编程文化(Social Coding)。

    209 引用 • 2031 回帖
  • 以太坊

    以太坊(Ethereum)并不是一个机构,而是一款能够在区块链上实现智能合约、开源的底层系统。以太坊是一个平台和一种编程语言 Solidity,使开发人员能够建立和发布下一代去中心化应用。 以太坊可以用来编程、分散、担保和交易任何事物:投票、域名、金融交易所、众筹、公司管理、合同和知识产权等等。

    34 引用 • 367 回帖
  • Markdown

    Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。

    167 引用 • 1513 回帖
  • webpack

    webpack 是一个用于前端开发的模块加载器和打包工具,它能把各种资源,例如 JS、CSS(less/sass)、图片等都作为模块来使用和处理。

    41 引用 • 130 回帖 • 261 关注
  • 开源

    Open Source, Open Mind, Open Sight, Open Future!

    408 引用 • 3574 回帖
  • OpenShift

    红帽提供的 PaaS 云,支持多种编程语言,为开发人员提供了更为灵活的框架、存储选择。

    14 引用 • 20 回帖 • 633 关注
  • 百度

    百度(Nasdaq:BIDU)是全球最大的中文搜索引擎、最大的中文网站。2000 年 1 月由李彦宏创立于北京中关村,致力于向人们提供“简单,可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”,象征着百度对中文信息检索技术的执著追求。

    63 引用 • 785 回帖 • 175 关注
  • Ubuntu

    Ubuntu(友帮拓、优般图、乌班图)是一个以桌面应用为主的 Linux 操作系统,其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词,意思是“人性”、“我的存在是因为大家的存在”,是非洲传统的一种价值观,类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。

    125 引用 • 169 回帖 • 1 关注
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React 和 Angular。

    351 引用 • 1814 回帖
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞 I/O 模型而得以轻量和高效。

    139 引用 • 269 回帖 • 43 关注
  • SendCloud

    SendCloud 由搜狐武汉研发中心孵化的项目,是致力于为开发者提供高质量的触发邮件服务的云端邮件发送平台,为开发者提供便利的 API 接口来调用服务,让邮件准确迅速到达用户收件箱并获得强大的追踪数据。

    2 引用 • 8 回帖 • 483 关注
  • Maven

    Maven 是基于项目对象模型(POM)、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 302 关注
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    198 引用 • 550 回帖
  • NGINX

    NGINX 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。

    311 引用 • 546 回帖
  • Solidity

    Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。

    3 引用 • 18 回帖 • 399 关注
  • CodeMirror
    1 引用 • 2 回帖 • 129 关注
  • BND

    BND(Baidu Netdisk Downloader)是一款图形界面的百度网盘不限速下载器,支持 Windows、Linux 和 Mac,详细介绍请看这里

    107 引用 • 1281 回帖 • 27 关注
  • GraphQL

    GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖 • 9 关注
  • 设计模式

    设计模式(Design pattern)代表了最佳的实践,通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。

    200 引用 • 120 回帖
  • Love2D

    Love2D 是一个开源的, 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。

    14 引用 • 53 回帖 • 531 关注
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 167 关注
  • ZeroNet

    ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。

    1 引用 • 21 回帖 • 638 关注