ziko 0.0.23 → 0.0.24

package/src/graphics/canvas/canvas.js

@@ -1,176 +0,0 @@
-import ZikoUIContainerElement from "../../ui/elements/primitives/ZikoUIContainerElement.js";
-import {Matrix} from "../../math/matrix/index.js"
-// import { convolute } from "../../math/signal/conv.js";
-class ZikoUICanvas extends ZikoUIContainerElement{
-    constructor(w,h){
-        super("canvas","canvas");
-        this.ctx = this.element?.getContext("2d");
-        this.style({
-            border:"1px red solid",
-        })
-        this.transformMatrix=new Matrix([
-            [1,0,0],
-            [0,1,0],
-            [0,0,1]
-        ])
-        this.axisMatrix=new Matrix([
-            [-10,-10],
-            [10,10]
-        ])
-        // setTimeout(()=>this.resize(w,h),0);
-        requestAnimationFrame(()=>this.resize(w,h),0);
-        this.on("sizeupdated",()=>this.adjust())
-    }
-    get Xmin(){
-        return this.axisMatrix[0][0];
-    }
-    get Ymin(){
-        return this.axisMatrix[0][1];
-    }
-    get Xmax(){
-        return this.axisMatrix[1][0];
-    }
-    get Ymax(){
-        return this.axisMatrix[1][1];
-    }
-    get ImageData(){
-        return this.ctx.getImageData(0,0,c.Width,c.Height);
-    }
-    draw(all=true){
-        if(all){
-            this.clear();  
-            this.items.forEach(element => {
-                element.parent=this;
-                element.draw(this.ctx)
-            });
-        }
-        else {
-            this.items.at(-1).parent=this;
-            this.items.at(-1).draw(this.ctx);
-        }
-        this.maintain();
-        return this;
-    }
-    applyTransformMatrix(){
-        this.ctx.setTransform(
-            this.transformMatrix[0][0],
-            this.transformMatrix[1][0],
-            this.transformMatrix[0][1],
-            this.transformMatrix[1][1],
-            this.transformMatrix[0][2],
-            this.transformMatrix[1][2],
-        );
-        return this;
-    }
-    resize(w,h){
-        this.size(w,h)
-        this.lineWidth();
-        this.view(this.axisMatrix[0][0], this.axisMatrix[0][1], this.axisMatrix[1][0], this.axisMatrix[1][1]);
-        this.emit("sizeupdated");
-        return this;
-    }
-    adjust(){
-        this.element.width =this.element?.getBoundingClientRect().width;
-        this.element.height =this.element?.getBoundingClientRect().height;
-        this.view(this.axisMatrix[0][0], this.axisMatrix[0][1], this.axisMatrix[1][0], this.axisMatrix[1][1]);
-        return this;
-    }
-    view(xMin,yMin,xMax,yMax){
-        this.transformMatrix[0][0]=this.width/(xMax-xMin); // scaleX
-        this.transformMatrix[1][1]=-this.height/(yMax-yMin); // scaleY
-        this.transformMatrix[0][2]=this.width/2;
-        this.transformMatrix[1][2]=this.height/2;
-        this.axisMatrix=new Matrix([
-            [xMin,yMin],
-            [xMax,yMax]
-        ])
-        
-        this.applyTransformMatrix(); 
-        this.clear();
-        this.lineWidth(1);
-        this.draw();
-        return this;
-    }
-    reset(){
-        this.ctx.setTransform(1,0,0,0,0,0);
-        return this;
-    }
-    append(element){
-        this.items.push(element);
-        this.draw(false);
-        return this;
-    }
-    background(color){
-        this.ctx.fillStyle = color;
-        this.ctx.setTransform(1, 0, 0, 1, 0, 0);
-        this.ctx.fillRect(0, 0, this.width, this.height);
-        this.applyTransformMatrix();
-        this.draw();
-    }
-    lineWidth(w){
-        this.ctx.lineWidth=w/this.transformMatrix[0][0];
-        return this
-    }
-    getImageData(x=0,y=0,w=this.width,h=this.height){
-        return this.ctx.getImageData(x,y,w,h);
-    }
-    clear(){
-        this.ctx.setTransform(1, 0, 0, 1, 0, 0);
-        this.ctx.clearRect(0, 0, this.width, this.height);
-        this.applyTransformMatrix(); 
-        return this;
-    }
-    clone(){
-        console.log(this.width)
-        const canvas=new ZikoUICanvas();
-        canvas.items=this.items;
-        canvas.transformMatrix=this.transformMatrix;
-        canvas.axisMatrix=this.axisMatrix;
-        Object.assign(canvas.cache,{...this.cache});
-        //waitForUIElm(this)
-        //console.log(element)
-        this.size(this.element.style.width,this.element.style.width);
-        this.applyTransformMatrix();
-        this.draw();
-        this.adjust();
-        return canvas;
-    }
-    toImage() {
-        this.img = document?.createElement("img");
-        this.img.src = this.element?.toDataURL("image/png");
-        return this;
-    }
-    toBlob() {
-        var canvas = this.element;
-        canvas.toBlob(function (blob) {
-            var newImg = document?.createElement("img"),
-                url = URL.createObjectURL(blob);
-            newImg.onload = function () {
-                URL.revokeObjectURL(url);
-            };
-            newImg.src = url;
-            console.log(newImg);
-        });
-    }
-    zoomIn(){
-
-    }
-    zoomOut(){
-        
-    }
-    undo(n){
-
-    }
-    redo(n){
-
-    }
-    stream(){
-
-    }
-}
-
-const Canvas=(w,h)=>new ZikoUICanvas(w,h);
-export{
-    ZikoUICanvas,
-    Canvas
-}

