mirror of
https://github.com/lxsang/antos-frontend.git
synced 2024-12-26 01:18:21 +01:00
fix tree view, add features to Blogger
This commit is contained in:
Xuan Sang LE
parent
7dc275e1e5
commit
133b7512fa
11
Makefile
11
Makefile
@ -20,7 +20,6 @@ coffees= src/core/core.coffee\
|
||||
|
||||
|
||||
|
||||
|
||||
packages = CoreServices NotePad wTerm ActivityMonitor DummyApp Files MarkOn MarketPlace Blogger
|
||||
|
||||
main: build_coffees build_tags build_themes schemes libs build_packages
|
||||
@ -78,5 +77,15 @@ build_packages:
|
||||
for d in $(packages); do (cd src/packages/$$d; make);done
|
||||
for d in $(packages); do ( test -d $(BUILDDIR)/packages/$$d || mkdir -p $(BUILDDIR)/packages/$$d && cp -rf src/packages/$$d/build/* $(BUILDDIR)/packages/$$d/);done
|
||||
for d in $(packages); do ( test -d src/packages/$$d/build && rm -r src/packages/$$d/build ); done
|
||||
|
||||
package:
|
||||
read -r -p "Enter package name: " PKG;\
|
||||
test -d $(BUILDDIR)/packages/$$PKG && rm -rf $(BUILDDIR)/packages/$$PKG/*;\
|
||||
cd src/packages/$$PKG && make;\
|
||||
cd ../../../;\
|
||||
test -d $(BUILDDIR)/packages/$$PKG || mkdir -p $(BUILDDIR)/packages/$$PKG;\
|
||||
cp -rf src/packages/$$PKG/build/* $(BUILDDIR)/packages/$$PKG/;\
|
||||
test -d src/packages/$$PKG/build && rm -r src/packages/$$PKG/build;
|
||||
|
||||
clean:
|
||||
rm -rf $(BUILDDIR)/*
|
||||
@ -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})
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
coffee_files = main.coffee
|
||||
coffee_files = dialogs.coffee main.coffee
|
||||
|
||||
jsfiles =
|
||||
|
||||
|
||||
47
src/packages/Blogger/dialogs.coffee
Normal file
47
src/packages/Blogger/dialogs.coffee
Normal file
@ -0,0 +1,47 @@
|
||||
class BloggerCategoryDialog extends this.OS.GUI.BasicDialog
|
||||
constructor: () ->
|
||||
super "BloggerCategoryDialog", {
|
||||
tags: [
|
||||
{ tag: "afx-label", att: "data-height = '20', text = 'Pick a parent:'" },
|
||||
{ tag: "afx-tree-view" },
|
||||
{ tag: "afx-label", att: "data-height = '20', text = 'Category name:'" },
|
||||
{ tag: "input", att: "type = 'text' data-height = '20'" }
|
||||
],
|
||||
width: 200,
|
||||
height: 300,
|
||||
resizable: true,
|
||||
buttons: [
|
||||
{
|
||||
label: "0k",
|
||||
onclick: (d) ->
|
||||
sel = (d.find "content1").get "selectedItem"
|
||||
return d.notify "Please select a parent category" unless sel
|
||||
val = (d.find "content3").value
|
||||
return d.notify "Please enter category name" if val is ""
|
||||
return d.notify "Parent can not be the category itself" if d.data.cat and d.data.cat.id is sel.id
|
||||
d.handler { p: sel, value: val } if d.handler
|
||||
d.quit()
|
||||
},
|
||||
{
|
||||
label: "Cancel",
|
||||
onclick: (d) -> d.quit()
|
||||
}
|
||||
],
|
||||
filldata: (d) ->
|
||||
return unless d.data
|
||||
#console.log d.data
|
||||
tree = d.find "content1"
|
||||
tree.set "data", d.data.tree if d.data.tree
|
||||
if d.data.cat
|
||||
it = (tree.find "id", d.data.cat.pid)[0]
|
||||
tree.set "selectedItem", it
|
||||
(d.find "content3").value = d.data.cat.name
|
||||
#(d.find "content0").set "text", d.data.label
|
||||
#(d.find "content1").value = d.data.value if d.data.value
|
||||
xtra: (d) ->
|
||||
$( d.find "content3" ).keyup (e) ->
|
||||
(d.find "bt0").trigger() if e.which is 13
|
||||
}
|
||||
|
||||
|
||||
this.OS.register "BloggerCategoryDialog", BloggerCategoryDialog
|
||||
@ -12,11 +12,16 @@ class Blogger extends this.OS.GUI.BaseApplication
|
||||
]
|
||||
@user = {}
|
||||
@cvlist = @find "cv-list"
|
||||
@cvlist.set "ontreeselect", (d) ->
|
||||
#console.log d
|
||||
@bloglist = @find "blog-list"
|
||||
@userdb = new @_api.DB("user")
|
||||
@cvcatdb = new @_api.DB("cv_cat")
|
||||
@tabbar.set "onlistselect", (e) ->
|
||||
($ el).hide() for el in me.containers
|
||||
me.fetchData e.idx
|
||||
($ me.containers[e.idx]).show()
|
||||
me.trigger "calibrate"
|
||||
|
||||
@tabbar.set "items", [
|
||||
{ iconclass: "fa fa-user-circle", selected: true },
|
||||
@ -25,29 +30,90 @@ class Blogger extends this.OS.GUI.BaseApplication
|
||||
]
|
||||
(@find "bt-user-save").set "onbtclick", (e) ->
|
||||
me.saveUser()
|
||||
|
||||
|
||||
(@find "cv-cat-add").set "onbtclick", (e) ->
|
||||
me.openDialog "BloggerCategoryDialog",
|
||||
(d) ->
|
||||
c =
|
||||
name: d.value,
|
||||
pid: d.p.id,
|
||||
publish: 1
|
||||
me.cvcatdb.save c, (r) ->
|
||||
me.error "Cannot add new category" if r.error
|
||||
me.refreshCVCat()
|
||||
#update the list
|
||||
|
||||
, "Add category", { tree: me.cvlist.get "data" }
|
||||
|
||||
(@find "cv-cat-edit").set "onbtclick", (e) ->
|
||||
cat = me.cvlist.get "selectedItem"
|
||||
return unless cat
|
||||
me.openDialog "BloggerCategoryDialog", (d) ->
|
||||
c =
|
||||
id: cat.id,
|
||||
publish: cat.publish,
|
||||
pid: d.p.id,
|
||||
name: d.value
|
||||
|
||||
me.cvcatdb.save c, (r) ->
|
||||
me.error "Cannot Edit category" if r.error
|
||||
me.refreshCVCat()
|
||||
, "Edit category", { tree: (me.cvlist.get "data"), cat: cat }
|
||||
|
||||
(@find "cv-cat-del").set "onbtclick", (e) ->
|
||||
cat = me.cvlist.get "selectedItem"
|
||||
return unless cat
|
||||
me.openDialog "YesNoDialog",
|
||||
(d) ->
|
||||
return unless d
|
||||
console.log "delete all child + theirs content"
|
||||
, "Delete cagegory" ,
|
||||
{ iconclass: "fa fa-question-circle", text: "Do you really want to delete: #{cat.name} ?" }
|
||||
fetchData: (idx) ->
|
||||
me = @
|
||||
switch idx
|
||||
when 0 #user info
|
||||
db = new @_api.DB("user")
|
||||
db.get null, (d) ->
|
||||
|
||||
@userdb.get null, (d) ->
|
||||
return me.error "Cannot fetch user data" if d.error
|
||||
me.user = d.result[0]
|
||||
inputs = me.select "[imput-class='user-input']"
|
||||
($ v).val me.user[v.name] for v in inputs
|
||||
when 1 # category
|
||||
@refreshCVCat()
|
||||
else
|
||||
console.log "Not implemented yet"
|
||||
|
||||
refreshCVCat: () ->
|
||||
me = @
|
||||
data =
|
||||
name: "Porfolio",
|
||||
id:0,
|
||||
nodes: []
|
||||
@cvcatdb.get null, (d) ->
|
||||
return me.notify "Cannot fetch CV categories" if d.error
|
||||
me.fetchCVCat d.result, data, "0"
|
||||
me.cvlist.set "data", data
|
||||
it = (me.cvlist.find "pid", "2")[0]
|
||||
me.cvlist.set "selectedItem", it
|
||||
|
||||
fetchCVCat: (table, data, id) ->
|
||||
result = (v for v in table when v.pid is id)
|
||||
return data.nodes = null if result.length is 0
|
||||
for v in result
|
||||
v.nodes = []
|
||||
@fetchCVCat table, v, v.id
|
||||
#v.nodes = null if v.nodes.length is 0
|
||||
data.nodes.push v
|
||||
|
||||
|
||||
saveUser:() ->
|
||||
me = @
|
||||
inputs = @select "[imput-class='user-input']"
|
||||
@user[v.name] = ($ v).val() for v in inputs
|
||||
return @notify "Full name must be entered" if not @user.fullname or @user.fullname is ""
|
||||
db = new @_api.DB("user")
|
||||
console.log @user
|
||||
db.save @user, (r) ->
|
||||
#console.log @user
|
||||
@userdb.save @user, (r) ->
|
||||
return me.error "Cannot save user data" if r.error
|
||||
return me.notify "User data updated"
|
||||
|
||||
|
||||
@ -4,13 +4,13 @@ afx-app-window[data-id="blogger-win"] afx-list-view[data-id="tabbar"] {
|
||||
background-color: #333333;
|
||||
}
|
||||
|
||||
afx-app-window[data-id="blogger-win"] afx-list-view[data-id="tabbar"] li {
|
||||
afx-app-window[data-id="blogger-win"] afx-list-view[data-id="tabbar"] > div > ul > li {
|
||||
background-color: #333333;
|
||||
font-size: 20px;
|
||||
color: #929292;
|
||||
}
|
||||
|
||||
afx-app-window[data-id="blogger-win"] afx-list-view[data-id="tabbar"] li.selected{
|
||||
afx-app-window[data-id="blogger-win"] afx-list-view[data-id="tabbar"] > div > ul > li.selected{
|
||||
color:white;
|
||||
}
|
||||
afx-app-window[data-id="blogger-win"] afx-hbox[data-id="user-container"] {
|
||||
@ -22,4 +22,21 @@ afx-app-window[data-id="blogger-win"] afx-hbox[data-id="user-container"] afx-hbo
|
||||
}
|
||||
afx-app-window[data-id="blogger-win"] afx-hbox[data-id="user-container"] afx-label{
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
afx-app-window[data-id="blogger-win"] afx-hbox.cv-side-bar-btn{
|
||||
padding-left:3px;
|
||||
padding-top:3px;
|
||||
background-color: #f6F6F6;
|
||||
border-top: 1px solid #cbcbcb;
|
||||
color:#414339;
|
||||
}
|
||||
afx-app-window[data-id="blogger-win"] afx-resizer{
|
||||
border-left: 1px solid #cbcbcb;
|
||||
background-color: transparent;
|
||||
}
|
||||
afx-app-window[data-id="blogger-win"] afx-hbox[data-id="cv-container"] afx-label.cat-header{
|
||||
background-color: #f6F6F6;
|
||||
border-bottom: 1px solid #cbcbcb;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
<afx-app-window data-id = "blogger-win" apptitle="MarketPlace" width="500" height="400">
|
||||
<afx-app-window data-id = "blogger-win" apptitle="Blogger" width="500" height="500">
|
||||
<afx-hbox >
|
||||
<afx-list-view data-id="tabbar" data-width="30"></afx-list-view>
|
||||
<afx-vbox>
|
||||
<afx-hbox data-id="user-container" data-height="grow">
|
||||
<afx-hbox data-id="user-container" data-height="100%">
|
||||
<afx-vbox>
|
||||
<afx-hbox data-height = "30">
|
||||
<afx-label data-width= "70" text = "Full name:"></afx-label>
|
||||
@ -25,20 +25,29 @@
|
||||
<input type = "text" name="url" imput-class = "user-input"/>
|
||||
</afx-hbox>
|
||||
<afx-label data-height = "30" text = "Short biblio:"/>
|
||||
<textarea rows="10" name="shortbiblio" imput-class = "user-input"/>
|
||||
<afx-hbox data-height = "30">
|
||||
<textarea name="shortbiblio" imput-class = "user-input"/>
|
||||
<afx-hbox data-height = "35">
|
||||
<div></div>
|
||||
<afx-button iconclass = "fa fa-save" data-id = "bt-user-save" data-width="55" text = "Save"/>
|
||||
</afx-hbox>
|
||||
</afx-vbox>
|
||||
</afx-hbox>
|
||||
<afx-hbox data-id="cv-container" data-height="grow">
|
||||
<afx-list-view data-id = "cv-list" data-width="100" ></afx-list-view>
|
||||
<afx-hbox data-id="cv-container" data-height="100%">
|
||||
<afx-vbox data-width="150" min-width="100">
|
||||
<afx-label class = "cat-header" data-height = "23" text = "Categories" iconclass = "fa fa-bars"></afx-label>
|
||||
<afx-tree-view data-id = "cv-list" ></afx-tree-view>
|
||||
<afx-hbox data-height="30" class = "cv-side-bar-btn">
|
||||
<afx-button data-id = "cv-cat-add" data-width = "25" text = "" iconclass = "fa fa-plus-circle"></afx-button>
|
||||
<afx-button data-id = "cv-cat-del" data-width = "25" text = "" iconclass = "fa fa-minus-circle"></afx-button>
|
||||
<afx-button data-id = "cv-cat-edit" data-width = "25" text = "" iconclass = "fa fa-pencil-square-o"></afx-button>
|
||||
</afx-hbox>
|
||||
</afx-vbox>
|
||||
<afx-resizer data-width = "3"/>
|
||||
<afx-vbox>
|
||||
info here
|
||||
</afx-vbox>
|
||||
</afx-hbox>
|
||||
<afx-hbox data-id = "blog-container" data-height="grow">
|
||||
<afx-hbox data-id = "blog-container" data-height="100%">
|
||||
<afx-list-view data-id = "blog-list" data-width="100"></afx-list-view>
|
||||
<afx-vbox>
|
||||
blog here
|
||||
|
||||
@ -23,7 +23,7 @@ class DummyApp extends this.OS.GUI.BaseApplication
|
||||
tdata = {
|
||||
name: 'My Tree',
|
||||
nodes: [
|
||||
{ name: 'hello', icon:'fa fa-car'},
|
||||
{ name: 'hello', iconclass:'fa fa-car'},
|
||||
{ name: 'wat' },
|
||||
{
|
||||
name: 'child folder',
|
||||
@ -48,7 +48,7 @@ class DummyApp extends this.OS.GUI.BaseApplication
|
||||
}
|
||||
]
|
||||
}
|
||||
tree.set "*",tdata
|
||||
tree.set "data",tdata
|
||||
|
||||
list = @find "mylist"
|
||||
ldata = [
|
||||
@ -58,7 +58,7 @@ class DummyApp extends this.OS.GUI.BaseApplication
|
||||
{text:"some thing"},
|
||||
{text:"some thing"},
|
||||
{text:"some thing"},
|
||||
{text:"some thing"},
|
||||
{text:"some thing", complex:true, content:[{text:"Inner content", class:""}]},
|
||||
{text:"some thing"},
|
||||
{text:"some thing"},
|
||||
{text:"some thing"},
|
||||
|
||||
@ -22,7 +22,7 @@ afx-app-window[data-id="notepad"] .afx-window-content {
|
||||
background-color: #f6F6F6;
|
||||
}
|
||||
|
||||
afx-tab-container[data-id="tabarea"] afx-list-view li {
|
||||
afx-tab-container[data-id="tabarea"] afx-list-view > div.list-container > ul > li {
|
||||
background-color: #dfdfdf;
|
||||
color:#272822;
|
||||
border: 0;
|
||||
@ -39,7 +39,7 @@ afx-tab-container[data-id="tabarea"] afx-list-view{
|
||||
/*afx-tab-container[data-id="tabarea"] afx-list-view i.closable:before{
|
||||
color: white;
|
||||
}*/
|
||||
afx-tab-container[data-id="tabarea"] afx-list-view li.selected {
|
||||
afx-tab-container[data-id="tabarea"] afx-list-view > div.list-container > ul > li.selected {
|
||||
background-color: #f6F6F6;
|
||||
border-radius: 0;
|
||||
}
|
||||
@ -12,7 +12,7 @@ afx-file-view div.status{
|
||||
border-top: 1px solid #cbcbcb;
|
||||
color:#414339;
|
||||
}
|
||||
afx-file-view afx-list-view li{
|
||||
afx-file-view afx-list-view > div.list-container > ul > li{
|
||||
float:left;
|
||||
display: block;
|
||||
width:70px;
|
||||
@ -23,7 +23,7 @@ afx-file-view afx-list-view li{
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
afx-file-view afx-list-view li:nth-child(odd){
|
||||
afx-file-view afx-list-view > div.list-container > ul > li:nth-child(odd){
|
||||
background-color: transparent;
|
||||
}
|
||||
afx-file-view afx-list-view i.dir:before{
|
||||
@ -51,7 +51,7 @@ afx-file-view afx-list-view i.file:before{
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
afx-file-view afx-list-view li.selected, afx-file-view afx-list-view li.selected i:before {
|
||||
afx-file-view afx-list-view > div.list-container > ul > li.selected, afx-file-view afx-list-view div.list-container > ul li.selected i:before {
|
||||
background-color: #116cd6;
|
||||
color:white;
|
||||
border-radius: 6px;
|
||||
|
||||
@ -11,12 +11,12 @@ afx-list-view div.list-container{
|
||||
position: relative;
|
||||
background-color: red;
|
||||
}*/
|
||||
afx-list-view ul{
|
||||
afx-list-view > div.list-container > ul{
|
||||
margin:0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
afx-list-view li{
|
||||
afx-list-view > div.list-container > ul > li{
|
||||
margin:0;
|
||||
padding:0;
|
||||
list-style: none;
|
||||
@ -29,7 +29,7 @@ afx-list-view li{
|
||||
-webkit-user-select:none;
|
||||
cursor:default;
|
||||
}
|
||||
afx-list-view li:nth-child(odd){
|
||||
afx-list-view > div.list-container > ul >li:nth-child(odd){
|
||||
background-color: #f5F5F5;
|
||||
}
|
||||
afx-list-view i.closable{
|
||||
@ -49,11 +49,11 @@ afx-list-view i.closable:before{
|
||||
top:5px;
|
||||
}
|
||||
|
||||
afx-list-view li > i {
|
||||
afx-list-view > div.list-container > ul > li > i {
|
||||
margin-right: 3px;
|
||||
|
||||
}
|
||||
afx-list-view li.selected {
|
||||
afx-list-view > div.list-container > ul > li.selected {
|
||||
background-color: #116cd6;
|
||||
color:white;
|
||||
}
|
||||
@ -76,20 +76,20 @@ afx-list-view.dropdown {
|
||||
padding:0;
|
||||
margin: 0;
|
||||
}
|
||||
afx-list-view.dropdown div.list-container ul{
|
||||
afx-list-view.dropdown > div.list-container > ul{
|
||||
max-height: 150px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background-color: white;
|
||||
}
|
||||
afx-list-view.dropdown div.list-container ul{
|
||||
afx-list-view.dropdown > div.list-container > ul{
|
||||
border:1px solid #a6a6a6;
|
||||
box-shadow: 1px 1px 1px #9f9F9F;
|
||||
border-radius: 3px;
|
||||
padding:2px;
|
||||
border-top-left-radius: 0px;
|
||||
}
|
||||
afx-list-view.dropdown div.list-container ul li{
|
||||
afx-list-view.dropdown > div.list-container > ul > li{
|
||||
display: inline-block;
|
||||
width:100%;
|
||||
}
|
||||
@ -112,8 +112,18 @@ afx-list-view.dropdown div.list-container div:before {
|
||||
top:25%;
|
||||
right: 5px;
|
||||
}
|
||||
afx-list-view.dropdown div.list-container ul li:hover{
|
||||
afx-list-view.dropdown > div.list-container > ul > li:hover{
|
||||
background-color: #dcdcdc;
|
||||
color: #414339;
|
||||
}
|
||||
|
||||
afx-list-view ul.complex-content{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
afx-list-view ul.complex-content li{
|
||||
padding:0;
|
||||
background-color: transparent;
|
||||
color:#5e5f59;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user