mirror of
https://github.com/lxsang/antos-frontend.git
synced 2025-07-25 02:09:46 +02:00
fix tree view, add features to Blogger
This commit is contained in:
Xuan Sang LE
@ -56,7 +56,7 @@ class BasicDialog extends BaseDialog
|
||||
@title = @name if not @title
|
||||
html = "<afx-app-window data-id = 'dia-window' apptitle='#{@title}' width='#{@conf.width}' height='#{@conf.height}'>
|
||||
<afx-vbox>"
|
||||
html += "<#{v.tag} #{v.att} data-id = 'content#{k}'></#{v.tag}>" for k,v of @conf.tags
|
||||
html += "<#{v.tag} #{v.att} style = 'margin-left:5px; margin-right:5px;' data-id = 'content#{k}'></#{v.tag}>" for k,v of @conf.tags
|
||||
html += "<div data-height = '35' style=' text-align:right;padding-top:3px;'>"
|
||||
html += "<afx-button data-id = 'bt#{k}' text = '#{v.label}' style='margin-right:5px;'></afx-button>" for k,v of @conf.buttons
|
||||
html += "</div></afx-vbox></afx-app-window>"
|
||||
@ -104,7 +104,7 @@ class PromptDialog extends BasicDialog
|
||||
(d.find "content0").set "text", d.data.label
|
||||
(d.find "content1").value = d.data.value if d.data.value
|
||||
xtra: (d) ->
|
||||
$( d.find "content0" ).keyup (e) ->
|
||||
$( d.find "content1" ).keyup (e) ->
|
||||
(d.find "bt0").trigger() if e.which is 13
|
||||
}
|
||||
|
||||
|
||||
@ -3,8 +3,15 @@ class DB
|
||||
|
||||
save: (d, f) ->
|
||||
_API.handler.dbquery "save", { table: @table, data: d }, f
|
||||
delete: (id, f) ->
|
||||
_API.handler.dbquery "delete", { table: @table, id: id }, f
|
||||
delete: (c, f) ->
|
||||
rq = { table: @table }
|
||||
return _courrier.oserror "Unknown condition for delete command",
|
||||
(_API.throwe "OS.DB"), c unless c and c inst ""
|
||||
if isNaN c
|
||||
rq.cond = c
|
||||
else
|
||||
rq.id = c
|
||||
_API.handler.dbquery "delete", rq, f
|
||||
get: (id, f) ->
|
||||
_API.handler.dbquery "get", { table: @table, id: id }, f
|
||||
find: (cond, f) ->
|
||||
|
||||
@ -97,6 +97,7 @@ self.OS.GUI =
|
||||
forceLaunch: (app, args) ->
|
||||
console.log "This method is used for developing only, please use the launch method instead"
|
||||
_PM.killAll app
|
||||
($ _OS.APP[app].style).remove() if _OS.APP[app] and _OS.APP[app].style
|
||||
_OS.APP[app] = undefined
|
||||
_GUI.launch app, args
|
||||
|
||||
@ -109,8 +110,9 @@ self.OS.GUI =
|
||||
#load css file
|
||||
css = "#{path}/main.css"
|
||||
css.asFileHandler().onready (d) ->
|
||||
$ '<link>', { rel: 'stylesheet', type: 'text/css', 'href': "#{_API.handler.get}/#{css}" }
|
||||
el = $ '<link>', { rel: 'stylesheet', type: 'text/css', 'href': "#{_API.handler.get}/#{css}" }
|
||||
.appendTo 'head'
|
||||
_OS.APP[app].style = el[0] if _OS.APP[app]
|
||||
, () ->
|
||||
#launch
|
||||
# load app meta data
|
||||
|
||||
@ -82,7 +82,7 @@
|
||||
var tdata = {}
|
||||
tdata.name = self.path
|
||||
tdata.nodes = getTreeData(self.data)
|
||||
self.refs.treeview.root.set("*", tdata)
|
||||
self.refs.treeview.root.set("data", tdata)
|
||||
}
|
||||
var getTreeData = function(data)
|
||||
{
|
||||
@ -170,20 +170,21 @@
|
||||
self.refs.treeview.ontreeselect = function(d)
|
||||
{
|
||||
if(!d) return;
|
||||
if(!d.data)// select the root
|
||||
var data;
|
||||
var el = d;
|
||||
if(d.treepath == 0)// select the root
|
||||
{
|
||||
var r = self.path.asFileHandler()
|
||||
r.size = 0
|
||||
r.filename = r.path
|
||||
d.data = { child: r , i:0 }
|
||||
el = self.path.asFileHandler()
|
||||
el.size = 0
|
||||
el.filename = el.path
|
||||
}
|
||||
var data = {id:self.rid, data:d.data.child, idx:d.data.i}
|
||||
var data = {id:self.rid, data:el}
|
||||
self.root.observable.trigger("fileselect",data)
|
||||
}
|
||||
self.refs.treeview.ontreedbclick = function(d)
|
||||
{
|
||||
if(!d.data) return;
|
||||
var data = {id:self.rid, data:d.data.child, idx:d.data.i}
|
||||
if(!d || d.treepath == 0) return;
|
||||
var data = {id:self.rid, data:d}
|
||||
self.root.observable.trigger("filedbclick",data)
|
||||
}
|
||||
self.root.observable.on("fileselect", function(e){
|
||||
|
||||
@ -40,6 +40,8 @@
|
||||
if(dw)
|
||||
{
|
||||
if(dw == "grow") return
|
||||
if(dw[dw.length-1] === "%")
|
||||
dw = Number(dw.slice(0,-1))*avaiWidth/100;
|
||||
$(this).css("width",dw + "px")
|
||||
ocwidth += Number(dw)
|
||||
}
|
||||
@ -51,10 +53,11 @@
|
||||
}
|
||||
})
|
||||
csize = (avaiWidth - ocwidth)/ (auto_width.length)
|
||||
$.each(auto_width, function(i,v)
|
||||
{
|
||||
$(v).css("width", csize + "px")
|
||||
})
|
||||
if(csize > 0)
|
||||
$.each(auto_width, function(i,v)
|
||||
{
|
||||
$(v).css("width", csize + "px")
|
||||
})
|
||||
self.root.observable.trigger("hboxchange",
|
||||
{id:self.rid, w:csize, h:avaiheight})
|
||||
}
|
||||
|
||||
@ -6,6 +6,9 @@
|
||||
<li each={item,i in items } class={selected: parent._autoselect(item,i)} ondblclick = {parent._dbclick} onclick = {parent._select} oncontextmenu = {parent._select}>
|
||||
<afx-label color = {item.color} iconclass = {item.iconclass} icon = {item.icon} text = {item.text}></afx-label>
|
||||
<i if = {item.closable} class = "closable" click = {parent._remove}></i>
|
||||
<ul if = {item.complex} class = "complex-content">
|
||||
<li each = {ctn,j in item.content} class = {ctn.class}>{ctn.text}</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -1,41 +1,45 @@
|
||||
<afx-tree-view>
|
||||
|
||||
<div class={afx_tree_item_selected:treeroot.selectedItem && treeroot.selectedItem.path == path, afx_folder_item: isFolder(), afx_tree_item_odd: index%2 != 0 } onclick={select} ondblclick = {_dbclick} oncontextmenu = {select}>
|
||||
<div class={afx_tree_item_selected:treeroot.selectedItem && treeroot.selectedItem.treepath == data.treepath, afx_folder_item: isFolder(), afx_tree_item_odd: index%2 != 0 } onclick={select} ondblclick = {_dbclick} oncontextmenu = {select}>
|
||||
<ul style = "padding:0;margin:0;white-space: nowrap;">
|
||||
<li ref = "padding" ></li>
|
||||
<li class = "itemname" style="display:inline-block;" >
|
||||
<i if={ !isFolder() && iconclass} class = {iconclass} ></i>
|
||||
<i if={!isFolder() && icon} class="icon-style" style = { "background: url("+icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
|
||||
<i if={ !isFolder() && data.iconclass} class = {data.iconclass} ></i>
|
||||
<i if={!isFolder() && data.icon} class="icon-style" style = { "background: url("+data.icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
|
||||
|
||||
<span onclick={ toggle } if={ isFolder() } class={open ? 'afx-tree-view-folder-open' : 'afx-tree-view-folder-close'}></span>
|
||||
{ name }
|
||||
{ data.name }
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<ul if={ isFolder() } show={ isFolder() && open }>
|
||||
<li each={ child, i in nodes }>
|
||||
<afx-tree-view ontreeselect = {parent.ontreeselect} fetch = {parent.fetch} ontreedbclick = {parent.ontreedbclick} data={child} indent={indent+1} observable = {parent.root.observable} path = {parent.path + ">" + i} treeroot= {parent.treeroot}></afx-tree-view>
|
||||
<li each={ child, i in data.nodes }>
|
||||
<afx-tree-view ontreeselect = {parent.ontreeselect} index = {i} fetch = {parent.fetch} ontreedbclick = {parent.ontreedbclick} data={child} indent={indent+1} observable = {parent.root.observable} path = {parent.data.treepath + ">" + i} treeroot= {parent.treeroot}></afx-tree-view>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<script>
|
||||
var self = this
|
||||
self.open = true
|
||||
self.data = { name:"", nodes:null, treepath: opts.path, i:-1}
|
||||
if(opts.data)
|
||||
{
|
||||
self.name = opts.data.name
|
||||
self.nodes = opts.data.nodes
|
||||
self.icon = opts.data.icon
|
||||
self.data = opts.data
|
||||
//self.name = opts.data.name
|
||||
//self.nodes = opts.data.nodes
|
||||
//self.icon = opts.data.icon
|
||||
self.open = opts.data.open == undefined?true:opts.data.open
|
||||
self.iconclass = opts.data.iconclass
|
||||
//self.iconclass = opts.data.iconclass
|
||||
}
|
||||
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
|
||||
self.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
|
||||
self.data.rid = self.rid
|
||||
self.data.i = opts.index
|
||||
self.ontreeselect = opts.ontreeselect
|
||||
self.ontreedbclick = opts.ontreedbclick
|
||||
self.fetch = opts.fetch
|
||||
self.indent = opts.indent || 1
|
||||
self.indent = opts.indent || 0
|
||||
var istoggle = false
|
||||
if(opts.treeroot)
|
||||
{
|
||||
@ -47,21 +51,48 @@
|
||||
this.treeroot = self
|
||||
this.treeroot.counter = 0
|
||||
}
|
||||
self.path = opts.path || 0
|
||||
self.selected = false
|
||||
self.data.treepath = opts.path || 0
|
||||
//self.selected = false
|
||||
self.selectedItem = null
|
||||
self.index = this.treeroot.counter
|
||||
|
||||
var _dfind = function(l,d, k, v)
|
||||
{
|
||||
if( d[k] == v ) return l.push(d)
|
||||
if(d.nodes && d.nodes.length > 0)
|
||||
for(var i in d.nodes)
|
||||
_dfind(l, d.nodes[i],k,v)
|
||||
}
|
||||
self.root.find = function(k, v)
|
||||
{
|
||||
var l = []
|
||||
_dfind(l,self.data,k,v)
|
||||
return l
|
||||
}
|
||||
|
||||
self.root.set = function(k,v)
|
||||
{
|
||||
if(k == "*")
|
||||
for(var i in v)
|
||||
self[i] = v[i]
|
||||
else if (k == "data")
|
||||
for(var i in v)
|
||||
self.data[i] = v[i]
|
||||
else if (k == "selectedItem")
|
||||
{
|
||||
if(self.ontreeselect)
|
||||
self.ontreeselect(self.data)
|
||||
self.treeroot.selectedItem = v
|
||||
self.root.observable.trigger('treeselect',self.data)
|
||||
}
|
||||
else
|
||||
self[k] = v
|
||||
self.update()
|
||||
}
|
||||
self.root.get = function(k)
|
||||
{
|
||||
//if(k == "data")
|
||||
// return {name:self.name, nodes: self.nodes, icon:self.icon, iconclass: self.iconclass, selectedItem:self.selectedItem}
|
||||
return self[k]
|
||||
}
|
||||
|
||||
@ -83,18 +114,21 @@
|
||||
})
|
||||
|
||||
isFolder() {
|
||||
return self.nodes //&& self.nodes.length
|
||||
return self.data.nodes //&& self.nodes.length
|
||||
}
|
||||
|
||||
toggle(e) {
|
||||
self.open = !self.open
|
||||
e.preventDefault()
|
||||
istoggle = true
|
||||
if(self.open && self.nodes.length == 0 && self.fetch)
|
||||
|
||||
if(self.open && self.data.nodes.length == 0 && self.fetch)
|
||||
{
|
||||
self.fetch(e.item, function(d){
|
||||
self.nodes = d
|
||||
self.data.nodes = d
|
||||
self.update()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
select(event)
|
||||
@ -104,15 +138,15 @@
|
||||
istoggle = false
|
||||
return
|
||||
}
|
||||
var data = {
|
||||
/*var data = {
|
||||
id:self.rid,
|
||||
data:event.item,
|
||||
path:self.path
|
||||
}
|
||||
path:self.data.path
|
||||
} */
|
||||
if(self.ontreeselect)
|
||||
self.ontreeselect(data)
|
||||
self.treeroot.selectedItem = data
|
||||
this.root.observable.trigger('treeselect',data)
|
||||
self.ontreeselect(self.data)
|
||||
self.treeroot.selectedItem = self.data
|
||||
this.root.observable.trigger('treeselect',self.data)
|
||||
event.preventUpdate = true
|
||||
self.treeroot.update()
|
||||
event.preventDefault()
|
||||
@ -124,15 +158,15 @@
|
||||
istoggle = false
|
||||
return
|
||||
}
|
||||
data = {
|
||||
/*data = {
|
||||
id:self.rid,
|
||||
data:event.item,
|
||||
path: self.path}
|
||||
path: self.data.path}*/
|
||||
if(self.ontreedbclick)
|
||||
{
|
||||
self.ontreedbclick(data)
|
||||
self.ontreedbclick(self.data)
|
||||
}
|
||||
self.root.observable.trigger('treedbclick', data)
|
||||
self.root.observable.trigger('treedbclick', self.data)
|
||||
}
|
||||
</script>
|
||||
</afx-tree-view>
|
||||
@ -43,6 +43,8 @@
|
||||
if(dw)
|
||||
{
|
||||
if(dw == "grow") return
|
||||
if(dw[dw.length-1] === "%")
|
||||
dw = Number(dw.slice(0,-1))*avaiheight/100;
|
||||
$(this).css("height",dw + "px")
|
||||
ocheight += Number(dw)
|
||||
}
|
||||
@ -54,10 +56,11 @@
|
||||
}
|
||||
})
|
||||
csize = (avaiheight - ocheight)/ (auto_height.length)
|
||||
$.each(auto_height, function(i,v)
|
||||
{
|
||||
$(v).css("height", csize + "px")
|
||||
})
|
||||
if(csize > 0)
|
||||
$.each(auto_height, function(i,v)
|
||||
{
|
||||
$(v).css("height", csize + "px")
|
||||
})
|
||||
self.root.observable.trigger("vboxchange",
|
||||
{id:self.rid, w:avaiwidth, h:csize})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user