package/src/graphics/svg/svg.js

@@ -1,69 +0,0 @@
-import { ZikoUIContainerElement } from "../../ui/index.js";
-class ZikoUISvg extends ZikoUIContainerElement {
-    constructor(w=360,h=300) {
-      super("svg","svg");
-      //this.cache={};
-      // this.setAttr("width",w);
-      // this.setAttr("height",h);
-      // this.setAttr({
-      //   width : w,
-      //   height : h
-      // })
-      this.style({border:"1px black solid"});
-      //this.view(-w/2,-h/2,w/2,h/2);
-      this.size(w, h)
-      this.view(-10,-10,10,10);
-    }
-    size(w, h){
-      this.setAttr({
-        width : w,
-        height : h
-      });
-      return this
-    }
-    view(x1,y1,x2,y2){
-      let width=Math.abs(x2-x1);
-      let height=Math.abs(y2-y1);
-      this.setAttr("viewBox",[x1,y1,width,height].join(" "));
-      this.st.scaleY(-1);
-      return this;
-    }
-    add(...svgElement){
-      for(let i=0;i<svgElement.length;i++){
-        this.element.append(svgElement[i].element);
-        this.items.push(svgElement[i])
-      }
-      this.maintain()
-      return this;
-    }
-    remove(...svgElement){
-      for(let i=0;i<svgElement.length;i++){
-        this.element?.removeChild(svgElement[i].element);
-        this.items=this.items.filter(n=>!svgElement)
-      }
-      this.maintain();
-      return this;     
-    }
-    mask(){
-  
-    }
-    toString(){
-      return  (new XMLSerializer()).serializeToString(this.element);
-    }
-    btoa(){
-      return btoa(this.toString())
-    }
-    toImg(){
-      return 'data:image/svg+xml;base64,'+this.btoa()
-    }
-    toImg2(){
-      return "data:image/svg+xml;charset=utf8,"+this.toString().replaceAll("<","%3C").replaceAll(">","%3E").replaceAll("#","%23").replaceAll('"',"'");
-    }
-    
-  }
-
-  const Svg =(w,h)=>new ZikoUISvg(w,h);
-  export{
-    Svg,
-    ZikoUISvg,
-}

