add libfabric and ImageEditor

ImageEditor/README.md

@@ -0,0 +1,22 @@
+# Image Editor
+Full featured image editor using HTML5 Canvas.
+
+This application is a wrapper of the [TOAST UI Image editor](https://github.com/nhn/tui.image-editor).
+
+**Features:**
+
+* Load image to canvas
+* Undo/Redo (With shortcut)
+* Crop
+* Flip
+* Rotation
+* Free drawing
+* Line drawing
+* Shape
+* Icon
+* Text
+* Mask Filter
+* Image Filter
+
+## Changes log
+* v0.1.0-a: First release

ImageEditor/assets/scheme.html

@@ -0,0 +1,10 @@
+<afx-app-window apptitle="Image Editor" width="600" height="600" data-id="ImageEditor">
+    <afx-hbox>
+        <div data-width="2"></div>
+        <afx-vbox>
+            <div data-id="stage"></div>
+            <div data-height="2"></div>
+        </afx-vbox>
+        <div data-width="2"></div>
+    </afx-hbox>
+</afx-app-window>

ImageEditor/build/debug/README.md

@@ -0,0 +1,22 @@
+# Image Editor
+Full featured image editor using HTML5 Canvas.
+
+This application is a wrapper of the [TOAST UI Image editor](https://github.com/nhn/tui.image-editor).
+
+**Features:**
+
+* Load image to canvas
+* Undo/Redo (With shortcut)
+* Crop
+* Flip
+* Rotation
+* Free drawing
+* Line drawing
+* Shape
+* Icon
+* Text
+* Mask Filter
+* Image Filter
+
+## Changes log
+* v0.1.0-a: First release

ImageEditor/build/debug/main.js

@@ -0,0 +1 @@
+(function(){var i;(i=class extends this.OS.application.BaseApplication{constructor(i){super("ImageEditor",i),this.currfile=void 0,this.args&&this.args.length>0&&this.args[0].path&&(this.currfile=i[0].path.asFileHandle())}main(){var i;return this.stage=this.find("stage"),this.stage.id=this.eid,i={path:"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",name:"Blank"},this.currfile&&(i={path:this.currfile.getlink(),name:this.currfile.filename},this.scheme.apptitle=this.currfile.path),this.editor=new tui.ImageEditor(this.stage,{cssMaxWidth:700,cssMaxHeight:500,usageStatistics:!1,includeUI:{initMenu:"filter",menuBarPosition:"bottom",loadImage:i}}),this.on("resize",()=>this.editor.ui.resizeEditor()),this.editor.ui.resizeEditor(),this.bindKey("ALT-O",()=>this.actionFile("open")),this.bindKey("CTRL-S",()=>this.actionFile("save")),this.bindKey("ALT-W",()=>this.actionFile("saveas"))}open(){if(this.currfile)return this.editor.loadImageFromURL(this.currfile.getlink(),this.currfile.filename).then(i=>(this.scheme.apptitle=this.currfile.path,this.editor.ui.resizeEditor({imageSize:{oldWidth:i.oldWidth,oldHeight:i.oldHeight,newWidth:i.newWidth,newHeight:i.newHeight}})))}save(){if(this.currfile)return this.currfile.cache=this.editor.toDataURL(),this.currfile.write("base64").then(i=>i.error?this.error(__("Error saving file {0}: {1}",this.currfile.basename,i.error)):this.notify(__("File saved: {0}",this.currfile.path))).catch(i=>this.error(__("Unable to save file: {0}",this.currfile.path),i))}cleanup(){if(this.editor)return this.editor.destroy()}menu(){return[{text:"__(File)",nodes:[{text:"__(Open)",dataid:"open",shortcut:"A-O"},{text:"__(Save)",dataid:"save",shortcut:"C-S"},{text:"__(Save as)",dataid:"saveas",shortcut:"A-W"}],onchildselect:i=>this.actionFile(i.data.item.data.dataid)}]}actionFile(i){switch(i){case"open":return this.openDialog("FileDialog",{title:__("Open file"),mimes:["image/.*"]}).then(i=>(this.currfile=i.file.path.asFileHandle(),this.open()));case"save":return this.save();case"saveas":return this.openDialog("FileDialog",{title:__("Save as"),file:this.currfile}).then(i=>{var e;return e=i.file.path.asFileHandle(),"file"===i.file.type&&(e=e.parent()),this.currfile=`${e.path}/${i.name}`.asFileHandle(),this.save()})}}}).dependencies=["pkg://libfabric/main.js","pkg://ImageEditor/tui-image-ed-bundle.min.js"],this.OS.register("ImageEditor",i)}).call(this);

ImageEditor/build/debug/package.json

@@ -0,0 +1,16 @@
+{
+    "pkgname": "ImageEditor",
+    "app":"ImageEditor",
+    "name":"Image editor",
+    "description":"AntOS wrapper of the tui.image-editor",
+    "info":{
+        "author": "Xuan Sang LE",
+        "email": "mrsang@iohub.dev"
+    },
+    "version":"0.1.0-a",
+    "category":"Graphics",
+    "iconclass":"fa fa-camera-retro",
+    "mimes":["image/.*"],
+    "dependencies":["libfabric@4.4.0-r"],
+    "locale": {}
+}

ImageEditor/build/debug/scheme.html

@@ -0,0 +1,10 @@
+<afx-app-window apptitle="Image Editor" width="600" height="600" data-id="ImageEditor">
+    <afx-hbox>
+        <div data-width="2"></div>
+        <afx-vbox>
+            <div data-id="stage"></div>
+            <div data-height="2"></div>
+        </afx-vbox>
+        <div data-width="2"></div>
+    </afx-hbox>
+</afx-app-window>

ImageEditor/coffees/main.coffee

@@ -0,0 +1,110 @@
+class ImageEditor extends this.OS.application.BaseApplication
+    constructor: ( args ) ->
+        super "ImageEditor", args
+        @currfile = undefined
+        @currfile = args[0].path.asFileHandle() if @args and @args.length > 0 and @args[0].path
+    
+    main: () ->
+        @stage = @find("stage")
+        @stage.id = @eid
+        img_data = {
+            path: 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7',
+            name: 'Blank'
+        }
+        
+        if @currfile
+            img_data = {
+                path: @currfile.getlink(),
+                name: @currfile.filename
+            }
+            @scheme.apptitle = @currfile.path
+        
+        
+        @editor = new tui.ImageEditor(@stage, {
+            cssMaxWidth: 700, 
+            cssMaxHeight: 500,
+            usageStatistics: false,
+            includeUI: {
+            initMenu: 'filter',
+            menuBarPosition: 'bottom',
+            loadImage: img_data
+
+            },
+        })
+        @on "resize", () =>
+            @editor.ui.resizeEditor()
+        @editor.ui.resizeEditor()
+        
+        @bindKey "ALT-O", () => @actionFile "open"
+        @bindKey "CTRL-S", () => @actionFile "save"
+        @bindKey "ALT-W", () => @actionFile "saveas"
+    
+    open: () ->
+        return unless @currfile
+        @editor.loadImageFromURL(@currfile.getlink(), @currfile.filename)
+        .then (r) =>
+            @scheme.apptitle = @currfile.path
+            @editor.ui.resizeEditor {
+                imageSize: {
+                    oldWidth: r.oldWidth,
+                    oldHeight: r.oldHeight,
+                    newWidth: r.newWidth,
+                    newHeight: r.newHeight
+                },
+            }
+    
+    save: () ->
+        return unless @currfile
+        @currfile.cache = @editor.toDataURL()
+        @currfile.write "base64"
+        .then (d) =>
+                return @error __("Error saving file {0}: {1}", @currfile.basename, d.error) if d.error
+                @notify __("File saved: {0}", @currfile.path)
+            .catch (e) => @error __("Unable to save file: {0}", @currfile.path), e
+    
+    cleanup: () ->
+        @editor.destroy() if @editor
+    
+    menu: () ->
+        menu = [{
+                text: "__(File)",
+                nodes: [
+                    { text: "__(Open)", dataid: "open", shortcut: "A-O" },
+                    { text: "__(Save)", dataid: "save", shortcut: "C-S" },
+                    { text: "__(Save as)", dataid: "saveas", shortcut: "A-W" }
+                ],
+                onchildselect: (e) => @actionFile e.data.item.data.dataid
+            }]
+        menu
+
+    actionFile: (e) ->
+        switch e
+            when "open"
+                @openDialog("FileDialog", {
+                    title: __("Open file"),
+                    mimes: ["image/.*"]
+                })
+                .then (f) =>
+                    @currfile = f.file.path.asFileHandle()
+                    @open()
+
+            when "save"
+                return @save()
+                
+            when "saveas"
+                @openDialog("FileDialog", {
+                    title: __("Save as"),
+                    file: @currfile
+                })
+                .then (f) =>
+                    d = f.file.path.asFileHandle()
+                    d = d.parent() if f.file.type is "file"
+                    @currfile = "#{d.path}/#{f.name}".asFileHandle()
+                    @save()
+                
+ImageEditor.dependencies = [
+    "pkg://libfabric/main.js",
+    "pkg://ImageEditor/tui-image-ed-bundle.min.js"
+]
+
+this.OS.register "ImageEditor", ImageEditor

ImageEditor/css/main.css

@@ -0,0 +1,3 @@
+afx-app-window[data-id="ImageEditor"] .tui-image-editor-header-buttons{
+    display: none;
+}

ImageEditor/package.json

@@ -0,0 +1,16 @@
+{
+    "pkgname": "ImageEditor",
+    "app":"ImageEditor",
+    "name":"Image editor",
+    "description":"AntOS wrapper of the tui.image-editor",
+    "info":{
+        "author": "Xuan Sang LE",
+        "email": "mrsang@iohub.dev"
+    },
+    "version":"0.1.0-a",
+    "category":"Graphics",
+    "iconclass":"fa fa-camera-retro",
+    "mimes":["image/.*"],
+    "dependencies":["libfabric@4.4.0-r"],
+    "locale": {}
+}

ImageEditor/project.json

@@ -0,0 +1,12 @@
+{
+    "name": "ImageEditor",
+    "css": ["css/tui-image-ed-bundle.min.css", "css/main.css"],
+    "javascripts": [
+    ],
+    "coffees": ["coffees/main.coffee"],
+    "copies": [
+        "javascripts/tui-image-ed-bundle.min.js",
+        "assets/scheme.html", "package.json",
+        "README.md"
+    ]
+}