#js #lib #ui #web https://darkmodejs.learn.uno/ (吐嘈: 为什么我感觉前后端脑回路都不一致, 不是说禁止英文变形的吗)
Features: shows a toggle widget with animation, loads browser
ID:
容许我吐嘈一句:后端基本不屑于把保存首选项什么的列为“特性”,而且我觉得有些话真的没必要说…… 像支持无 ui 使用,以及
顺便提一句,俺也写过 darkmode ,但仅是纯 CSS 直改属性,不能自动适配
Features: shows a toggle widget with animation, loads browser
prefers-color-scheme
, ID:
darkmode-js@1.5.7/lib/darkmode-js.min.jsAPI:
dm=new Darkmode(options={label:'🌗',mixColor,background[color/dark/light],time,bottom/left});
dm.showWidget(); dm.isActivated(); dm.toggle();#css:
body .darkmode--activated
; darmode-ignore /*isloation:isolate*/
; mix-blend-mode:difference/*fun:revert darkmode*/;
Widget: .darkmode
-layer/toggle容许我吐嘈一句:后端基本不屑于把保存首选项什么的列为“特性”,而且我觉得有些话真的没必要说…… 像支持无 ui 使用,以及
npm run build
什么的基本上是通用规范,如果过于强调只能说你写的东西太少了,需要靠这种方式让自己的代码看起来没那么糟糕吧……顺便提一句,俺也写过 darkmode ,但仅是纯 CSS 直改属性,不能自动适配
darkmode.js
🌓 Add darkmode / nightmode to your website in a few seconds
#Kotlin #lib #recommended #functional 小值/验证 IO 库
https://github.com/fork-handles/forkhandles/tree/trunk/values4k#show
这个作者感觉可以,尤其是他也很重视程序的一致性(对称性)
In order to maintain symmetry (and to ensure that we can support inline classes), this method is present on the
Little strange but actually consistent because the display and parse logic should NOT be part of the Value itself, but be separated logically.
像
可以手工验证但这不好看,根本解决方法是定义并引用新类型
原来 Factory 在 Kotlin 的标准是
https://github.com/fork-handles/forkhandles/tree/trunk/values4k#show
这个作者感觉可以,尤其是他也很重视程序的一致性(对称性)
In order to maintain symmetry (and to ensure that we can support inline classes), this method is present on the
ValueFactory
instance.Little strange but actually consistent because the display and parse logic should NOT be part of the Value itself, but be separated logically.
像
fun transferMoneyTo(amount: Int, sortCode: String, accountNumber: String)
是不安全的,因为它有 Int,String 值但值无格式(如非负数什么的)可以手工验证但这不好看,根本解决方法是定义并引用新类型
inline class SortCode(override val value: String): Value<String>尤其是可以 inline (新 Kotlin 限定),然后这种方法强化的类型(格式)安全还可以保证
toString()
时把密码码掉什么的(取原值就用 SortCode.show(c)
了)。class Money private constructor(value: Int) : AbstractValue<Int>(value) {然后就可以
companion object : ValueFactory<Money, Int>(::Money, 1.minValue)
}
class AccountNumber private constructor(value: String) : StringValue(value) {
companion object : StringValueFactory<AccountNumber>(::AccountNumber, "\\d{8}".regex)
}
Money.parse("123"), Money.of(123), Money.of(0)/*throw IAE*/, ofOrNull, ofResult4k/*库自定Result<T>类型*/
这样原来 Factory 在 Kotlin 的标准是
ofXXX(_)
😋 很好看GitHub
fork-handles/forkhandles
Foundational libraries for Kotlin. Contribute to fork-handles/forkhandles development by creating an account on GitHub.
#lib #doc #js ACE code editor
https://ace.c9.io/index.html#nav=howto
https://mivik.gitee.io/compress
https://file.xecades.xyz/Linux/GetKeyDown.html
https://stackoverflow.com/questions/8832320/how-can-i-highlight-code-with-ace-editor
https://medium.com/@jackub/writing-custom-ace-editor-mode-5a7aa83dbe50
https://github.com/ajaxorg/ace#features
https://stackoverflow.com/questions/18614169/set-value-for-ace-editor-without-selecting-the-whole-editor '
啊... 感觉 ACE 真的好草啊
设计上大概就是 replace, getValue 这些常用"UI"功能放 root object
replace(range,text), setValue 放 .session
getSelectedText(), insert(s) 放 .selection
但是它的 cursor 真的好难弄啊,为什么是 {line, column} 的形式呢(Range 也是这种,四元形式...),而且都只有 cursor/selection Left/Right/Up/Down 的无参函数,估计只是给 UI 绑定的
那你定义个鸡毛啊! 就这?! 要知道不管什么文本存储后端, LRUD 四向的代码几乎都差不多,你暴露接口,而且不支持 length 只能为 1? 也没有元编程便利性 API 辅助?
而且
无了无了
https://stackoverflow.com/questions/23278238/ace-code-editor-set-language-dynamically
https://stackoverflow.com/questions/20869962/what-are-the-requirements-for-mode-html-in-ace-editor
https://www.xspdf.com/resolution/54957281.html
https://ace.c9.io/index.html#nav=howto
https://mivik.gitee.io/compress
https://file.xecades.xyz/Linux/GetKeyDown.html
https://stackoverflow.com/questions/8832320/how-can-i-highlight-code-with-ace-editor
https://medium.com/@jackub/writing-custom-ace-editor-mode-5a7aa83dbe50
https://github.com/ajaxorg/ace#features
https://stackoverflow.com/questions/18614169/set-value-for-ace-editor-without-selecting-the-whole-editor '
editor.setValue() does selectAll, forgot to unselect it
'啊... 感觉 ACE 真的好草啊
设计上大概就是 replace, getValue 这些常用"UI"功能放 root object
replace(range,text), setValue 放 .session
getSelectedText(), insert(s) 放 .selection
但是它的 cursor 真的好难弄啊,为什么是 {line, column} 的形式呢(Range 也是这种,四元形式...),而且都只有 cursor/selection Left/Right/Up/Down 的无参函数,估计只是给 UI 绑定的
那你定义个鸡毛啊! 就这?! 要知道不管什么文本存储后端, LRUD 四向的代码几乎都差不多,你暴露接口,而且不支持 length 只能为 1? 也没有元编程便利性 API 辅助?
而且
ace.edit(selector, options)
居然没有用,非得 editor.setOptions
才行无了无了
https://stackoverflow.com/questions/23278238/ace-code-editor-set-language-dynamically
https://stackoverflow.com/questions/20869962/what-are-the-requirements-for-mode-html-in-ace-editor
https://www.xspdf.com/resolution/54957281.html
session()
也挺有意思的,但凡桌面应用都要有撤销重做的能力,这个是 .setMode("ace/mode/sql")
都能重做一样Stack Overflow
How can I highlight code with ACE editor?
I'd like to syntax highlight more than a dozen small snippets of code and then make them editable with ACE Editor by clicking on them, since I think it would be much faster than setting up the full
#js #lib #listing #gui https://editor.datatables.net/generator/
🤔 想起了 #Qt Model/View 的 delegate 和 createEditor 什么的... 但其实从 row 建立可搜索、可排序、可编辑的 table 并不需要那么多名词吧
https://github.com/fiduswriter/Simple-DataTables
嘛,虽说是 lightweight ,其实连 Date format 都支持...
http://fooplugins.github.io/FooTable/ 感觉还是这个最好看
https://github.com/frappe/datatable 这个也支持 inline editing
https://github.com/future-architect/cheetah-grid 有创意,内带比率可视化支持
https://github.com/mleibman/SlickGrid/wiki/Examples 感觉最糟糕的一个
https://github.com/bvaughn/react-virtualized 第二糟糕的
https://github.com/ratiw/vue-table 最像 Qt 的一个... 不对,这不像 Qt
https://github.com/jiren/StreamTable.js 支持 #stream 但只能用 templating 的一个
http://swimlane.github.io/ngx-datatable/#filter Angluar 的一个
https://github.com/daniel-nagy/md-data-table#demo Material #Design 的一个,作者眼力是不是不好... README.md 那么多示例 table 放着呢
https://clusterize.js.org/ #performance #web 🤔给 <tr> 甚至 <il> <div> tag 做 chunking 的简易 js 优化
🤔 想起了 #Qt Model/View 的 delegate 和 createEditor 什么的... 但其实从 row 建立可搜索、可排序、可编辑的 table 并不需要那么多名词吧
https://github.com/fiduswriter/Simple-DataTables
嘛,虽说是 lightweight ,其实连 Date format 都支持...
http://fooplugins.github.io/FooTable/ 感觉还是这个最好看
https://github.com/frappe/datatable 这个也支持 inline editing
https://github.com/future-architect/cheetah-grid 有创意,内带比率可视化支持
https://github.com/mleibman/SlickGrid/wiki/Examples 感觉最糟糕的一个
https://github.com/bvaughn/react-virtualized 第二糟糕的
https://github.com/ratiw/vue-table 最像 Qt 的一个... 不对,这不像 Qt
https://github.com/jiren/StreamTable.js 支持 #stream 但只能用 templating 的一个
http://swimlane.github.io/ngx-datatable/#filter Angluar 的一个
https://github.com/daniel-nagy/md-data-table#demo Material #Design 的一个,作者眼力是不是不好... README.md 那么多示例 table 放着呢
https://clusterize.js.org/ #performance #web 🤔给 <tr> 甚至 <il> <div> tag 做 chunking 的简易 js 优化
GitHub
GitHub - fiduswriter/simple-datatables: DataTables but in TypeScript transpiled to Vanilla JS
DataTables but in TypeScript transpiled to Vanilla JS - fiduswriter/simple-datatables