package/src/types.js

@@ -1,73 +0,0 @@
-// import ZikoUIElement from "./ui/elements/primitives/ZikoUIElement";
-// import ZikoUIContainerElement from "./ui/elements/primitives/ZikoUIContainerElement";
-
-// export {
-//     ZikoUIElement,
-//     ZikoUIContainerElement
-// }
-// export {
-//     ZikoUIAbbrText,
-//     ZikoUIAccordion,
-//     ZikoUIArticle,
-//     ZikoUIAside,
-//     ZikoUIAudio,
-//     ZikoUIBlockQuote,
-//     ZikoUIBr,
-//     ZikoUIBreadcrumbs,
-//     ZikoUICodeNote,
-//     ZikoUICodeText,
-//     ZikoUIDefintion,
-//     ZikoUIFigure,
-//     ZikoUIFlex,
-//     ZikoUIFooter,
-//     ZikoUIForm,
-//     ZikoUIGrid,
-//     ZikoUIHeader,
-//     ZikoUIHeading,
-//     ZikoUIHorizontalSplitter,
-//     ZikoUIHorizontalSlider,
-//     ZikoUIHr,
-//     ZikoUIHtmlTag,
-//     ZikoUIImage,
-//     ZikoUIInput,
-//     ZikoUIInputCheckbox,
-//     ZikoUIInputColor,
-//     ZikoUIInputDatalist,
-//     ZikoUIInputDate,
-//     ZikoUIInputDateTime,
-//     ZikoUIInputEmail,
-//     ZikoUIInputImage,
-//     ZikoUIInputNumber,
-//     ZikoUIInputOption,
-//     ZikoUIInputPassword,
-//     ZikoUIInputRadio,
-//     ZikoUIInputSearch,
-//     ZikoUIInputSlider,
-//     ZikoUIInputTime,
-//     ZikoUILabel,
-//     ZikoUILink,
-//     ZikoUIMain,
-//     ZikoUIMenu3d,
-//     ZikoUIModal,
-//     ZikoUINav,
-//     ZikoUIParagraphe,
-//     ZikoUIQuote,
-//     ZikoUISection,
-//     ZikoUISelect,
-//     ZikoUISubText,
-//     ZikoUISupText,
-//     ZikoUIText,
-//     ZikoUITextArea,
-//     ZikoUIVerticalSplitter,
-//     ZikoUIVerticalSlider,
-//     ZikoUIVideo,
-// } from "./ui/index.js"
-
-// export{
-//     Matrix,
-//     LinearSystem,
-//     Complex,
-//     Random,
-// } from "./math/index.js"
-
-

package/src/ui/elements/derived/index.js

@@ -1,12 +0,0 @@
-export * from "./flex";
-export * from "./grid";
-export * from "./accordion";
-export * from "./carousel";
-export * from "./code-note";
-export * from "./tabs";
-export * from "./alert";
-export * from "./splitter";
-export * from "./pagination";
-export * from "./menu";
-export * from "./modal"
-export * from "./slider"

package/src/ui/elements/primitives/ZikoUIContainerElement.js

