假木瓜 发表于 2022-5-10 12:00:30

介绍一下mf8新的discuz代码——animcube（编辑中）

本帖最后由 假木瓜 于 2022-5-12 10:33 编辑

请打开电脑版查看，因为code块在移动版不显示

cube_master添加了新的discuz代码——animcube，引入了AnimCubeJS，可以在帖子中嵌入魔方模拟器，且不需要插件（java、flash什么的）。魔方模拟功能由AnimCubeJS提供，discuz代码产生width和height的样式和加载js。
我简单介绍一下AnimCubeJS的历史。很久很久以前，Josef Jelínek开发了一个叫AnimCube的Java Applet。后来Michael Feather开发了个用GWT的移植版本，这就是最早的AnimCubeJS。Michael Feather在后面的版本做了很多修改，比如用JavaScript重写、添加更多可用参数。感兴趣的话可以去看一下github那边的提交历史。

animcube系列的discuz代码有5个标签：animcube2、animcube3、animcube4、animcube5、animcube6，它们都是3参数的，{3}参数1是宽度，单位是像素。
参数2是高度，单位也是像素。
参数3是传入AnimCubeX()的参数，和直接调用AnimCubeJS的方法是一样的。直接看AnimCubeJS的文档也是可以的。https://cubing.github.io/AnimCubeJS/animcubejs.html

parameter name: config | value: .txt file

parameter name: bgcolor | value: 十六进制颜色值 (RGB)
//模拟器的背景颜色
//比如ff0000
parameter name: cubecolor | value: 十六进制颜色值 (RGB)

parameter name: butbgcolor | value: 十六进制颜色值 (RGB)
//按钮的背景颜色

parameter name: slidercolor | value: 十六进制颜色值 (RGB)

parameter name: troughcolor | value: 十六进制颜色值 (RGB)

parameter name: clickprogress | value: 0 or 1

parameter name: snap | value: 0 or 1

parameter name: buttonbar | value: 0 - 2

parameter name: buttonheight | value: 9 - 25

parameter name: repeat | value: 0 or 1

parameter name: edit | value: 0 or 1
//设成0就只能整体拖动，不能转动每一层，默认值是1

parameter name: speed | value: 自然数
//动画速度，数字越大，速度越慢，令人困惑。

parameter name: doublespeed | value: 自然数
//单独设置180度转动的速度。如果没有提供这个参数，doublespeed的值默认被设为speed的3/2。

parameter name: position | value: R, U, F, L, D and/or B string

parameter name: scale | value: 自然数

parameter name: align | value: 0 - 2

parameter name: hint | value: 自然数

parameter name: perspective | value: 自然数

parameter name: borderwidth | value: 0 - 20

parameter name: move | value: string from move character set or random

parameter name: movetext | value: 0 - 5 (for 3x3x3 only, other cube sizes: 0 or 1)

parameter name: yz | value: 0 or 1

parameter name: initmove | value: string from move character set, random or #

parameter name: initrevmove | value: string from move character set, random or #

parameter name: demo | value: string from move character set, random or #

parameter name: metric | value: 0 - 3

parameter name: fonttype | value: 0 or 1

parameter name: textsize | value: 5 - 40

parameter name: facelets | value: string of color codes
//设置每片贴纸的颜色。顺序见AnimCubeJS的文档 https://cubing.github.io/AnimCubeJS/animcubejs.html#facelets

parameter name: colorscheme | value: 6 color codes
//贴纸配色

parameter name: colors | value: hexadecimal color string

parameter name: pos | value: string of Lars Petrus' color codes

parameter name: supercube | value: 0 or 1
//值为1时为图案魔方

parameter name: scw | value: 0 - 2

parameter name: gabbacolors | value: 0 or 1

parameter name: scramble | value: 0 - 2

parameter name: randmoves | value: natural number
config参数我不推荐在论坛使用，因为需要上传一个配置文件，如果上传在别的站还需要考虑跨域的问题，非常麻烦。
参数写成"parameter_name=value"的形式，如果有多个参数，就用"&"连接，就像URL里的参数一样。

。。。正在添加例子config=https://cubing.github.io/AnimCubeJS/AnimCube3.txtconfig=https://cubing.github.io/AnimCubeJS/AnimCube3.txtfacelets=gbwrYYYYrbwgBRGRwoogOOWBfacelets=gbwrYYYYrbwgBRGRwoogOOWB
大小写并不影响贴纸的颜色。

3x3x3
表层单层转动：U D L R F B

以下是修饰符

加一个m可以转中层
movetext=1&move=Um.{haha};Um'.{haha};Um2.{haha};Um2'
可考虑不加 "movetext=1"，然后把公式写在别处。虽然AnimCubeJS有提供M、E、S、X、Y、Z、u、d、l、r、f、b

加一个c可以整体转动
movetext=1&move=Uc

加一个s外面两层一起转
movetext=1&move=Us

加一个t相邻的两层一起转
movetext=1&move=Ut

加一个a，相对的两层同时转
movetext=1&move=Ua

2x2x2
只剩c和a
我直接把AnimCubeJS文档那边的例子复制过来了。move=LL'RR'FF'BB'UU'DD'UcUc'FcFc'LcLc'UaFaRaRa'Fa'Ua'.{ pause};L2L2'R2R2'F2F2'B2B2'U2U2'D2D2'Uc2Uc2'Fc2Fc2'Lc2Lc2'Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1move=LL'RR'FF'BB'UU'DD'UcUc'FcFc'LcLc'UaFaRaRa'Fa'Ua'.{ pause};L2L2'R2R2'F2F2'B2B2'U2U2'D2D2'Uc2Uc2'Fc2Fc2'Lc2Lc2'Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1

