add legacy support of checkbox, add documents for cookie/lgres/request

lib/utility/cookie.html

@@ -0,0 +1,40 @@
+<div>
+    <h1>cookie</h1>
+    <hr />
+    <p>
+        cookie 操作工具类：获取、设置、删除。
+    </p>
+    <h2>getCookie</h2>
+    <code>function getCookie(name: string): string</code>
+    <h3>name: string</h3>
+    <p>
+        待获取的 cookie 关键字
+    </p>
+    <h2>setCookie</h2>
+    <code>function setCookie(name: string, value: string, expireDays?: Number): void</code>
+    <h3>name: string</h3>
+    <p>
+        待设置的 cookie 关键字
+    </p>
+    <h3>value: string</h3>
+    <p>
+        待设置的值
+    </p>
+    <h3>expireDays?: Number</h3>
+    <p>
+        有效期天数
+    </p>
+    <h2>deleteCookie</h2>
+    <code>function deleteCookie(name: string): void</code>
+    <h3>name: string</h3>
+    <p>
+        待删除的 cookie 关键字
+    </p>
+    <hr />
+    <h2>用法</h2>
+    <pre>const cookie = window["lib-utility"];
+
+cookie.getCookie('user_id');
+cookie.setCookie('user_id', 'guest');
+cookie.deleteCookie('user_id');</pre>
+</div>

lib/utility/lgres.d.ts

@@ -3,7 +3,11 @@ interface LgresOptions {
     callback?: (result: any) => void
 }
 
-export function init(dom?: HTMLElement, options?: LgresOptions): Promise<any>
+interface LanguageResource {
+    r(key: string, defaultValue?: any): any
+}
+
+export function init(dom?: HTMLElement, options?: LgresOptions): Promise<LanguageResource>
 export function r(key: string, defaultValue?: any): any
 export const lang: {
     get current(): string,

lib/utility/lgres.html

@@ -0,0 +1,74 @@
+<div>
+    <h1>lgres</h1>
+    <hr />
+    <p>
+        语言资源工具类，用以设置页面以及脚本中的多语言。
+    </p>
+    <h2>r</h2>
+    <code>function r(key: string, defaultValue?: any): any</code>
+    <h3>key: string</h3>
+    <p>
+        语言资源的关键字
+    </p>
+    <h3>defaultValue?: any</h3>
+    <p>
+        资源的默认值，如无法获取该语言资源，则返回该值
+    </p>
+    <h2>lang</h2>
+    <code>const lang : {}</code>
+    <h3>get current(): string</h3>
+    <p>
+        返回当前语言 id
+    </p>
+    <h3>get unknownError(): string</h3>
+    <p>
+        未知错误的语言资源，默认为 <code>'An unknown error occurred, please contact the administrator.'</code>
+    </p>
+    <h3>get savedSuccessfully(): string</h3>
+    <p>
+        保存成功的语言资源，默认为 <code>'Saved successfully.'</code>
+    </p>
+    <h2>init</h2>
+    <code>function init(dom?: HTMLElement, options?: LgresOptions): Promise&lt;LanguageResource&gt;</code>
+    <h3>dom?: HTMLElement</h3>
+    <p>
+        待处理的元素，为空时处理整个页面
+    </p>
+    <h3>options?: LgresOptions</h3>
+    <p>
+        初始化参数，结构为
+    <pre>interface LgresOptions {
+    template?: string,
+    callback?: (result: any) => void
+}</pre>
+    </p>
+    <h3>template?: string</h3>
+    <p>
+        语言资源文件的后缀，资源文件 url 为 <code>`language/${lgid}${template}`</code>
+    </p>
+    <h3>callback?: (result: any) => void</h3>
+    <p>
+        资源初始化后的回调函数，可能在 DOM 加载完成之前触发。
+    </p>
+    <h3>return: Promise&lt;LanguageResource&gt;</h3>
+    <p>
+        返回一个包含资源结果的 Promise，将在 DOM 加载完成之后触发。
+    </p>
+    <p><code>LanguageResource</code> 结构为
+    <pre>interface LanguageResource {
+    r(key: string, defaultValue?: any): any
+}</pre>
+    </p>
+    <hr />
+    <h2>用法</h2>
+    <pre>const lgres = window["lib-utility"];
+
+lgres.init(document.body, {
+    template: '/res.json',
+    callback: (res) => document.title = res.r('title', 'Default Title')
+}).then(res => {
+    document.querySelector('#header').innerText = res.r('header', 'My Header');
+    const msg = lgres.lang.unknownError;
+    document.querySelector('#message').innerText = lgres.lang.unknownError;
+});</pre>
+</div>

lib/utility/lgres.js

@@ -51,19 +51,25 @@ async function doRefreshLgres(template) {
     const r = await get(`language/${lgid}${template}`);
     const dict = await r.json();
     localStorage.setItem(getStorageKey(lgid), JSON.stringify(dict));
-    cache = dict;
     return dict;
 }
 
 async function refreshLgres(template, lgres) {
     if (lgres == null || typeof consts === 'undefined') {
-        return await doRefreshLgres(template);
+        lgres = await doRefreshLgres(template);
     }
     const ver = Number(consts.resver);
     if (isNaN(lgres.ver) || isNaN(ver) || ver > lgres.ver) {
         console.log(`found new language res version: ${lgres.ver} => ${ver}`);
-        return await doRefreshLgres(template);
+        lgres = await doRefreshLgres(template);
     }
+    Object.defineProperty(lgres, 'r', {
+        writable: false,
+        configurable: false,
+        value: function (key, defaultValue) {
+            return getLanguage(this, key, defaultValue);
+        }
+    });
     cache = lgres;
     return lgres;
 }

lib/utility/request.d.ts

@@ -9,4 +9,4 @@ interface RequestOptions {
 
 export function get(url: string, options?: RequestOptions): Promise<Response>
 export function post(url: string, data?: BodyInit | null, options?: RequestOptions): Promise<Response>
-export function upload(url: string, data: FormData, options?: RequestOptions): Promise<Response>
+export function upload(url: string, data: FormData, options?: RequestOptions): Promise<XMLHttpRequest>

lib/utility/request.html

@@ -0,0 +1,37 @@
+<div>
+    <h1>request</h1>
+    <hr />
+    <p>
+        网络请求工具类，可以实现比较常见的一些请求操作。
+    </p>
+    <h2>get</h2>
+    <code>function get(url: string, options?: RequestOptions): Promise&lt;Response&gt;</code>
+    <h3>url: string</h3>
+    <p>
+        url 地址
+    </p>
+    <h3>options?: RequestOptions</h3>
+    <p>
+        请求的配置参数，结构为
+    <pre>interface RequestOptions {
+    method?: string;
+    accept?: string;
+    contentType?: string;
+    customerHeaders?: { [key: string]: string };
+    signal?: AbortSignal | null;
+    progress?: (this: XMLHttpRequestUpload, ev: ProgressEvent&lt;XMLHttpRequestEventTarget&gt;) => any
+}</pre>
+    </p>
+    <h3>method?: string</h3>
+    <p>
+        请求类型，默认为 GET 或 POST
+    </p>
+    <h3>accept?: string</h3>
+    <p>
+        Accept 请求头的值
+    </p>
+    <h3>contentType?: string</h3>
+    <p>
+        Content-Type 请求头的值
+    </p>
+</div>