@@ -1,123 +0,0 @@
-import ZikoUIElement from "./ZikoUIElement";
-import { text } from "./text";
-class ZikoUIContainerElement extends ZikoUIElement {
-  constructor(element, name = "") {
-    super(element, name);
-    this.items = [];
-  }
-  // maintain() {
-  //   for (let i = 0; i < this.items.length; i++)
-  //     Object.assign(this, { [[i]]: this.items[i] });
-  //   this.length = this.items.length;
-  //   return this;
-  // }
-  // at(index) {
-  //   return this.items.at(index);
-  // }
-  // #addItem(adder, pusher, ...ele) {
-  //   if (this.cache.isFrozzen) {
-  //     console.warn("You can't append new item to frozzen element");
-  //     return this;
-  //   }
-  //   for (let i = 0; i < ele.length; i++) {
-  //     if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
-  //     if (ele[i] instanceof ZikoUIElement) {
-  //       ele[i].cache.parent = this;
-  //       this.element[adder](ele[i].element);
-  //       ele[i].target = this.element;
-  //       this.items[pusher](ele[i]);
-  //     } else if (ele[i] instanceof Object) {
-  //       if (ele[i]?.style) this.style(ele[i]?.style);
-  //       if (ele[i]?.attr) {
-  //         Object.entries(ele[i].attr).forEach((n) =>
-  //           this.setAttr("" + n[0], n[1]),
-  //         );
-  //       }
-  //     }
-  //   }
-  //   this.maintain();
-  //   return this;
-  // }
-  // append(...ele) {
-  //   this.#addItem("append", "push", ...ele);
-  //   return this;
-  // }
-  // prepend(...ele) {
-  //   this.#addItem("prepend", "unshift", ...ele);
-  //   return this;
-  // }
-  // insertAt(index, ...ele) {
-  //   if (index >= this.element.children.length) this.append(...ele);
-  //   else
-  //     for (let i = 0; i < ele.length; i++) {
-  //       if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
-  //       this.element?.insertBefore(ele[i].element, this.items[index].element);
-  //       this.items.splice(index, 0, ele[i]);
-  //     }
-  //   return this;
-  // }
-  // remove(...ele) {
-  //   const remove = (ele) => {
-  //     if (typeof ele === "number") ele = this.items[ele];
-  //     if (ele instanceof ZikoUIElement) this.element?.removeChild(ele.element);
-  //     this.items = this.items.filter((n) => n !== ele);
-  //   };
-  //   for (let i = 0; i < ele.length; i++) remove(ele[i]);
-  //   for (let i = 0; i < this.items.length; i++)
-  //     Object.assign(this, { [[i]]: this.items[i] });
-  //   // Remove from item
-  //   return this;
-  // }
-  // forEach(callback) {
-  //   this.items.forEach(callback);
-  //   return this;
-  // }
-  // map(callback) {
-  //   return this.items.map(callback);
-  // }
-  // find(condition) {
-  //   return this.items.filter(condition);
-  // }
-  // filter(condition_callback, if_callback = () => {}, else_callback = () => {}) {
-  //   const FilterItems = this.items.filter(condition_callback);
-  //   FilterItems.forEach(if_callback);
-  //   this.items
-  //     .filter((item) => !FilterItems.includes(item))
-  //     .forEach(else_callback);
-  //   return this;
-  // }
-  // filterByTextContent(text, exactMatch = false) {
-  //   this.items.forEach((n) => n.render());
-  //   this.filter(
-  //     (n) => !(exactMatch ? n.text === text : n.text.includes(text)),
-  //     (e) => e.unrender(),
-  //   );
-  //   // this.items.filter(n=>{
-  //   //   const content=n.element.textContent;
-  //   //   return !(exactMatch?content===text:content.includes(text))
-  //   // }).map(n=>n.unrender());
-  //   //  return this;
-  // }
-  // filterByClass(value) {
-  //   this.items.map((n) => n.render());
-  //   this.items
-  //     .filter((n) => !n.classes.includes(value))
-  //     .map((n) => n.unrender());
-  //   return this;
-  // }
-  // sortByTextContent(value, displays) {
-  //   let item = this.children;
-  //   item
-  //     .filter((n) => !n.textContent.toLowerCase().includes(value.toLowerCase()))
-  //     .map((n) => {
-  //       n.style.display = "none";
-  //     });
-  //   item
-  //     .filter((n) => n.textContent.toLowerCase().includes(value.toLowerCase()))
-  //     .map((n, i) => (n.style.display = displays[i]));
-  //   //return item.filter(n=>n.style.display!="none")
-  //   item.filter((n) => n.style.display != "none");
-  //   return this;
-  // }
-}
-export default ZikoUIContainerElement;