4x4x4
有m、c、t、s、w、amove=LL'LmLm'Rm'RmR'R FF'FmFm'Bm'BmB'B UU'UmUm'Dm'DmD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRwRs'Rw'FsFwFs'Fw'UsUwUs'Uw' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Lm2Lm2'Rm2'Rm2R2'R2 F2F2'Fm2Fm2'Bm2'Bm2B2'B2 U2U2'Um2Um2'Dm2'Dm2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rw2Rs2'Rw2'Fs2Fw2Fs2'Fw2'Us2Uw2Us2'Uw2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1move=LL'LmLm'Rm'RmR'R FF'FmFm'Bm'BmB'B UU'UmUm'Dm'DmD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRwRs'Rw'FsFwFs'Fw'UsUwUs'Uw' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Lm2Lm2'Rm2'Rm2R2'R2 F2F2'Fm2Fm2'Bm2'Bm2B2'B2 U2U2'Um2Um2'Dm2'Dm2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rw2Rs2'Rw2'Fs2Fw2Fs2'Fw2'Us2Uw2Us2'Uw2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1

5x5x5
有n、m、c、t、s、amove=LL'LnLn'LmLm'Rn'RnR'R FF'FnFn'FmFm'Bn'BnB'B UU'UnUn'UmUm'Dn'DnD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRs'FsFs'UsUs' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Ln2Ln2'Lm2Lm2'Rn2'Rn2R2'R2 F2F2'Fn2Fn2'Fm2Fm2'Bn2'Bn2B2'B2 U2U2'Un2Un2'Um2Um2'Dn2'Dn2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rs2'Fs2Fs2'Us2Us2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1move=LL'LnLn'LmLm'Rn'RnR'R FF'FnFn'FmFm'Bn'BnB'B UU'UnUn'UmUm'Dn'DnD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRs'FsFs'UsUs' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Ln2Ln2'Lm2Lm2'Rn2'Rn2R2'R2 F2F2'Fn2Fn2'Fm2Fm2'Bn2'Bn2B2'B2 U2U2'Un2Un2'Um2Um2'Dn2'Dn2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rs2'Fs2Fs2'Us2Us2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1

6x6x6
有n、m、c、t、s、amove=LL'LnLn'LmLm'Rm'RmRn'RnR'R FF'FnFn'FmFm'Bm'BmBn'BnB'B UU'UnUn'UmUm'Dm'DmDn'DnD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRs'FsFs'UsUs' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Ln2Ln2'Lm2Lm2'Rm2'Rm2Rn2'Rn2R2'R2 F2F2'Fn2Fn2'Fm2Fm2'Bm2'Bm2Bn2'Bn2B2'B2 U2U2'Un2Un2'Um2Um2'Dm2'Dm2Dn2'Dn2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rs2'Fs2Fs2'Us2Us2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1move=LL'LnLn'LmLm'Rm'RmRn'RnR'R FF'FnFn'FmFm'Bm'BmBn'BnB'B UU'UnUn'UmUm'Dm'DmDn'DnD'D UcUc'FcFc'LcLc' UtUt'DtDt'FtFt'BtBt'RtRt'LtLt' RsRs'FsFs'UsUs' UaFaRaRa'Fa'Ua'.{ pause};L2L2'Ln2Ln2'Lm2Lm2'Rm2'Rm2Rn2'Rn2R2'R2 F2F2'Fn2Fn2'Fm2Fm2'Bm2'Bm2Bn2'Bn2B2'B2 U2U2'Un2Un2'Um2Um2'Dm2'Dm2Dn2'Dn2D2'D2 Uc2Uc2'Fc2Fc2'Lc2Lc2' Ut2Ut2'Dt2Dt2'Ft2Ft2'Bt2Bt2'Rt2Rt2'Lt2Lt2' Rs2Rs2'Fs2Fs2'Us2Us2' Ua2Fa2Ra2Ra2'Fa2'Ua2'.{ pause}&movetext=1&snap=1

bob424200 发表于 2022-5-11 10:44:35

赞! 非常好的功能, 适合这个时代:lol

zhang2345 发表于 2022-5-11 11:49:41

很赞，这样不会再受制于不同网页对一些插件（java、flash等）的限制了！

折翼蚂蝗 发表于 2022-5-12 00:33:36

太好了，又一次在我的电脑上显示出了可以操作的魔方:lol太激动了，期待加入更多异形。

zhang2345 发表于 2022-5-13 08:49:18

加油，希望搞出一个国产pCubes！

假木瓜 发表于 2022-5-13 10:24:36

zhang2345 发表于 2022-5-13 08:49
加油，希望搞出一个国产pCubes！

你这话让我很困惑啊，我又没有开发过模拟器，为什么对我说加油？而且pCubes是桌面应用，暂时也不需要更多了，需要的话把胡波的改成桌面应用也没有障碍。我们最急需的是网页的模拟器，而且要足够轻量，能够嵌入到帖子里，还要支持移动端。
页: [1]
查看完整版本: 介绍一下mf8新的discuz代码——animcube（编辑中）