add typescript supports

Author: zhangfisher

.vscode/launch.json

@@ -7,11 +7,19 @@
         {
             "type": "node",
             "request": "launch",
-            "name": "Launch Program",
+            "name": "Demo",
             "skipFiles": [
                 "<node_internals>/**"
             ],
             "program": "${workspaceFolder}\\demo.js"
+        },{
+            "type": "node",
+            "request": "launch",
+            "name": "Launch Program",
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            "program": "${file}"
         },
         {
             "type": "node",

.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+    "cSpell.words": [
+        "logsets",
+        "progressbar"
+    ]
+}

banner.demo.js

@@ -9,8 +9,8 @@ let banner = logger.banner({
 
 banner.add("Logsets Utility Toolkit")
 banner.add("Output color elements at the terminal")
-banner.add("Version: ",1)
-banner.add("Release: ","2022-01-01")
+banner.add("Version:{} ",1)
+banner.add("Release:{#red}   ","2022-01-01")
 banner.render()
 
 
@@ -19,11 +19,11 @@ banner = logger.banner({
 })
 
 banner.add("Logsets工具库")
-banner.add("在终端命令行输出彩色文本",{style:"darkGray"})
+banner.add("在终端命令行输出彩色文本")
 banner.add()
-banner.add("版本: ",1)
-banner.add("网站: ","http://www.logsets.com",{align: 'left',style:["","lightBlue"]})
-banner.add("发布日期: ","2022-01-01",{align: 'right',style:["","lightMagenta"]})
-banner.add("作者: ","fisher",{align: 'right',style:["","lightCyan"]})
-banner.add("许可证: ","MIT ","GPL ","Apache 2.0",{style:["","red"]})
+banner.add("版本: {}",1)
+banner.add("网站: {}","http://www.logsets.com",{align: 'left'})
+banner.add("发布日期:{}","2022-01-01",{align: 'right'})
+banner.add("作者:{author}",{author:"fisher"},{align: 'right'})
+banner.add("许可证: {#lightYellow} {} {}",["MIT","GPL","Apache 2.0"])
 banner.render()

banner.plugin.d.ts

@@ -0,0 +1,30 @@
+
+export interface BannerPluginOptions  { 
+    indent?       : string                          // 横幅缩进
+    border?       : {
+        style?    : string                          // 边框颜色
+        width?    : 0 | 1 | 2                       // 边框宽度,0-不显示，1-单线框,2-双线框
+    },
+    title?       : {
+        align?   : 'left' | 'center' | 'right'      // 标题对齐方式     
+        style?   : string                           // 标题颜色
+        wrapper? : string                           // 原本是使用☆ ☆ ☆标题包裹符号比较好看，但是 
+    },
+    align?        : 'left' | 'center' | 'right'     // 横幅行默认对齐方式，默认居中
+    paddingLeft?  : number                           // 左右空白宽度
+    paddingRight? : number
+    paddingTop?   : number                           // 顶部空白行
+    paddingBottom?: number
+}
+ 
+export interface Banner{
+    add(text:string,vars?:any[] | Record<string>,options?:BannerPluginOptions):void
+    render():void
+}
+
+export declare const BannerPlugin: {
+    (logsets:Logsets,options:DeepRequired<BannerPluginOptions>):Banner
+}
+
+export default BannerPlugin
+ 

banner.plugin.js

@@ -23,8 +23,8 @@
    ★☆
 
 */
-import { consoleOutput, getLeftRepeatChars, getRightRepeatChars, getStringWidth, isPlainObject, paddingCenter,paddingStart, paddingEnd } from "./utils.js"
-import deepmerge from 'deepmerge'
+import { consoleOutput, getLeftRepeatChars, getRightRepeatChars, getStringWidth, paddingCenter,paddingStart, paddingEnd } from "./utils.js"
+import deepmerge from 'deepmerge' 
 
 const  DefaultBannersOptions = { 
     indent       : " ",                          // 横幅缩进
@@ -34,34 +34,29 @@ const  DefaultBannersOptions = {
     },
     title        : {
         align    : "center",                     // 标题对齐方式     
-        style    : ["","","green,bright","",""], // 标题颜色
-        wrapper  : "==="                       // ☆ ☆ ☆标题包裹符号,用来装饰 
+        style    : "green,bright",               // 标题颜色
+        wrapper  : "--=="                         // 原本是使用☆ ☆ ☆标题包裹符号比较好看，但是 
     },
     align        : "center",                     // 横幅行默认对齐方式，默认居中
     paddingLeft  : 4,                            // 左右空白宽度
     paddingRight : 4,
-    paddingTop   : 1,
+    paddingTop   : 0,                            // 顶部空白行
     paddingBottom: 1
 }
 
 function createBanner(context,options){
     const logger = this 
-    let opts = deepmerge(DefaultBannersOptions,options)
-    const colorizer = logger.getColorizer 
-
+    let opts = deepmerge(DefaultBannersOptions,options) 
     let lines = []  // [{text,style,align}] 
     function renderBanner(){
         // 计算最大行宽度
         const paddingLeft = new Array(opts.paddingLeft).fill(" ").join("")
         const paddingRight = new Array(opts.paddingRight).fill(" ").join("")
         let totalWidth = lines.reduce((width,line,index)=>{
             if(index===0){  // 第一行视为标题行
-                line.text.splice(0,0,"  ")
-                line.text.splice(0,0,opts.title.wrapper)
-                line.text.push("  ")
-                line.text.push(opts.title.wrapper)
+                line.text = `${opts.title.wrapper}  ${logger.colorized(line.text,opts.title.style)}  ${opts.title.wrapper.reverse()}`
             }
-            return Math.max(width,getStringWidth(line.text.join("")))           
+            return Math.max(width,getStringWidth(line.text))           
         },0) + opts.paddingLeft + opts.paddingRight
         if(typeof(opts.width)==="number" && opts.width > totalWidth){
             totalWidth = opts.width
@@ -74,38 +69,36 @@ function createBanner(context,options){
             consoleOutput("║"+new Array(totalWidth).fill(" ").join("")+"║")
         })
         // 
-        // ║           ║    line = {text:[],style,align}
+        // ║           ║    line = {text:[],vars,align}
 
         lines.map((line,index)=>{
-            let lineText = line.text.join("")
+            let lineText = (line.text || "").trim()
+            let coloredLineText = lineText
             let t = ""
             let leftSpace="",rightSpace=""
             if(lineText.trim()===""){
                 leftSpace=new Array(totalWidth).fill(" ").join("")
             }else{
+                coloredLineText = logger.getColorizedTemplate(lineText,line.vars)
                 if(line.align==="left"){
-                    t= paddingEnd(lineText,totalWidth-opts.paddingLeft-opts.paddingRight)
+                    t= paddingEnd(coloredLineText,totalWidth-opts.paddingLeft-opts.paddingRight)
                 }else if(line.align==="right"){
-                    t= paddingStart(lineText,totalWidth-opts.paddingLeft-opts.paddingRight)
+                    t= paddingStart(coloredLineText,totalWidth-opts.paddingLeft-opts.paddingRight)
                 }else{
-                    t= paddingCenter(lineText,totalWidth-opts.paddingLeft-opts.paddingRight)
+                    t= paddingCenter(coloredLineText,totalWidth-opts.paddingLeft-opts.paddingRight)
                 }
                 leftSpace = paddingLeft + getLeftRepeatChars(t) + (index==0 ? "" : "")
                 rightSpace= paddingRight + getRightRepeatChars(t) + (index==0 ? "" : "")
             }
+
 
-            let lineStyles =Array.isArray(line.style) ? line.style : (line.style ? [line.style] : [])
-            if(lineStyles.length===0 && index===0) lineStyles = opts.title.style
 
-            const coloredLineTexts =lineStyles.length==0 ?  line.text : line.text.map((t,i)=>{
-                return colorizer(i<lineStyles.length ?  lineStyles[i] : lineStyles[lineStyles.length-1])(t)
-            })
-            logger.print("║",leftSpace,...coloredLineTexts,rightSpace,"║",{append:""}) 
+            logger.print("║",leftSpace,coloredLineText,rightSpace,"║",{append:""}) 
             // 在标题栏下增加一行分割线╟ ─  ╢
-            // if(index===0){
-            //     //consoleOutput("║"+new Array(totalWidth).fill(" ").join("")+"║")
-            //     consoleOutput("╟"+new Array(totalWidth).fill("─").join("")+"╢")
-            // }
+            if(index===0){
+                //consoleOutput("║"+new Array(totalWidth).fill(" ").join("")+"║")
+                consoleOutput("╟"+new Array(totalWidth).fill("─").join("")+"╢")
+            }
         })
 
         // 留出空白行
@@ -115,32 +108,25 @@ function createBanner(context,options){
         // ╚═══════════╝
         consoleOutput("╚"+new Array(totalWidth).fill("═").join("")+"╝")
     }
-
-    function getLineFromArgs(){ 
-        let linOptions = {align:opts.align,style:""}
-        let text = []
-        if(arguments.length>1 && isPlainObject(arguments[arguments.length-1])){
-            Object.assign(linOptions,arguments[arguments.length-1])
-            text = [...arguments].slice(0,-1)
-        }else{
-            text = [...arguments]
-        } 
-        return {text,...linOptions}
-    }
-    return {
-        addTitle(text,options={}){  
-            lines.splice(0,0,getLineFromArgs(...arguments)) 
-        },
-        // add(text,options={}) add([text,text,text])
-        add(){ 
-            lines.push(getLineFromArgs(...arguments))
+    return { 
+        add(text,vars={},options={}){ 
+            lines.push({
+                text,
+                vars,
+                ...options
+            })
         },
         render:()=>{
             renderBanner()
         }
     }
 
 }
+
+
+
+
+
 /**
  * 
  * @param {*} logger 

colorize.js

@@ -3,7 +3,7 @@
 import stringifyObject from './stringify.js';
 import deepmerge from "deepmerge"
 import ansicolor from 'ansicolor'
-import { isClass,isPlainObject,isAsyncFunction,getDataType, isRegexp,firstUpper } from './utils.js';
+import { isPlainObject,getDataType } from './utils.js';
 import { DefaultOptions } from './consts.js';
 
 Object.assign(ansicolor.rgb,{
@@ -53,7 +53,9 @@ export function getColorizeFunction(style){
     }    
     return func || ansicolor.dim
 }
-
+export function colorizeString(text,style){
+    return getColorizeFunction(style)(text)
+}
 
 function colorizeBaseType(value,opts){
     let options = opts
@@ -73,7 +75,11 @@ function colorizeBaseType(value,opts){
 }
 
 /**
+ * 
  * 返回着色后的字符串
+ * 
+ * 不同的数据类型按不同的颜色进行显示
+ * 
  * @param {*} obj 
  * @param {*} opts 
  * @returns 

demo.js

@@ -17,15 +17,15 @@ class MyError extends Error {
         super(message) 
     }
 }
-async function delay(n=100){
+async function delay(n=50){
     return new Promise(resolve=>{
         setTimeout(resolve,n)
     })
 }
 
 
 logger.log("------------")
-for(let i = 0 ; i < 100; i++){
+for(let i = 0 ; i < 100; i=i+10){
     await delay(10)
     logger.print("已下载",i,"%",{end:"\r"})
 }
@@ -38,6 +38,10 @@ logger.print({z:()=>{}})
 logger.log("{a}+{b}={c}",{a:1,b:1,c:2})
 logger.log("My name is {}","tom")
 logger.log("{a}+{b}={c}",{a:1,b:1,c:2})
+logger.log("位置参数插值:{a}+{b}={c}",1,2,3)
+logger.log("指定颜色{#red a}+{#bgGreen,bgLightYellow b}={c} {x}",{a:1000,b:12222,c:2,x:"HELLO"})
+logger.log("Welcome to {#red VoerkaI18n}")
+
 
 logger.print("String",true,100,()=>{},[1,2,3])
 logger.print(null,undefined)