Hello,碎语TALK

嗯，最近折腾一下BLOG，看到别人用到这种类似微博的碎碎念，感觉很不错，然后我在我用的主题上发现内置了[Artitalk 3.3.4]，试用了一下，感觉良好，他是一个基于leancloud的一个JS做的碎碎念系统，用了几天，感觉有些功能不是很满意，于是乎决定改动一下，然后pull request，但是写着写着，感觉很有约束(他已经很多版本了)，内置的上传图床也是一个我平时不用的，看到原项目用的是MIT协议，所以我觉定花点时间来做一个自己的吧，嗯，说动就动。

写了2-3天，感觉要学习的东西还很多，当然，顺便托原作者的福，学习了一下一直想学习却没来及学习的 gulp

项目地址

https://github.com/afyi/sytalk

最新版本号

1.2.2 2022-12-06

更新记录

1.2.2 [2022-12-06]

• 添加点赞时间间隔参数

1.2.0 [2022-12-02]

• 新增加基于learncloud和localstorage的点赞功能[测试中]
• 可以定制自己的操作系统名称啦

1.1.1 [2022-11-20]

• 修复了sy-day5 图标命名错误的BUG

1.1.0 [2022-11-19]

• 将CSS样式表外置，进行压缩
• 统一SVG图标大小，然后将svg上传至iconfont
• 将时间图标从9个改成5个，去掉几个粗细不统一的图标

1.0.0 [2022-11-18]

• 精简Artitalk的部分代码，做一个初步功能的雏形

对比Artitalk的不同

1. 删除了原Artitalk中的文件上传部分，个人感觉用不到
2. 重构了Artitalk中部分代码，新增，删除，加载没必要全部重新加载，减小重载损耗
3. 重构了Artitalk的MARKDOWN解析部分，让解析更快速
4. 修复了之前Artitalk设备判定部分的小小BUG
5. 修改了部分样式命名，防止和引用的部分冲突

目前考虑不再加的功能

1. 评论，个人感觉没必要了，因为一般来说博客都有评论功能，没必要单独做一个评论给说说了

还在考虑要不要补的功能

1. 说说的编辑

文件结构

src
├─ main.js                   # Sytalk 的主要 js 部分
├─ css											 # 样式文件夹	
    ├─ sytalk.css						 # 主样式文件
├─ img											 # 静态图，其实就是提示框的图片文件夹	
├─ svg                       # SVG图标的源文件
├─ emoji                     # 表情图所在文件夹
└─ plugins                   # 第三方 js
    ├─ av-min.js             # LeanCloud 提供的 SDK
    ├─ browser.js            # 返回用户操作系统
    └─ showdown.min.js       # Markdown 转换

使用说明

1. 打包

   git clone git@github.com:afyi/sytalk.git
   cd sytalk && yarn build

   然后从 dist/js/sytalk.min.js 放至于你能访问到的地方即可

2. 初始化

   <div id="artitalk_main"></div>
   <script src="https://fastly.jsdelivr.net/gh/afyi/sytalk/dist/sytalk.min.js"></script>
   <script>
   	sytalk.init({
     	appId: '从leancloud项目中拿来的appid',
      appKey: '从leancloud项目中拿来的appkey',
      serverURL: "从leancloud项目中拿来的REST域名",
      // 每次加载数10个，默认就是10个
      pageSize: 10,
      // 表情CDN路径，非必填，默认就是下面这个
      emojiServer: "https://fastly.jsdelivr.net/gh/afyi/sytalk/dist/emoji/",
      // 信息框背景图，默认就是下面的图
      bgImg: "https://fastly.jsdelivr.net/gh/afyi/sytalk/dist/img/bgImg.webp",
      // 外链CSS地址，这里与artitalk不同，如果这里填，会直接中断内置样式
      cssUrl: "",
      // 信息框placeholder文字
      shuoPla: "",
      // 默认头像，默认值是gravator的默认头像
      avatarUrl: "https://cravatar.cn/avatar/0?s=128",
      // 定制系统名称 1.2.0新增，可以单独定制某几个，也可以全部定制
      osName: {android: "Android", macos: "MacOS", windows: "Windows", linux: "Linux", other: "other"},
      // 点赞间隔，单位：秒，点赞时间间隔，默认是1天，如果设置为0，则只要有记录就不会清除
      zanIntval: 24 * 3600, 
     	// 加载完成回调
       onLoad: () => {},
       // 登陆成功后的回调
       onLogin: () => {},
       // 发布说说成功后的回调
       onPublished: () => {}
     });
   </script>

3. learncloud设置说明 [重要]

• 需要一个用户，用于更新说说

位置：申请一个应用 -> 应用概况 -> 内建帐户 -> 添加用户

• 需要2个class，分别起名 shuoshuo 和 zan

class shuoshuo 表结构

class shuoshuo 权限设置

访问权限如下：

默认ALC权限：

class zan 表结构

class zan 权限设置

访问权限如下：

默认ALC权限：

协议

MIT