diff --git a/Makefile b/Makefile index 4d444b2..9ace32d 100644 --- a/Makefile +++ b/Makefile @@ -11,22 +11,25 @@ ifeq ($(UNAME_S),Darwin) endif -coffees= src/core/core.coffee\ - src/core/api.coffee\ - src/core/settings.coffee\ - src/core/handles/RemoteHandle.coffee\ - src/core/Announcerment.coffee\ - src/core/vfs.coffee\ - src/core/vfs/GoogleDriveHandle.coffee\ - src/core/db.coffee\ - src/core/gui.coffee\ - src/core/BaseModel.coffee\ - src/core/BaseApplication.coffee\ - src/core/BaseService.coffee\ - src/core/BaseEvent.coffee\ - src/core/BaseDialog.coffee\ - src/core/tags/tag.coffee\ - src/core/tags/WindowTag.coffee\ +coffees= src/core/core.coffee \ + src/core/api.coffee \ + src/core/settings.coffee \ + src/core/handles/RemoteHandle.coffee \ + src/core/Announcerment.coffee \ + src/core/vfs.coffee \ + src/core/vfs/GoogleDriveHandle.coffee \ + src/core/db.coffee \ + src/core/gui.coffee \ + src/core/BaseModel.coffee \ + src/core/BaseApplication.coffee \ + src/core/BaseService.coffee \ + src/core/BaseEvent.coffee \ + src/core/BaseDialog.coffee \ + src/core/tags/tag.coffee \ + src/core/tags/WindowTag.coffee \ + src/core/tags/TileLayoutTags.coffee \ + src/core/tags/ResizerTag.coffee \ + src/core/tags/LabelTag.coffee \ src/antos.coffee @@ -145,4 +148,7 @@ uglify: release: main uglify clean: - rm -rf $(BUILDDIR)/{resources,scripts,packages,index.html} + rm -rf $(BUILDDIR)/resources + rm -rf $(BUILDDIR)/scripts + rm -rf $(BUILDDIR)/packages + rm -rf $(BUILDDIR)/index.html diff --git a/src/core/tags/ButtonTag.coffee b/src/core/tags/ButtonTag.coffee new file mode 100644 index 0000000..8b4c985 --- /dev/null +++ b/src/core/tags/ButtonTag.coffee @@ -0,0 +1,18 @@ +class ButtonTag extends Ant.OS.GUI.BaseTag + constructor: (r, o) -> + super r, o + @setopt "color", undefined + @setopt "icon", undefined + @setopt "iconclass", undefined + @setopt "text", "" + @setopt "enable", true + + layout: () -> + { + el: "Button", ref: "button", children: [ + { el: "afx-label", ref: "label" } + ] + } + + +Ant.OS.GUI.define "afx-button", ButtonTag \ No newline at end of file diff --git a/src/core/tags/LabelTag.coffee b/src/core/tags/LabelTag.coffee new file mode 100644 index 0000000..0245a9a --- /dev/null +++ b/src/core/tags/LabelTag.coffee @@ -0,0 +1,47 @@ +class LabelTag extends Ant.OS.GUI.BaseTag + constructor: (r, o) -> + super r, o + @setopt "color", undefined + @setopt "icon", undefined + @setopt "iconclass", undefined + @setopt "text", "" + + on_color_changed: (v) -> + return unless v + $(@refs.container).css "color", v + + on_icon_changed: (v) -> + $(@refs.i).attr "style", "" + if v + $(@refs.i) + .css "background", "url(#{Ant.OS.API.handle.get}/#{v})" + .css "background-size", "100% 100%" + .css "background-repeat", "no-repeat" + $(@refs.i).show() + else + $(@refs.i).hide() + + on_iconclass_changed: (v) -> + $(@refs.iclass).removeClass() + if v + $(@refs.iclass).addClass v + $(@refs.iclass).show() + else + $(@refs.iclass).hide() + + + + on_text_changed: (v) -> + $(@refs.text).text v.__() if v + + layout: () -> + { + el: "span", ref: "container", children: [ + { el: "i", ref: "iclass" }, + { el: "i", ref: "i", class: "icon-style" }, + { el: "i", ref: "text" } + ] + } + + +Ant.OS.GUI.define "afx-label", LabelTag \ No newline at end of file diff --git a/src/core/tags/ResizerTag.coffee b/src/core/tags/ResizerTag.coffee new file mode 100644 index 0000000..1674af5 --- /dev/null +++ b/src/core/tags/ResizerTag.coffee @@ -0,0 +1,67 @@ +class ResizerTag extends Ant.OS.GUI.BaseTag + constructor: (r, o) -> + super r, o + @dir = "hz" + @resizable_el = undefined + @parent = $(@root).parent().parent() + @minsize = 0 + + mount: () -> + tagname = $(@parent).prop("tagName") + @resizable_el = if $(@root).prev().length is 1 then $(@root).prev()[0] else undefined + if tagname is "AFX-HBOX" + @dir = "hz" + $(@root).css "cursor", "col-resize" + if @resizable_el + att = $(@resizable_el).attr "min-width" + @minsize = parseInt(att) if att + else if tagname is "AFX-VBOX" + @dir = "ve" + $(@root).css "cursor", "row-resize" + if @resizable_el + att = $(@resizable_el).attr "min-height" + @minsize = parseInt(att) if att + else + @dir = "none" + @minsize = 10 if @minsize is 0 + @draggable() + + draggable: () -> + me = @ + $(@root).css "user-select", "none" + $(@root).on "mousedown", (e) -> + e.preventDefault() + $(window).on "mousemove", (evt) -> + return unless me.resizable_el + if me.dir is "hz" + me.horizontalResize evt + else if me.dir is "ve" + me.verticalResize evt + + $(window).on "mouseup", (evt) -> + $(window).unbind "mousemove", null + $(window).unbind "mouseup", null + + $(window).unbind "mouseup", null + + horizontalResize: (e) -> + return unless @resizable_el + offset = $(@resizable_el).offset() + w = Math.round(e.clientX - offset.left) + w = @minsize if w < @minsize + $(@resizable_el).attr "data-width", w.toString() + @observable.trigger "calibrate", @resizable_el.aid() + + + verticalResize: (e) -> + return unless @resizable_el + offset = $(@resizable_el).offset() + h = Math.round(e.clientY - offset.top) + h = @minsize if h < @minsize + $(@resizable_el).attr "data-height", h.toString() + @observable.trigger "calibrate", @resizable_el.aid() + + layout: () -> + return undefined + +Ant.OS.GUI.define "afx-resizer", ResizerTag \ No newline at end of file diff --git a/src/core/tags/TileLayoutTags.coffee b/src/core/tags/TileLayoutTags.coffee index e9d2902..7633c04 100644 --- a/src/core/tags/TileLayoutTags.coffee +++ b/src/core/tags/TileLayoutTags.coffee @@ -2,10 +2,11 @@ class TileLayoutTag extends Ant.OS.GUI.BaseTag constructor: (r, o, @conf) -> super r, o @setopt @conf.opt, "grow" - @mount() mount: () -> + $(@root).css("display", "block") $(@refs.yield) + .addClass("afx-#{@conf.name}-container") .css("display", "flex") .css("flex-direction", @conf.dir) .css("width", "100%") @@ -15,11 +16,11 @@ class TileLayoutTag extends Ant.OS.GUI.BaseTag @calibrate() calibrate: () -> - + layout: () -> { - el: "div", class: "afx-#{@conf.name}-container", ref: "yield" + el: "div", ref: "yield" } @@ -30,6 +31,30 @@ class HBoxTag extends TileLayoutTag dir: "row", opt: "data-width" } + + calibrate: () -> + auto_width = [] + ocwidth = 0 + avaiheight = $(@root).height() + avaiWidth = $(@root).width() + $(@refs.yield).css "height", "#{avaiheight}px" + $(@refs.yield) + .children() + .each (e) -> + dw = $(@).attr "data-width" + if dw and dw isnt "grow" + dw = Number(dw.slice(0, -1)) * avaiWidth / 100 if dw[dw.length - 1] is "%" + $(@).css "width", "#{dw}px" + ocwidth += Number dw + else + $(@).css "flex-grow", "1" + auto_width.push(@) + + csize = (avaiWidth - ocwidth) / auto_width.length + if csize > 0 + $.each auto_width, (i, v) -> + $(v).css "width", "#{csize}px" + @observable.trigger "hboxchange", { id: @aid(), w: avaiWidth, h: avaiheight } class VBoxTag extends TileLayoutTag @@ -38,4 +63,32 @@ class VBoxTag extends TileLayoutTag name: "vbox", dir: "column", opt: "data-height" - } \ No newline at end of file + } + + calibrate: () -> + auto_height = [] + ocheight = 0 + avaiheight = $(@root).height() + avaiwidth = $(@root).width() + $(@refs.yield).css "height", "#{avaiheight}px" + $(@refs.yield) + .children() + .each (e) -> + dh = $(@).attr "data-height" + if dh and dh isnt "grow" + dh = Number(dh.slice(0, -1)) * avaiheight / 100 if dh[dh.length - 1] is "%" + $(@).css "height", "#{dh}px" + ocheight += Number(dh) + else + $(@).css "flex-grow", "1" + auto_height.push @ + + csize = (avaiheight - ocheight) / auto_height.length + if csize > 0 + $.each auto_height, (i, v) -> + $(v).css "height", "#{csize}px" + + @observable.trigger "vboxchange", { id: @aid(), w: avaiwidth, h: avaiheight } + +Ant.OS.GUI.define "afx-hbox", HBoxTag +Ant.OS.GUI.define "afx-vbox", VBoxTag \ No newline at end of file diff --git a/src/core/tags/WindowTag.coffee b/src/core/tags/WindowTag.coffee index d748046..82fe7db 100644 --- a/src/core/tags/WindowTag.coffee +++ b/src/core/tags/WindowTag.coffee @@ -12,6 +12,13 @@ class WindowTag extends Ant.OS.GUI.BaseTag @history = {} @desktop = $(@get "desktop") @desktop_pos = @desktop.offset() + + resize: () -> + ch = $(@refs["yield"]).height() / $(@refs["yield"]).children().length + $(@refs["yield"]).children().each (e) -> + $(this).css "height", "#{ch}px" + + mount: () -> me = @ @root.contextmenuHandle = (e) -> $(@refs["minbt"]).click (e) -> @@ -22,15 +29,6 @@ class WindowTag extends Ant.OS.GUI.BaseTag $(@refs["closebt"]).click (e) -> me.observable.trigger("exit") - @mount() - - resize: () -> - ch = $(@refs["yield"]).height() / $(@refs["yield"]).children().length - $(@refs["yield"]).children().each (e) -> - $(this).css "height", "#{ch}px" - - mount: () -> - me = @ left = ($(@desktop).width() - (@get "width")) / 2 top = ($(@desktop).height() - (@get "height")) / 2 $(@root) @@ -146,7 +144,7 @@ class WindowTag extends Ant.OS.GUI.BaseTag .css("width", "#{w}px") .css("height", "#{h}px") me.isMaxi = false - me.observable.trigger "resize", { id: me.id(), w: w, h: h } + me.observable.trigger "resize", { id: me.aid(), w: w, h: h } $(window).on "mouseup", (e) -> $(window).unbind "mousemove", null @@ -169,7 +167,7 @@ class WindowTag extends Ant.OS.GUI.BaseTag .css("height", "#{h}px") .css("top", "0") .css("left", "0") - @observable.trigger 'resize', { id: @id(), w: w, h: h } + @observable.trigger 'resize', { id: @aid(), w: w, h: h } @isMaxi = true else @isMaxi = false @@ -178,7 +176,7 @@ class WindowTag extends Ant.OS.GUI.BaseTag .css("height", @history.height) .css("top", @history.top) .css("left", @history.left) - @observable.trigger 'resize', { id: @id(), w: history.width, h: history.height } + @observable.trigger 'resize', { id: @aid(), w: history.width, h: history.height } layout: () -> { diff --git a/src/core/tags/tag.coffee b/src/core/tags/tag.coffee index 0d14879..b7e527e 100644 --- a/src/core/tags/tag.coffee +++ b/src/core/tags/tag.coffee @@ -9,16 +9,19 @@ class Ant.OS.GUI.BaseTag @root.observable = @observable @root.set = (k, v) -> me.set k, v @root.get = (k) -> me.get k - + @root.aid = () -> me.aid() @refs = {} @setopt "data-id", Math.floor(Math.random() * 100000) + 1 - @wrapper = @mkui() - if @refs["yield"] - ($($(v).detach()[0].uify(@observable)).appendTo(@refs.yield)) for v in $(@root).children() - $(@wrapper).appendTo(@root) - else - $(@root).empty() - $(@wrapper).appendTo(@root) + @children = [] + dom = @mkui() + if dom + if @refs.yield + @children = $(@root).children() + $(v).detach().appendTo @refs.yield for v in @children + $(dom).appendTo(@root) + else + $(@root).empty() + $(dom).appendTo(@root) setopt: (name, val) -> value = val @@ -34,19 +37,27 @@ class Ant.OS.GUI.BaseTag @opts[opt] = value @["on_#{opt}_changed"](value) if @["on_#{opt}_changed"] - id: () -> + aid: () -> @get "data-id" get: (opt) -> @opts[opt] + uify: () -> + @mount() + v.uify(@observable) for v in @children + @root + + mount: () -> + layout: () -> # should be defined by subclasses mkui: (obj) -> tag = obj tag = @layout() unless tag + return undefined unless tag dom = $("<#{tag.el}>") $(dom).addClass tag.class if tag.class if tag.children @@ -54,12 +65,13 @@ class Ant.OS.GUI.BaseTag if tag.ref @refs[tag.ref] = dom # dom.mount @observable - return dom + dom Element.prototype.uify = (observable) -> tag = @tagName.toLowerCase() - if RegExp('afx-*', "i" ).test(tag) and Ant.OS.GUI.tag[tag] - return new Ant.OS.GUI.tag[tag](@, observable).root + if RegExp("afx-*", "i" ).test(tag) and Ant.OS.GUI.tag[tag] + o = new Ant.OS.GUI.tag[tag](@, observable) + return o.uify() return @ Ant.OS.GUI.define = (name, cls) -> diff --git a/src/packages/ShowCase/coffees/main.coffee b/src/packages/ShowCase/coffees/main.coffee index a053b38..b53d5aa 100644 --- a/src/packages/ShowCase/coffees/main.coffee +++ b/src/packages/ShowCase/coffees/main.coffee @@ -35,19 +35,43 @@ class ShowCase extends this.OS.GUI.BaseApplication openwin: () -> scheme = $.parseHTML """ -
-

hello

-
+ + +
box 1
+
box 2
+ + + + + + + + +
box center 3
+
box center 4
+ + +
box center 3
+
box center 4
+ + + +
box 3
+
box 4
+ + """ + ($ "#desktop").append scheme[0] obj = scheme[0].uify() - ($ "#desktop").append obj - obj.set "resizable", false + obj.set "resizable", true obj.set "minimizable", false obj.observable.on "exit", () -> console.log "exit" obj.observable.off "*" $(obj).remove() -ShowCase.singleton = false +ShowCase.singleton = true this.OS.register "ShowCase", ShowCase \ No newline at end of file