dany/antos-frontend
1
0
Fork 0
mirror of https://github.com/lxsang/antos-frontend.git synced 2025-07-19 15:29:51 +02:00
Code Issues 1 Actions Projects Releases Wiki Activity

add darkmode themes, clean up

Browse Source
This commit is contained in:
Xuan Sang LE
2020-05-18 18:53:59 +02:00
parent c94cb0963d
commit 40b06f8f1a
118 changed files with 1138 additions and 4508 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/core/BaseModel.coffee
View File

@ -112,8 +112,8 @@ class BaseModel
warn: (m) ->
@publish "warning", m
error: (m) ->
@publish "error", m, (@_api.throwe @name)
error: (m, e) ->
@publish "error", m, if e then e else (@_api.throwe @name)
fail: (m) ->
@publish "fail", m

46
src/core/api.coffee
View File

@ -169,8 +169,8 @@ Ant.OS.API =
# handles are defined in /src/handles
handle: {}
shared: {} # shared libraries
searchHandle:{}
lang:{}
searchHandle: {}
lang: {}
#request a user data
mid: () ->
return Ant.OS.announcer.getMID()
@ -182,16 +182,23 @@ Ant.OS.API =
type: 'POST',
url: p,
contentType: 'application/json',
data: JSON.stringify d,
data: JSON.stringify(d,
(k, v) ->
return undefined if k is "domel"
return v
, 4),
dataType: 'json',
success: null
}
.done (data) ->
Ant.OS.API.loaded q, p, "OK"
resolve(data)
.fail (e, s) ->
.fail (j, s, e) ->
Ant.OS.API.loaded q, p, "FAIL"
reject(e, s)
if e
reject e
else
reject(Ant.OS.API.throwe s)
blob: (p) ->
new Promise (resolve, reject) ->
@ -232,9 +239,12 @@ Ant.OS.API =
Ant.OS.API.loaded q, p, "OK"
resolve(data)
o.remove()
.fail (e, s) ->
.fail (j, s, e) ->
Ant.OS.API.loaded q, p, "FAIL"
reject(e, s)
if e
reject e
else
reject(Ant.OS.API.throwe s)
o.remove()
o.click()
@ -268,21 +278,15 @@ Ant.OS.API =
.done (data) ->
Ant.OS.API.loaded q, p, "OK"
resolve(data)
.fail (e, s) ->
.fail (j, s, e) ->
Ant.OS.API.loaded q, p, "FAIL"
reject(e, s)
if e
reject e
else
reject(Ant.OS.API.throwe s)
script: (p) ->
new Promise (resolve, reject) ->
q = Ant.OS.announcer.getMID()
Ant.OS.API.loading q, p
$.getScript p
.done (data) ->
Ant.OS.API.loaded q, p, "OK"
resolve(data)
.fail (e, s) ->
Ant.OS.API.loaded q, p, "FAIL"
reject(e, s)
Ant.OS.API.get p, "script"
resource: (r) ->
path = "resources/#{r}"
@ -400,7 +404,7 @@ Ant.OS.API =
Object.defineProperty o, v, {
enumerable: true,
set: (value) ->
for k,l of @__p
for k, l of @__p
@__p[k] = false
o.__p[v] = value
, get: () ->
@ -412,7 +416,7 @@ Ant.OS.API =
configurable: true,
enumerable: false,
get: () ->
for k,v of o.__p
for k, v of o.__p
return k if v
}
return o

4
src/core/languages/gen.sh
View File

@ -20,7 +20,7 @@
ord() {
LC_CTYPE=C printf '%d' "'$1"
}
grep --include=\*.{coffee,tag} -roh "$1" -e '__("[^"]*"' | while read -r line ; do
grep --include=\*.{coffee} -roh "$1" -e '__("[^"]*"' | while read -r line ; do
SUBSTRING=$(echo $line| cut -d'"' -f 2)
if test -f "$2" && [ ! -z "$(grep -F "\"$SUBSTRING\":" "$2")" ]
then
@ -29,7 +29,7 @@ grep --include=\*.{coffee,tag} -roh "$1" -e '__("[^"]*"' | while read -r line ;
echo -e "\t\"$SUBSTRING\":\"$SUBSTRING\"," >> "tmp.json"
fi
done
grep --include=\*.{coffee,html,tag} -roh "$1" -e '\"__([^\"]*)\"' | while read -r line; do
grep --include=\*.{coffee,html} -roh "$1" -e '\"__([^\"]*)\"' | while read -r line; do
len=$(( ${#line} - 6 ))
#echo $len
#echo $line

17
src/core/settings.coffee
View File

@ -48,7 +48,8 @@
],
apps: []
} if not Ant.OS.setting.system.startup
if not Ant.OS.setting.system.error_report
Ant.OS.setting.system.error_report = "https://os.iohub.dev/report"
Ant.OS.setting.system.pkgpaths = {
user: "home://.packages",
system: "os://packages"
@ -56,8 +57,18 @@
Ant.OS.setting.system.locale = "en_GB" unless Ant.OS.setting.system.locale
Ant.OS.setting.system.menu = {} unless Ant.OS.setting.system.menu
Ant.OS.setting.system.repositories = [] unless Ant.OS.setting.system.repositories
Ant.OS.setting.appearance.theme = "antos" unless Ant.OS.setting.appearance.theme
Ant.OS.setting.appearance.theme = "antos_dark" unless Ant.OS.setting.appearance.theme
if not Ant.OS.setting.appearance.themes
Ant.OS.setting.appearance.themes = [
{
text: "AntOS light",
name: "antos_light"
},
{
text: "AntOS dark",
name: "antos_dark"
}
]
Ant.OS.setting.VFS.gdrive = {
CLIENT_ID: ""
API_KEY: ""

14
src/core/tags/LabelTag.coffee
View File

@ -5,9 +5,7 @@ class LabelTag extends Ant.OS.GUI.BaseTag
@setopt "icon", undefined
@setopt "iconclass", undefined
@setopt "class", undefined
@refs.text = document.createTextNode ""
$(@refs.container).append @refs.text
@setopt "text", ""
@setopt "text", undefined
mount: () ->
@ -37,7 +35,6 @@ class LabelTag extends Ant.OS.GUI.BaseTag
$(@refs.iclass).removeClass()
if v
$(@refs.iclass).addClass v
$(@refs.iclass).css "margin-right", "5px"
$(@refs.iclass).show()
else
$(@refs.iclass).hide()
@ -45,13 +42,18 @@ class LabelTag extends Ant.OS.GUI.BaseTag
__text__: (v) ->
@refs.text.nodeValue = v.__() if v
if v and v isnt ""
$(@refs.text).show()
$(@refs.text).html v.__()
else
$(@refs.text).hide()
layout: () ->
[{
el: "span", ref: "container", children: [
{ el: "i", ref: "iclass" },
{ el: "i", ref: "i", class: "icon-style" }
{ el: "i", ref: "i", class: "icon-style" },
{ el: "i", ref: "text", class: "label-text" }
]
}]

4
src/core/tags/WindowTag.coffee
View File

@ -168,8 +168,8 @@ class WindowTag extends Ant.OS.GUI.BaseTag
width: $(@root).css("width"),
height: $(@root).css("height")
}
w = $(@desktop).width() - 5
h = $(@desktop).height() - 10
w = $(@desktop).width()
h = $(@desktop).height()
$(@root)
.css("top", "0")
.css("left", "0")

246
src/core/tags/afx-app-window.tag
View File

@ -1,246 +0,0 @@
<afx-app-window ref = "window" >
<div class = "afx-window-wrapper">
<ul class= "afx-window-top" >
<li class = "afx-window-close" onclick = {close}></li>
<li if = {minimizable == true} class = "afx-window-minimize" onclick = {minimize}></li>
<li if = {resizable == true} class = "afx-window-maximize" onclick={maximize}></li>
<li ref = "dragger" class = "afx-window-title">{ apptitle?apptitle.__():apptitle }</li>
</ul>
<div class = "afx-clear"></div>
<div ref = "content" class = "afx-window-content">
<yield/>
</div>
<div if = {resizable == true} ref = "grip" class = "afx-window-grip">
</div>
<script>
this.apptitle = opts.apptitle || ""
if(opts.minimizable == undefined)
this.minimizable = true
else
this.minimizable = eval(opts.minimizable)
if(opts.resizable == undefined)
this.resizable = true
else
this.resizable = eval(opts.resizable)
var self = this
var offset = {top:0,left:0}
var desktop_pos = $("#desktop").offset()
var isMaxi = false
var history = {}
var width = opts.width || 400
var height = opts.height || 300
this.root.observable = opts.observable || riot.observable()
if(!window._zindex) window._zindex = 10
this.shown = false
self.root.contextmenuHandler = function (e) {}
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
if(k == "apptitle")
self.root.observable.trigger("apptitlechange")
self.update()
}
self.root.get = function(k)
{
return self[k]
}
self.root.update = function()
{
self.update()
}
minimize()
{
this.root.observable.trigger("hide")
}
close()
{
this.root.observable.trigger("exit")
}
this.on('mount', function() {
var left,top
//left = 20 + Math.floor(Math.random() * ($("#desktop").width() - width))
//top = 20 + Math.floor(Math.random() * ($("#desktop").height() - height))
left = ($("#desktop").width() - width)/2
top = ($("#desktop").height() - height)/2
$(self.refs.window)
.css("position",'absolute')
.css("left",left + "px")
.css("top",top + "px")
.css("width",width + "px")
.css("height", height + "px")
.css("z-index",window._zindex++)
$(self.refs.window).on("mousedown", function(e){
if(self.shown == false)
self.root.observable.trigger("focus")
})
$(self.refs.window).click(function(e) {
//e.stopPropagation()
//e.windowactive = true
//self.root.observable.trigger("windowselect")
})
enable_dragging()
if(self.resizable)
enable_resize()
$(self.refs.dragger).dblclick(function(e){
toggle_window()
})
$(self.refs.content).children().each(function(e){
this.observable = self.root.observable
})
var fn = function()
{
var ch = $(self.refs.content).height()/ $(self.refs.content).children().length
$(self.refs.content).children().each(function(e){
$(this).css("height",ch+"px")
})
}
fn()
self.root.observable.on("resize", function(){ fn()})
self.root.observable.on("focus",function(){
window._zindex++
$(self.refs.window)
.show()
.css("z-index",window._zindex)
.removeClass("unactive")
self.shown = true
})
self.root.observable.on("blur", function(){
self.shown = false
$(self.refs.window)
.addClass("unactive")
// add css to blur app :)
})
self.root.observable.on("hide", function()
{
$(self.refs.window).hide()
self.shown = false
})
self.root.observable.on("toggle", function(){
if(self.shown)
self.root.observable.trigger("hide")
else
self.root.observable.trigger("focus")
})
self.root.observable.trigger("rendered", self.root)
})
var enable_dragging = function()
{
$(self.refs.dragger)
.css("user-select","none")
.css("cursor","default")
$(self.refs.dragger).on("mousedown", function(e){
e.preventDefault()
offset = $(self.refs.window).offset()
offset.top = e.clientY - offset.top
offset.left = e.clientX - offset.left
$(window).on("mousemove", function(e){
var top,left
if(isMaxi)
{
toggle_window()
top = 0
letf = e.clientX - $(self.refs.window).width()/2
offset.top = 10 //center
offset.left = $(self.refs.window).width()/2
} else
{
top = e.clientY - offset.top - desktop_pos.top
left = e.clientX - desktop_pos.top - offset.left
left = left < 0?0:left;
top = top < 0?0:top;
}
$(self.refs.window).css("top", top +"px")
.css("left",left + "px")
})
$(window).on("mouseup", function(e){
//console.log("unbind mouse up")
$(window).unbind("mousemove", null)
})
})
}
var enable_resize = function()
{
if(!self.resizable) return
$(self.refs.grip)
.css("user-select","none")
.css("cursor","default")
.css("position","absolute")
.css("bottom","0")
.css("right","0")
.css("cursor","nwse-resize")
$(self.refs.grip).on("mousedown", function(e){
e.preventDefault()
offset.top = e.clientY
offset.left = e.clientX
$(window).on("mousemove", function(e){
var w,h
w = $(self.refs.window).width() + e.clientX - offset.left
h = $(self.refs.window).height() + e.clientY - offset.top
w = w < 100 ? 100:w
h = h < 100 ?100:h
offset.top = e.clientY
offset.left = e.clientX
$(self.refs.window)
.css("width", w +"px")
.css("height",h + "px")
isMaxi = false
self.root.observable.trigger('resize',
{id:$(self.root).attr("data-id"),w:w,h:h})
})
$(window).on("mouseup", function(e){
$(window).unbind("mousemove", null)
})
})
}
var toggle_window = function()
{
if(!self.resizable) return
if(isMaxi == false)
{
history = {
top: $(self.refs.window).css("top"),
left:$(self.refs.window).css("left"),
width:$(self.refs.window).css("width"),
height:$(self.refs.window).css("height")
}
var w,h
w = ($("#desktop").width() - 5)
h = ($("#desktop").height() - 10)
$(self.refs.window)
.css("width", w + "px")
.css("height", h + "px")
.css("top","0").css("left","0")
self.root.observable.trigger('resize',
{id:$(self.root).attr("data-id"),w:w,h:h})
isMaxi = true
}
else
{
isMaxi = false
$(self.refs.window)
.css("width",history.width)
.css("height",history.height)
.css("top",history.top).css("left",history.left)
self.root.observable.trigger('resize',
{id:$(self.root).attr("data-id"),w:history.width,h:history.height} )
}
}
maximize()
{
toggle_window()
}
</script>
</afx-app-window>

82
src/core/tags/afx-apps-dock.tag
View File

@ -1,82 +0,0 @@
<afx-apps-dock>
<afx-button class = {selected: parent.selectedApp && it.app.pid == parent.selectedApp.pid} each={ it,i in items} iconclass = {it.iconclass} icon = {it.icon} appindex = {i} text = {it.text} onbtclick = {it.onbtclick} tooltip= {"cr:" + it.app.title()} >
</afx-button>
<script>
this.items = opts.items || []
var self = this
self.selectedApp = null
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
{
self[k] = v
if(k == "selectedApp")
{
for(var i in self.items)
self.items[i].app.blur()
if(v)
$("#desktop")[0].set("selected", -1)
}
}
self.update()
}
self.root.newapp = function(i)
{
self.items.push(i)
self.selectedApp = i.app
self.update()
for(var i in self.items)
self.items[i].app.blur()
}
self.root.removeapp = function(a)
{
var i = -1;
for(var k in self.items)
if(self.items[k].app.pid == a.pid)
{
i = k; break;
}
if(i != -1)
{
delete self.items[i].app
self.items.splice(i,1)
self.update()
}
}
self.root.update = function()
{
self.update()
}
self.root.get = function(k)
{
return self[k]
}
this.on("mount", function(){
window.OS.announcer.trigger("sysdockloaded")
})
self.root.contextmenuHandle = function(e, m)
{
if(e.target == self.root) return;
var appidx = $(e.target).closest( "afx-button" ).attr("appindex")
var app = self.items[appidx].app
m.set("items", [
{ text: "__(Show)", dataid:"show" },
{ text: "__(Hide)", dataid:"hide" },
{ text: "__(Close)", dataid:"quit" }
])
m.set("onmenuselect", function(evt)
{
if(app[evt.item.data.dataid])
app[evt.item.data.dataid]()
})
m.show(e)
}
</script>
</afx-apps-dock>

47
src/core/tags/afx-button.tag
View File

@ -1,47 +0,0 @@
<afx-button >
<button class= { btactive: selected } disabled={ enable == false } onclick="{ _onbtclick }" ref = "mybtn" >
<afx-label color = {color} icon={icon} iconclass = {iconclass} text = {text} ></afx-label>
</button>
<script>
opts.enable = opts.enable || "true"
this.enable = eval(opts.enable) || false
this.icon = opts.icon
this.iconclass = opts.iconclass
this.color = opts.color
this.text = opts.text || ""
this.selected = eval(opts.selected) || false
this.toggle = eval(opts.toggle) || false
var self = this
this.onbtclick = opts.onbtclick
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.trigger = function()
{
$(self.refs.mybtn).trigger("click")
}
self.root.get = function(k)
{
return self[k]
}
this._onbtclick = function(e)
{
if(typeof self.onbtclick == 'string')
eval(self.onbtclick)
else if(self.onbtclick)
self.onbtclick(e)
if(self.root.observable)
{
self.root.observable.trigger("btclick",{id:$(self.root).attr("data-id"),data:self.root})
}
if(self.toggle)
self.root.set("selected",!self.selected)
}
</script>
</afx-button>

107
src/core/tags/afx-calendar-view.tag
View File

@ -1,107 +0,0 @@
<afx-calendar-view>
<div><i class ="prevmonth" onclick={prevmonth}></i>
<afx-label text = {mtext}></afx-label>
<afx-label text = {year}></afx-label>
<i onclick={nextmonth} class="nextmonth"></i></div>
<afx-grid-view data-id ={"grid_" + rid} style = "height:100%;" ref = "grid" header = {header}> </afx-grid-view>
<script >
this.header = [{value:"__(Sun)"},{value:"__(Mon)"},{value:"__(Tue)"},{value:"__(Wed)"},{value:"__(Thu)"},{value:"__(Fri)"},{value:"__(Sat)"}]
this.root.observable = opts.observable
var self = this
this.day = 0
this.month = 0
this.year = 0
this.ondayselect = opts.ondayselect
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
this.selectedDate = undefined
self.root.get = function(k)
{
return self[k]
}
this.on("mount", function (e) {
self.refs.grid.root.observable = self.root.observable
calendar(null)
self.root.observable.on("gridcellselect", function(d){
if(d.id != "grid_" + self.rid) return
if(d.data.value == "") return
var data = {id:self.rid, data:new Date(self.year, self.month,d.data.value)};
if(self.ondayselect)
self.ondayselect(data)
self.selectedDate = data.data
self.root.observable.trigger("dayselect",data)
})
})
prevmonth()
{
self.selectedDate = undefined
this.month--
if(this.month < 0)
{
this.month = 11
this.year--
}
calendar(new Date(this.year, this.month,1))
}
nextmonth()
{
self.selectedDate = undefined
this.month++
if(this.month > 11)
{
this.month = 0
this.year++
}
calendar(new Date(this.year, this.month,1))
}
var calendar = function (date) {
if (date === null)
date = new Date()
self.day = date.getDate()
self.month = date.getMonth()
self.year = date.getFullYear()
var now ={ d:(new Date()).getDate(), m:(new Date()).getMonth(), y:(new Date()).getFullYear()}
months = ["__(January)", "__(February)", "__(March)", "__(April)", "__(May)", "__(June)", "__(July)", "__(August)", "__(September)", "__(October)", "__(November)", "__(December)"]
this_month = new Date(self.year, self.month, 1)
next_month = new Date(self.year, self.month + 1, 1)
// Find out when this month starts and ends.
first_week_day = this_month.getDay()
days_in_this_month = Math.round((next_month.getTime() - this_month.getTime()) / (1000 * 60 * 60 * 24))
self.mtext = months[self.month]
var rows = []
var row = []
// Fill the first week of the month with the appropriate number of blanks.
for (week_day = 0; week_day < first_week_day; week_day++)
row.push({value:""})
week_day = first_week_day;
for (day_counter = 1; day_counter <= days_in_this_month; day_counter++) {
week_day %= 7
if (week_day == 0)
{
rows.push(row)
row =[]
}
// Do something different for the current day.
if (now.d == day_counter && self.month == now.m && self.year == now.y)
row.push({value:day_counter, selected:true})
else
row.push({value:day_counter})
week_day++;
}
for(var i = 0; i <= 7 - row.length;i++)
row.push({value:""})
rows.push(row)
self.refs.grid.root.set("rows",rows)
}
</script>
</afx-calendar-view>

110
src/core/tags/afx-color-picker.tag
View File

@ -1,110 +0,0 @@
<afx-color-picker>
<div style = "width:310px; height:190px;display:block; padding:3px;">
<canvas class = "color-palette" width="284" height="155" style ="float:left;" ref = "palette" ></canvas>
<div class = "color-sample" style= "width:15px; height:155px; text-align:center; margin-left:3px; display:block;float:left;" ref = "colorval"></div>
<div class = "afx-clear"></div>
<div style ="margin-top:3px;">
<span>Hex:</span><input type = "text" ref = "hextext" style = "width:70px; margin-left:3px;margin-right:5px;"></input>
<span ref = 'rgbtext'></span>
</div>
</div>
<script>
var self = this
var colorctx = undefined
self.root.observable = opts.observable
self.oncolorsetect = opts.oncolorsetect
self.selectedColor = undefined
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.get = function(k)
{
return self[k]
}
var build_palette = function()
{
colorctx = $(self.refs.palette).get(0).getContext('2d')
var gradient = colorctx.createLinearGradient(0,0,$(self.refs.palette).width(),0)
// fill color
gradient.addColorStop(0, "rgb(255, 0, 0)")
gradient.addColorStop(0.15, "rgb(255, 0, 255)")
gradient.addColorStop(0.33, "rgb(0, 0, 255)")
gradient.addColorStop(0.49, "rgb(0, 255, 255)")
gradient.addColorStop(0.67, "rgb(0, 255, 0)")
gradient.addColorStop(0.84, "rgb(255, 255, 0)")
gradient.addColorStop(1, "rgb(255, 0, 0)")
gradient.addColorStop(0, "rgb(0, 0, 0)")
// Apply gradient to canvas
colorctx.fillStyle = gradient;
colorctx.fillRect(0, 0, colorctx.canvas.width, colorctx.canvas.height)
// Create semi transparent gradient (white -> trans. -> black)
gradient = colorctx.createLinearGradient(0, 0, 0, $(self.refs.palette).width())
gradient.addColorStop(0, "rgba(255, 255, 255, 1)")
gradient.addColorStop(0.5, "rgba(255, 255, 255, 0)")
gradient.addColorStop(0.5, "rgba(0, 0, 0, 0)")
gradient.addColorStop(1, "rgba(0, 0, 0, 1)")
// Apply gradient to canvas
colorctx.fillStyle = gradient
colorctx.fillRect(0, 0, colorctx.canvas.width, colorctx.canvas.height)
//$(self.refs.palette).css("position", "absolute")
// now add mouse move event
var getHex = function(c)
{
s = c.toString(16)
if(s.length == 1) s = "0" + s
return s
}
var pick_color = function(e)
{
$(self.refs.palette).css("cursor","crosshair")
var offset = $(self.refs.palette).offset()
var x = e.pageX - offset.left
var y = e.pageY - offset.top
var color = colorctx.getImageData(x,y, 1, 1)
var data = {
r:color.data[0],
g:color.data[1],
b:color.data[2],
text:'rgb(' + color.data[0] + ', ' + color.data[1] + ', ' + color.data[2] + ')',
hex:'#' + getHex(color.data[0]) + getHex(color.data[1]) + getHex(color.data[2])
}
return data
}
var mouse_move_h = function(e)
{
var data = pick_color(e)
$(self.refs.colorval).css("background-color", data.text)
}
$(self.refs.palette).mouseenter(function(e){
$(self.refs.palette).on("mousemove",mouse_move_h)
})
$(self.refs.palette).mouseout(function(e){
$(self.refs.palette).unbind("mousemove",mouse_move_h)
if(self.selectedColor)
$(self.refs.colorval).css("background-color", self.selectedColor.text)
})
$(self.refs.palette).on("click", function(e){
data = pick_color(e)
$(self.refs.rgbtext).html(data.text)
$(self.refs.hextext).val(data.hex)
self.selectedColor = data
if(self.oncolorsetect)
self.oncolorsetect(data)
if(! self.root.observable) return
self.root.observable.trigger("colorselect",data)
})
}
this.on("mount", function(){
build_palette()
})
</script>
</afx-color-picker>

10
src/core/tags/afx-dummy.tag
View File

@ -1,10 +0,0 @@
<afx-dummy>
<yield/>
<script>
var self = this
self.root.update = function()
{
self.update()
}
</script>
</afx-dummy>

226
src/core/tags/afx-file-view.tag
View File

@ -1,226 +0,0 @@
<afx-file-view>
<afx-list-view ref="listview" observable = {root.observable}></afx-list-view>
<afx-grid-view ref = "gridview" header = {header} observable = {root.observable}></afx-grid-view>
<div class = "treecontainer" ref="treecontainer">
<afx-tree-view ref = "treeview" observable = {root.observable}></afx-tree-view>
</div>
<afx-label if = {status == true} class = "status" ref = "stbar"></afx-label>
<script>
var self = this
self.root.observable = opts.observable || riot.observable()
self.view = opts.view || 'list'
self.data = opts.data || []
self.path = opts.path || "home:///"
self.onfileselect
self.onfileopen
this.status = opts.status == undefined?true:opts.status
this.selectedFile = undefined
this.showhidden = opts.showhidden
this.preventUpdate = false
this.fetch = opts.fetch
this.chdir = opts.chdir
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
this.header = [{value:"__(File name)"},{value: "__(Type)", width:150}, {value: "__(Size)", width:70}]
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
if(k == 'view')
switchView()
if(k == "data")
self.selectedFile = undefined
if(k != "preventUpdate")
self.update()
}
self.root.get = function(k)
{
return self[k]
}
var sortByType = function(a,b)
{
return a.type < b.type ? -1 : ( a.type > b.type ? 1: 0 )
}
var calibre_size = function()
{
var h = $(self.root).outerHeight()
var w = $(self.root).width()
if(self.refs.stbar)
h -= ($(self.refs.stbar.root).height() + 10)
$(self.refs.listview.root).css("height", h + "px")
$(self.refs.gridview.root).css("height", h + "px")
$(self.refs.treecontainer).css("height", h + "px")
$(self.refs.listview.root).css("width", w + "px")
$(self.refs.gridview.root).css("width", w + "px")
$(self.refs.treecontainer).css("width", w + "px")
}
var refreshList = function(){
var items = []
$.each(self.data, function(i, v){
if(v.filename[0] == '.' && !self.showhidden) return
v.text = v.filename
if(v.text.length > 10)
v.text = v.text.substring(0,9) + "..."
v.iconclass = v.iconclass?v.iconclass:v.type
v.icon = v.icon
items.push(v)
})
self.refs.listview.root.set("items", items)
}
var refreshGrid = function(){
var rows = []
$.each(self.data, function(i,v){
if(v.filename[0] == '.' && !self.showhidden) return
var row = [{value:v.filename, iconclass: v.iconclass?v.iconclass:v.type, icon:v.icon},{value:v.mime},{value:v.size},{idx:i}]
rows.push(row)
})
self.refs.gridview.root.set("rows",rows)
}
var refreshTree = function(){
self.refs.treeview.root.set("selectedItem", null)
var tdata = {}
tdata.name = self.path
tdata.nodes = getTreeData(self.data)
self.refs.treeview.root.set("data", tdata)
}
var getTreeData = function(data)
{
nodes = []
$.each(data, function(i,v){
if(v.filename[0] == '.' && !self.showhidden) return
v.name = v.filename
if(v.type == 'dir')
{
v.nodes = []
v.open = false
}
v.iconclass = v.iconclass?v.iconclass:v.type
v.icon = v.icon
nodes.push(v)
})
return nodes
}
var refreshData = function(){
self.data.sort(sortByType)
if(self.view == "icon")
refreshList()
else if(self.view == "list")
refreshGrid()
else
refreshTree()
}
var switchView = function()
{
$(self.refs.listview.root).hide()
$(self.refs.gridview.root).hide()
$(self.refs.treecontainer).hide()
self.selectedFile = undefined
self.refs.listview.root.set("selected", -1)
self.refs.treeview.selectedItem = undefined
self.refs.treeview.root.set("fetch",function(e,f){
if(!self.fetch) return
self.fetch(e, function(d){
f(getTreeData(d))
})
})
if(self.refs.stbar)
self.refs.stbar.root.set("text", "")
switch (self.view) {
case 'icon':
$(self.refs.listview.root).show()
break;
case 'list':
$(self.refs.gridview.root).show()
break;
case 'tree':
$(self.refs.treecontainer).show()
break;
default:
break;
}
calibre_size()
}
self.on("updated", function(){
if(self.preventUpdate)
{
self.preventUpdate = false
}
else
refreshData()
//console.log("update")
//calibre_size()
})
self.on("mount", function(){
switchView()
self.refs.listview.onlistselect = function(data)
{
data.id = self.rid
self.root.observable.trigger("fileselect",data)
}
self.refs.listview.onlistdbclick = function(data)
{
data.id = self.rid
self.root.observable.trigger("filedbclick",data)
}
self.refs.gridview.root.observable = self.root.observable
self.refs.gridview.ongridselect = function(d)
{
var data = {id:self.rid, data:self.data[d.data.child[3].idx], idx:d.data.child[3].idx}
self.root.observable.trigger("fileselect",data)
}
self.refs.gridview.ongriddbclick = function(d)
{
var data = {id:self.rid, data:self.data[d.data.child[3].idx], idx:d.data.child[3].idx}
self.root.observable.trigger("filedbclick",data)
}
self.refs.treeview.ontreeselect = function(d)
{
if(!d) return;
var data;
var el = d;
if(d.treepath == 0)// select the root
{
el = self.path.asFileHandler()
el.size = 0
el.filename = el.path
}
var data = {id:self.rid, data:el}
self.root.observable.trigger("fileselect",data)
}
self.refs.treeview.ontreedbclick = function(d)
{
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){
if(e.id != self.rid) return
self.selectedFile = e.data
if(self.onfileselect)
self.onfileselect(e.data)
if(self.refs.stbar)
self.refs.stbar.root.set("text", __("Selected: {0} ({1} bytes)", e.data.filename, e.data.size?e.data.size:"0"))//.html()
})
self.root.observable.on("filedbclick", function(e){
if(e.id != self.rid ) return
if(e.data.type != "dir" && self.onfileopen)
self.onfileopen(e.data)
else if(self.chdir && e.data.type == "dir")
self.chdir(e.data.path)
})
calibre_size()
self.root.observable.on("resize", function(e){
calibre_size()
})
self.root.observable.on("calibrate", function(e){
calibre_size()
})
/*self.root.observable.on("*", function(e){
console.log(e)
})*/
})
</script>
</afx-file-view>

183
src/core/tags/afx-float-list.tag
View File

@ -1,183 +0,0 @@
<afx-float-list ref = "container">
<div ref = "list">
<div each={item,i in items } class={float_list_item:true, float_list_item_selected: parent._autoselect(item,i)} ondblclick = {parent._dbclick} onmousedown = {parent._select} oncontextmenu = {parent._select}>
<afx-label color = {item.color} iconclass = {item.iconclass} icon = {item.icon} text = {item.text}></afx-label>
</div>
</div>
<script>
this.items = opts.items || []
var self = this
self.selidx = -1
self.onlistselect = opts.onlistselect
self.onlistdbclick = opts.onlistdbclick
self.fetch = undefined
this.root.observable = opts.observable || riot.observable()
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.dir = opts.dir || "horizontal"
self.root.set = function(k,v)
{
if(k == "selected")
{
if(self.selidx != -1)
self.items[self.selidx].selected =false
if(v == -1)
self.selidx = -1
else
if(self.items[v]) self.items[v].selected = true
}
else if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.get = function(k)
{
if(k == "selected")
if(self.selidx == -1)
return undefined
else
return self.items[self.selidx]
return self[k]
}
self.root.push = function(e,u)
{
self.items.push(e)
if(u) self.update()
}
self.root.unshift = function(e,u)
{
self.items.unshift(e)
if(u) self.update()
}
self.root.remove = function(e,u)
{
var i = self.items.indexOf(e)
if(i >= 0)
{
if(self.selidx != -1)
{
self.items[self.selidx].selected =false
self.selidx = -1
}
self.items.splice(i, 1)
if(u)
self.update()
}
}
self.root.refresh = function()
{
_refresh()
}
this.on("mount", function(){
if(self.root.ready)
self.root.ready(self.root)
// now refresh the list
_refresh()
})
var _refresh = function()
{
var ctop = 20
var cleft = 20
var gw = $(self.refs.container).width()
var gh = $(self.refs.container).height()
$(self.refs.list)
.children()
.each(function(e)
{
$(this).unbind("mousedown")
_enable_drag($(this))
var w = $(this).width()
var h = $(this).height()
$(this).css("top", ctop + "px").css("left", cleft + "px")
if(self.dir == "horizontal")
{
ctop += h + 20
if(ctop > gh)
{
ctop = 20
cleft += w + 20
}
}
else
{
cleft += w + 20
if(cleft > gw )
{
cleft = 20
ctop += h + 20
}
}
})
}
var _enable_drag = function(el)
{
var globalof = $(self.refs.container).offset()
el
.css("user-select","none")
.css("cursor","default")
.css("position",'absolute')
.on("mousedown", function(e){
e.preventDefault()
offset = el.offset()
offset.top = e.clientY - offset.top
offset.left = e.clientX - offset.left
$(window).on("mousemove", function(e){
var top,left
top = e.clientY - offset.top - globalof.top
left = e.clientX - globalof.top - offset.left
left = left < 0?0:left
top = top < 0?0:top
el.css("top", top +"px").css("left",left + "px")
})
$(window).on("mouseup", function(e){
//console.log("unbind mouse up")
$(window).unbind("mousemove", null)
})
})
}
_autoselect(it,i)
{
if(self.selidx == i) return true
if(!it.selected || it.selected == false) return false
var data = {
id:self.rid,
data:it,
idx:i}
//if(self.selidx != -1)
// self.items[self.selidx].selected =false
self.selidx = i
if(self.onlistselect)
self.onlistselect(data)
this.root.observable.trigger('listselect',data)
return true
}
_select(event)
{
if(self.selidx != -1 && self.selidx < self.items.length)
self.items[self.selidx].selected =false
event.item.item.selected = true
//console.log(self.items)
self.update()
//event.preventUpdate = true
}
_dbclick(event)
{
data = {
id:self.rid,
data:event.item.item,
idx: event.item.i}
if(self.onlistdbclick)
self.onlistdbclick(data)
self.root.observable.trigger('listdbclick', data)
}
</script>
</afx-float-list>

218
src/core/tags/afx-grid-view.tag
View File

@ -1,218 +0,0 @@
<afx-grid-view>
<afx-grid-row ref="gridhead" rootid = {rid} observable = {root.observable} header="true" class = {grid_row_header:header} if = {header} cols = {header}> </afx-grid-row>
<div ref = "scroller" style="width:100%; overflow:auto;">
<div ref = "container" style ="padding-bottom:10px">
<afx-grid-row each={ child, i in rows } class = {selected: child.selected} rootid = {parent.rid} observable = {parent.root.observable} index = {i} cols = {child} ondblclick = {parent._dbclick} onclick = {parent._select} oncontextmenu = {parent._select} head = {parent.refs.gridhead} ></afx-grid-row>
</div>
</div>
<script>
this.header = opts.header
this.rows = opts.rows || []
var self = this
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.selidx = -1
self.nrow = 0
self.ongridselect = opts.ongridselect
self.ongriddbclick = opts.ongriddbclick
self.root.observable = opts.observable
self.root.set = function(k,v)
{
if(k == "selected")
self._select({item:self.rows[v], preventDefault:function(){}})
else if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
this.calibrate_size = function()
{
if(self.header && self.refs.gridhead)
{
$(self.refs.scroller).css("height",
$(self.root).height() - $(self.refs.gridhead.root).children().first().height()
+ "px")
}
else
$(self.refs.scroller).css("height",
$(self.root).height() + "px")
}
self.root.get = function(k)
{
if(k == "selected")
return (self.selidx == -1?null:self.rows[self.selidx])
return self[k]
}
this.on("mount", function(){
if(self.refs.gridhead)
self.refs.gridhead.observable = self.root.observable
$(self.refs.container)
.css("display","table")
//.css("flex-direction","column")
.css("width","100%")
self.calibrate_size()
self.root.observable.on("resize",function(){
if(self.root)
self.calibrate_size()
})
})
this.on("updated",function(){
if(self.selidx >= self.rows.length)
self.selidx = -1
if(self.nrow == self.rows.length) return
self.nrow = self.rows.length
self.calibrate_size()
})
_select(event)
{
var data = {
id:self.rid,
data:event.item}
if(self.ongridselect)
self.ongridselect(data)
if(self.selidx != -1)
self.rows[self.selidx].selected =false
self.selidx = event.item.i
self.rows[self.selidx].selected = true
self.root.observable.trigger('gridselect',data)
event.preventUpdate = true
self.update()
//event.preventDefault()
}
_dbclick(event)
{
data = {
id:self.rid,
data:event.item}
if(self.ongriddbclick)
self.ongriddbclick(data)
self.root.observable.trigger('griddbclick', data)
}
</script>
</afx-grid-view>
<afx-grid-row>
<div style = {!header? "display: table-cell;" :""} onclick = {parent._cell_select} each = { child,i in cols } class = {string:typeof child.value == "string", number: typeof child.value == "number", cellselected: parent._auto_cell_select(child,i)} >
<afx-label color={child.color} icon = {child.icon} iconclass = {child.iconclass} text = {child.value} ></afx-label>
</div>
<script>
this.cols = opts.cols || []
var self = this
this.rid = opts.rootid
this.index = opts.index
this.header = eval(opts.header)||false
this.head = opts.head
this.selidx = -1
self.observable = opts.observable
this.colssize = []
var update_header_size = function()
{
if(!self.cols || self.cols.length == 0) return
var totalw = $(self.root).parent().width()
if(totalw == 0) return
var ocw = 0
var nauto = 0
self.colssize = []
$.each(self.cols, function(i,e){
if(e.width)
{
self.colssize.push(e.width)
ocw += e.width
}
else
{
self.colssize.push(-1)
nauto++
}
})
if(nauto > 0)
{
var cellw = parseInt((totalw - ocw)/ nauto)
$.each(self.colssize,function(i,e){if(e == -1) self.colssize[i] = cellw})
}
calibrate_size()
}
var calibrate_size = function()
{
var i = 0
$(self.root)
.children()
.each(function(){
$(this).css("width", self.colssize[i]+"px")
i++
})
}
this.on("updated", function(){
if(self.header)
update_header_size()
else if(self.head && self.index == 0)
{
self.colssize = self.head.colssize
calibrate_size()
}
})
this.on("mount", function(){
if (self.header)
{
$(self.root)
.css("display", "flex")
.css("flex-direction", "row")
update_header_size()
}
else
{
$(self.root)
.css("display","table-row")
//.css("flex-direction","row")
.css("width","100%")
if(self.head && self.index == 0)
{
self.colssize = self.head.colssize
calibrate_size()
}
}
self.observable.on("gridcellselect", function(data){
if(data.id != self.rid || self.selidx == -1) return;
if(data.row != self.index)
{
self.cols[self.selidx].selected = false
self.selidx = -1
}
})
self.observable.on("resize",function(){
self.update()
})
})
_cell_select(event)
{
if(self.header) return;
if(self.selidx != -1)
{
self.cols[self.selidx].selected = false
self.selidx = -1
}
self.cols[event.item.i].selected = true
}
_auto_cell_select(child,i)
{
if(!child.selected || self.header) return false;
if(self.selidx == i) return true;
var data = {
id:self.rid,
data:child,
col:i,
row:self.index}
self.selidx = i
self.observable.trigger("gridcellselect",data)
return true;
}
</script>
</afx-grid-row>

79
src/core/tags/afx-hbox.tag
View File

@ -1,79 +0,0 @@
<afx-hbox style = "display:block;">
<div ref = "container" class="afx-hbox-container">
<yield/>
</div>
<script>
var self = this
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
this.on('mount', function(){
self.root.observable = (self.parent && self.parent.root && self.parent.root.observable) || opts.observable || riot.observable()
$(self.refs.container)
.css("display","flex")
.css("flex-direction","row")
.css("width","100%")
calibrate_size()
if(self.root.observable)
{
self.root.observable.on("resize", function(w,h){
calibrate_size()
})
self.root.observable.on("calibrate", function(){
calibrate_size()
})
}
})
self.root.update = function()
{
self.update()
}
var calibrate_size = function()
{
var auto_width = []
var csize, ocwidth = 0, avaiheight;
avaiheight = $(self.root).height()
avaiWidth = $(self.root).width()
/*if(avaiheight == 0)
{
avaiheight = $(self.parent.root).height()
$(self.root).css("height", avaiheight+"px")
}
if(avaiWidth == 0)
{
avaiWidth = $(self.parent.root).width()
$(self.root).css("height", avaiWidth+"px")
}*/
$(self.refs.container).css("height",avaiheight + "px")
$(self.refs.container)
.children()
.each(function(e)
{
this.observable = self.root.observable
//.css("height",avaiheight + "px")
var dw = $(this).attr("data-width")
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)
}
else
{
$(this).css("flex-grow","1")
auto_width.push(this)
}
})
csize = (avaiWidth - ocwidth)/ (auto_width.length)
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})
}
</script>
</afx-hbox>

20
src/core/tags/afx-html.tag
View File

@ -1,20 +0,0 @@
<afx-html ref = "container">
<script>
this.content = opts.content
this.root.innerHTML = this.content
this.updateContent = undefined
var self = this
this.root.set = function(k, v)
{
self[k] = v
if(k == "content")
self.root.innerHTML = v
else if(k == "updateContent")
self.update()
}
this.on("update", function(){
if(self.updateContent)
self.root.innerHTML = self.updateContent()
})
</script>
</afx-html>

33
src/core/tags/afx-label.tag
View File

@ -1,33 +0,0 @@
<afx-label>
<span style = {color?"color:" + color:""} >
<i if={iconclass} class = {iconclass} ></i>
<i if={icon} class="icon-style" style = { "background: url("+window.OS.API.handle.get+"/"+icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
{ text?text.__():"" }
</span>
<script>
this.iconclass = opts.iconclass
this.icon = opts.icon
this.text = opts.text
this.color = opts.color
var self = this
this.on("update",function(){
self.iconclass = opts.iconclass
self.icon = opts.icon
self.text = opts.text
self.color = opts.color
})
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
opts[i] = v[i]
else
opts[k] = v
self.update()
}
self.root.get = function(k)
{
return self[k]
}
</script>
</afx-label>

227
src/core/tags/afx-list-view.tag
View File

@ -1,227 +0,0 @@
<afx-list-view class = {dropdown: opts.dropdown == "true"} style = "display:flex; flex-direction:column">
<div class = "list-container" ref = "container" style="flex:1;">
<div if = {opts.dropdown == "true"} ref = "current" onclick = {show_list}>
<afx-label ref = "drlabel"></afx-label>
</div>
<ul ref = "mlist" >
<li each={item,i in items } class={selected: parent._autoselect(item,i)} ondblclick = {parent._dbclick} onclick = {parent._select} oncontextmenu = {parent._select}>
<afx-label class = {item.class} 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.detail} class = {ctn.class}>{ctn.text.toString()}</li>
</ul>
</li>
</ul>
</div>
<div if = {opts.dropdown != "true" && buttons} class = "button_container">
<afx-button each = {btn,i in buttons} text = {btn.text} icon = {btn.icon} iconclass = {btn.iconclass} onbtclick = {btn.onbtclick}></afx-button>
</div>
<script>
this.items = opts.items || []
var self = this
self.selidx = -1
self.onlistselect = opts.onlistselect
self.onlistdbclick = opts.onlistdbclick
self.onitemclose = opts.onitemclose
self.buttons = opts.buttons
var onclose = false
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.root.set = function(k,v)
{
if(k == "selected")
{
if(self.selidx != -1)
self.items[self.selidx].selected =false
if(v == -1)
self.selidx = -1
else
if(self.items[v]) self.items[v].selected = true
}
else if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.get = function(k)
{
if(k == "selected")
if(self.selidx != -1)
return self.items[self.selidx]
else
return undefined
else if(k == "count")
return self.items.length
return self[k]
}
self.root.selectNext = function()
{
var idx = self.selidx + 1
if(idx >= self.items.length) return;
if(self.selidx != -1)
self.items[self.selidx].selected =false
self.items[idx].selected =true
self.update()
}
self.root.selectPrev = function()
{
var idx = self.selidx - 1
if(idx < 0) return;
if(self.selidx != -1)
self.items[self.selidx].selected =false
self.items[idx].selected =true
self.update()
}
self.root.push = function(e,u)
{
self.items.push(e)
if(u) self.update()
}
self.root.unshift = function(e,u)
{
self.items.unshift(e)
if(u) self.update()
}
self.root.replaceItem = function(o, n, u)
{
var ix = self.items.indexOf(o)
if(ix >= 0)
{
self.items[ix] = n
if(u) self.update()
}
}
self.root.remove = function(e,u)
{
var i = self.items.indexOf(e)
if(i >= 0)
{
if(self.selidx != -1)
{
self.items[self.selidx].selected =false
self.selidx = -1
}
self.items.splice(i, 1)
if(u)
self.update()
onclose = true
}
}
if(opts.observable)
this.root.observable = opts.observable
else
{
this.root.observable = riot.observable()
}
this.on("mount", function(){
self.root.observable = opts.observable || (self.parent && self.parent.root && self.parent.root.observable) || riot.observable()
if(opts.dropdown == "true")
{
var cl = function()
{
$(self.refs.container).css("width", $(self.root).width() + "px" )
$(self.refs.current).css("width", $(self.root).width() + "px" )
$(self.refs.mlist).css("width", $(self.root).width() + "px" )
}
cl()
self.root.observable.on("calibrate", function(){
cl()
})
self.root.observable.on("resize", function(){
cl()
})
$(document).click(function(event) {
if(!$(event.target).closest(self.refs.container).length) {
$(self.refs.mlist).hide()
}
})
//$(self.root).css("position","relative")
$(self.refs.container)
.css("position","absolute")
.css("display","inline-block")
$(self.refs.mlist)
.css("position","absolute")
.css("display","none")
.css("top","100%")
.css("left","0")
self.root.observable.on("vboxchange", function(e){
if(e.id == self.parent.rid)
$(self.refs.container).css("width", $(self.root).parent().innerWidth() + "px" )
})
}
})
show_list(event)
{
var desktoph = $("#desktop").height()
var off = $(self.root).offset().top + $(self.refs.mlist).height()
if( off > desktoph )
$(self.refs.mlist)
.css("top","-" + $(self.refs.mlist).outerHeight() + "px")
else
$(self.refs.mlist).css("top","100%")
$(self.refs.mlist).show()
//event.preventDefault()
event.preventUpdate = true
}
_remove(event)
{
r = true
if(self.onitemclose)
r = self.onitemclose(event)
if(r)
self.root.remove(event.item.item, true)
}
_autoselect(it,i)
{
if(!it.selected || it.selected == false) return false
if(self.selidx == i) return true
var data = {
id:self.rid,
data:it,
idx:i}
//if(self.selidx != -1)
// self.items[self.selidx].selected =false
self.selidx = i
if(opts.dropdown == "true")
{
$(self.refs.mlist).hide()
self.refs.drlabel.root.set("*",it)
}
if(self.onlistselect)
self.onlistselect(data)
this.root.observable.trigger('listselect',data)
//console.log("list select")
return true
}
_select(event)
{
if(onclose)
{
onclose = false
event.preventUpdate = true
return
}
if(self.selidx != -1 && self.selidx < self.items.length)
self.items[self.selidx].selected =false
event.item.item.selected = true
}
_dbclick(event)
{
data = {
id:self.rid,
data:event.item.item,
idx: event.item.i}
if(self.onlistdbclick)
self.onlistdbclick(data)
self.root.observable.trigger('listdbclick', data)
}
</script>
</afx-list-view>

179
src/core/tags/afx-menu.tag
View File

@ -1,179 +0,0 @@
<afx-menu >
<ul class={context: opts.context == "true"}>
<li class="afx-corner-fix"></li>
<li ref = "container" each={ data,i in items } class = {afx_submenu:data.child != null && data.child.length > 0, fix_padding:data.icon} no-reorder>
<a href="#" onclick = {parent.onselect}>
<afx-switch if = {data.switch || data.radio} class = {checked:parent.checkItem(data)} enable = false swon = {data.checked} ></afx-switch>
<afx-label color = {data.color} iconclass = {data.iconclass} icon = {data.icon} text = {data.text} ></afx-label>
<span if={data.shortcut} class = "shortcut">{data.shortcut}</span>
</a>
<afx-menu ref = "submenus" index = {i} if={data.child != null && data.child.length > 0} child={data.child} onmenuselect = {data.onmenuselect} observable = {parent.root.observable} rootid = {parent.rid}></afx-menu>
</li>
<li class="afx-corner-fix"></li>
</ul>
<script>
this.items = opts.child || []
if(opts.index != undefined)
this.index = opts.index
else
this.index = -1
var isRoot
var lastChecked = undefined
if(opts.rootid)
{
this.rid = opts.rootid
isRoot = false
}
else
{
this.rid = $(this.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
isRoot = true
}
var self = this
this.onmenuselect = opts.onmenuselect
checkItem(d)
{
if(d.checked == true && d.radio)
{
if(lastChecked)
lastChecked.checked = false
lastChecked = d
lastChecked.checked = true
}
return false
}
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.push = function(e,u)
{
self.items.push(e)
if(u)
self.update()
}
self.root.unshift = function(e,u)
{
self.items.unshift(e)
if(u)
self.update()
}
self.root.remove = function(e,u)
{
var i = self.items.indexOf(e)
if(i >= 0)
self.items.splice(i, 1)
if(u)
self.update()
}
self.root.update = function()
{
self.update()
}
self.root.get = function(k)
{
return self[k]
}
self.root.show = function(e)
{
//only for menucontext
if(opts.context != "true") return
$(self.root)
.css("top", e.clientY - 15 + "px")
.css("left",e.clientX -5 + "px")
.show()
$(document).on("click",mnhide)
}
if(opts.observable)
{
this.root.observable = opts.observable
}
else
{
this.root.observable = riot.observable()
this.root.observable.on('menuselect',function(data){
if(self.onmenuselect)
self.onmenuselect(data)
if(opts.context == "true")
$(self.root).hide()
else if(!data.root && self.refs.container)
{
var arr = self.refs.container.length?self.refs.container:[self.refs.container]
for( var i in arr)
$("afx-menu",arr[i]).first().hide()
}
})
}
var mnhide = function(event)
{
if(opts.context == "true")
{
if(event.button == 2 || event.originalEvent.button == 2)
{
return
}
if(!$(event.target).closest(self.root).length) {
$(self.root).hide()
$(document).unbind("click",mnhide)
}
return
}
if(!$(event.target).closest(self.refs.container).length && self.refs.container) {
var arr = self.refs.container.length?self.refs.container:[self.refs.container]
for( var i in arr)
$("afx-menu",arr[i]).first().hide()
$(document).unbind("click",mnhide)
}
else
{
if(self.refs.container && self.refs.container.length)
for(var i in self.refs.container)
if(!$(event.target).closest(self.refs.container[i]).length) {
$("afx-menu",self.refs.container[i]).first().hide()
}
}
}
onselect(event)
{
var data = {id:self.rid, root:isRoot, e:event, item:event.item}
if(event.item.data.switch)
{
event.item.data.checked = !event.item.data.checked
} else if(event.item.data.radio)
{
if(lastChecked)
{
lastChecked.checked = false
}
event.item.data.checked = true
lastChecked = event.item.data
}
this.root.observable.trigger('menuselect',data)
if( this.onmenuselect && !isRoot) this.onmenuselect(data)
event.preventDefault()
$(document).unbind("click",mnhide)
if(opts.context == "true") return
if(isRoot && self.refs.container)
{
if(self.refs.container.length)
$("afx-menu",self.refs.container[event.item.i]).first().show()
else
$("afx-menu",self.refs.container).first().show()
$(document).on("click",mnhide)
return
}
}
</script>
</afx-menu>

100
src/core/tags/afx-nspinner.tag
View File

@ -1,100 +0,0 @@
<afx-nspinner>
<input ref = "holder" type="text" value = {value}></input>
<ul ref = "spinner">
<li class = "incr" ref= "incr" onclick="{ _incr }"> <i></i> </li>
<li class = "decr" ref = "decr" onclick="{ _decr }"> <i></i> </li>
</ul>
<script>
this.value = eval(opts.value) || 0
this.step = Number(opts.step) || 1
this.onchange = opts.onchange
var self = this
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.get = function(k)
{
return self[k]
}
self._incr = function(e)
{
self.value = self.value + self.step;
self.update();
if(self.onchange) self.onchange(self.value);
}
self.on("mount", function(){
self.root.observable = opts.observable || (self.parent && self.parent.root && self.parent.root.observable) || riot.observable()
$(self.refs.spinner).css("width", "20px" );
var cl = function()
{
$(self.refs.holder).css("width", $(self.root).width() - 20 + "px" )
$(self.refs.holder).css("height", $(self.root).height() + "px" )
$(self.refs.spinner)
.css("width","20px")
.css("height", $(self.root).height() + "px" )
$(self.refs.incr)
.css("height", $(self.root).height()/2 - 2 + "px")
.css("position", "relative")
$(self.refs.decr).css("height", $(self.root).height()/2 -2 + "px")
.css("position", "relative")
$(self.refs.spinner).find("li")
.css("display","block")
.css("text-align", "center")
.css("vertical-align", "middle")
$(self.refs.spinner).find("i")
.css("font-size", "16px")
.css("position", "absolute")
var fn = function(ie, pos)
{
var el = $(ie).find("i")
el
.css(pos,($(ie).height()-el.height()) /2 + "px" )
.css("left", ($(ie).width()-el.width())/2 + "px" )
}
fn(self.refs.decr, "bottom")
fn(self.refs.incr, "top")
}
cl()
self.root.observable.on("calibrate", function(){
cl()
})
self.root.observable.on("resize", function(){
cl()
});
$(self.refs.holder).on('keyup', function (e) {
if (e.keyCode == 13) {
var val = self.refs.holder.value;
if(!isNaN(val))
{
val = eval(val)
if(val < 0)
val = self.value;
self.value = val;
}
self.refs.holder.value = self.value;
if(self.onchange) self.onchange(self.value);
}
});
})
self._decr = function(e)
{
if(self.value == 0) return;
self.value = self.value - self.step;
self.update();
if(self.onchange) self.onchange(self.value);
}
</script>
</afx-nspinner>

45
src/core/tags/afx-overlay.tag
View File

@ -1,45 +0,0 @@
<afx-overlay>
<yield/>
<script>
this.width = opts.width || 200
this.height = opts.height || 400
var self = this;
self.commander = null
this.root.observable = opts.observable || riot.observable()
var id = $(self.root).attr("data-id")
var calibre_size = function()
{
$(self.root)
.css("width", self.width + "px")
.css("height", self.height + "px")
self.root.observable.trigger("resize", {id:id,w:self.width,h:self.height})
}
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
if( k == "width" || k == "height")
calibre_size()
self.update()
}
self.root.get = function(k)
{
return self[k]
}
self.on("mount", function(){
$(self.root)
.css("position", "absolute")
//.css("z-index",1000000)
$(self.root).children().each(function(e){
this.observalbe = self.root.observalbe
})
calibre_size()
self.root.observable.trigger("rendered", self.root)
})
</script>
</afx-overlay>

85
src/core/tags/afx-resizer.tag
View File

@ -1,85 +0,0 @@
<afx-resizer>
<script>
var self = this
self.dir = "hz"
self.resizable = undefined
self.parent = undefined
self.minsize = 0
self.on("mount", function(){
//self.parent = $(self.root).parent().parent()
var tagname = $(self.parent.root).prop("tagName")
self.resizable = $(self.root).prev().length == 1 ? $(self.root).prev()[0]: undefined
//self.nextel = $(self.root).next().length == 1 ? $(self.root).next()[0]: undefined
if(tagname == "AFX-HBOX")
{
self.dir = "hz"
$(self.root).css("cursor", "col-resize")
if(self.resizable)
{
self.minsize = parseInt($(self.resizable).attr("min-width"))
}
}
else if(tagname == "AFX-VBOX")
{
self.dir = "ve"
$(self.root).css("cursor", "row-resize")
if(self.resizable)
{
self.minsize = parseInt($(self.resizable).attr("min-height"))
}
}
else
{
//$(self.root).css("cursor", "normal")
self.dir = "none"
}
if(!self.minsize)
self.minsize = 10
enable_dragging()
})
var enable_dragging = function()
{
$(self.root)
.css("user-select","none")
$(self.root).on("mousedown", function(e){
e.preventDefault()
$(window).on("mousemove", function(evt){
if(!self.resizable) return
if(self.dir == "hz")
horizontalResize(evt)
else if (self.dir == "ve")
verticalResize(evt)
})
$(window).on("mouseup", function(evt){
//console.log("unbind mouse up")
$(window).unbind("mousemove", null)
})
})
}
var horizontalResize = function(e)
{
if(!self.resizable) return
var offset = $(self.resizable).offset()
w = Math.round(e.clientX - offset.left)
if(w < self.minsize) w = self.minsize
$(self.resizable).attr("data-width", w.toString())
self.parent.root.observable.trigger("calibrate", self.resizable)
}
var verticalResize = function(e)
{
//console.log("vboz")
if(!self.resizable) return
var offset = $(self.resizable).offset()
//console.log($(self.resizable).innerHeight())
//console.log(e.clientY, offset.top)
h = Math.round(e.clientY - offset.top)
if(h < self.minsize) h = minsize
$(self.resizable).attr("data-height", h.toString())
self.parent.root.observable.trigger("calibrate", self.resizable)
}
</script>
</afx-resizer>

107
src/core/tags/afx-slider.tag
View File

@ -1,107 +0,0 @@
<afx-slider>
<div class= "container" ref="container">
<div class = "progress" ref ="prg"></div>
<div if = {dragable} class = "dragpoint" ref = "point"></div>
</div>
<script>
this.value = Number(opts.value) || 0
this.max = Number(opts.max) || 100
if(opts.dragable != undefined)
this.dragable = eval(opts.dragable)
else
this.dragable = true
this.onchanging = opts.onchanging
this.onchange = opts.onchange
//this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
var self = this
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
/*if(k == "value")
{
if(self.onchange) self.onchange(self.value)
if(self.onchanging) self.onchanging(self.value)
}*/
self.update()
}
self.root.get = function(k)
{
return self[k]
}
var calibrate = function() {
if(self.value > self.max) self.value = self.max
$(self.refs.container).css("width", $(self.root).width() + "px")
var w = $(self.refs.container).width()*self.value/ self.max
$(self.refs.prg).css("width", w + "px").css("height", $(self.refs.container).height()+"px")
if(self.dragable)
{
var ow = w - $(self.refs.point).width()/2
var top = Math.floor(($(self.refs.prg).height() - $(self.refs.point).height())/2)
$(self.refs.point).css("left", ow + "px").css("top", top + "px")
}
}
self.on("update", function(){
calibrate()
})
var enable_dragging = function()
{
$(self.refs.point)
.css("user-select","none")
.css("cursor","default")
$(self.refs.point).on("mousedown", function(e){
e.preventDefault()
offset = $(self.refs.container).offset()
$(window).on("mousemove", function(e){
var left
left = e.clientX - offset.left
left = left < 0?0:left
var maxw = $(self.refs.container).width();
left = left > maxw?maxw : left
self.value = left*self.max/maxw
calibrate()
if(self.onchanging) self.onchanging(self.value)
})
$(window).on("mouseup", function(e){
if(self.onchange) self.onchange(self.value)
$(window).unbind("mousemove", null)
$(window).unbind("mouseup", null)
})
})
}
self.on("mount", function(){
self.root.observable = opts.observable || (self.parent && self.parent.root && self.parent.root.observable) || riot.observable()
if(self.dragable)
{
$(self.refs.point).css("position", "absolute")
$(self.refs.point).hide()
$(self.root).mouseover(function(){
$(self.refs.point).show()
}).mouseout(function(){
$(self.refs.point).hide()
})
enable_dragging()
}
$(self.refs.container).click( function(e){
var offset = $(self.refs.container).offset()
var left = e.clientX - offset.left
var maxw = $(self.refs.container).width()
self.value = left*self.max/maxw
calibrate()
if(self.onchange) self.onchange(self.value)
if(self.onchanging) self.onchanging(self.value)
})
self.root.observable.on("calibrate",function(){
calibrate()
})
self.root.observable.on("resize", function(){
calibrate()
})
calibrate()
})
</script>
</afx-slider>

56
src/core/tags/afx-switch.tag
View File

@ -1,56 +0,0 @@
<afx-switch>
<span class = {swon: swon} onclick = {toggle}></span>
<script>
if(opts.swon != undefined)
this.swon = opts.swon
else
this.swon = false
var self = this
//this.root.observable = opts.observable
if(opts.enable != undefined)
this.enable = opts.enable
else
this.enable = true
this.onchange = opts.onchange
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
opts[i] = v[i]
else
opts[k] = v
self.update()
}
self.root.get = function(k)
{
return self[k]
}
this.root.toggle = function()
{
opts.swon = !self.swon
self.update()
}
/*this.on("mount", function(){
})*/
this.on("update", function(e){
self.swon = typeof opts.swon == "function"?opts.swon():opts.swon
})
toggle(e)
{
if(!self.enable) return
opts.swon = !self.swon
self.swon = opts.swon
var data = {
id: self.rid,
data: opts.swon
}
if(opts.onchange)
opts.onchange(data)
if(self.root.observable)
self.root.observable.trigger("switch", data)
}
</script>
</afx-switch>

54
src/core/tags/afx-sys-panel.tag
View File

@ -1,54 +0,0 @@
<afx-sys-panel>
<div>
<afx-menu data-id = "os_menu" ref = "aOsmenu" child={osmenu.child} onmenuselect = {osmenu.onmenuselect} class="afx-panel-os-menu"></afx-menu>
<afx-menu data-id = "appmenu" ref = "aAppmenu" child={appmenu.child} class = "afx-panel-os-app"></afx-menu>
<afx-menu data-id = "sys_tray" ref = "aTray" child={systray.child} onmenuselect = {systray.onmenuselect} class = "afx-panel-os-stray"></afx-menu>
</div>
<script>
this.osmenu = { child: [] }
this.appmenu = { child: [] }
this.systray = {
child: [],
onmenuselect: function(d){
if(d.root)
d.e.item.data.awake(d.e)
}
}
var self = this
self.root.attachservice = function(s)
{
self.refs.aTray.root.unshift(s,true)
s.attach(self.refs.aTray)
}
self.root.detachservice = function(s)
{
self.refs.aTray.root.remove(s, true)
}
self.root.set = function(k,v)
{
if(k == "*")
for(var i in v)
self[i] = v[i]
else
self[k] = v
self.update()
}
self.root.get = function(k)
{
return self[k]
}
self.root.update = function()
{
self.update()
}
this.on('mount', function() {
//console.log(self.refs.aOsmenu.root)
$(self.refs.aOsmenu.root).css("z-index",1000000)
$(self.refs.aAppmenu.root).css("z-index",1000000)
$(self.refs.aTray.root).css("z-index",1000000)
window.OS.announcer.trigger("syspanelloaded")
})
</script>
</afx-sys-panel>

71
src/core/tags/afx-tab-bar.tag
View File

@ -1,71 +0,0 @@
<afx-tab-bar>
<afx-list-view ref = "list" />
<script>
var self = this
this.closable = opts.closable || false
self.ontabselect = opts.ontabselect
self.root.get = function (k) {
return self.refs.list.root.get(k)
}
self.root.update = function(){
self.update(true)
}
self.on("mount", function(){
self.root.observable = opts.observable || (self.parent && self.parent.root && self.parent.root.observable) || riot.observable()
self.refs.list.root.observable = self.root.observable
/*self.root.observable.on("listselect", function(){
console.log("list select")
})*/
self.refs.list.root.set ("onlistselect",function (e) {
//console.log("tab is seleced")
self.root.observable.trigger("tabselect", e)
if(self.ontabselect)
self.ontabselect(e)
})
})
self.root.set = function (k,v){
if( k == "*")
for(var i in v)
self.refs.list.root.set(i,v[i])
else if(k == "closable")
{
self.closable = v
}
else if(k == "ontabselect")
self.ontabselect = v
else
{
if(k == "items")
{
for(var i in v)
v[i].closable = self.closable
}
self.refs.list.root.set(k,v)
}
//self.update()
}
self.root.push = function(e,u)
{
e.closable = self.closable
self.refs.list.root.push(e,u)
}
self.root.replaceItem = function(o,n,u)
{
n.closable = self.closable
self.refs.list.root.replaceItem(o,n,u)
}
self.root.unshift = function(e,u)
{
self.refs.list.root.unshift(e,u)
}
self.root.remove = function(e,u)
{
self.refs.list.root.remove(e,u)
}
</script>
</afx-tab-bar>

91
src/core/tags/afx-tab-container.tag
View File

@ -1,91 +0,0 @@
<afx-tab-container>
<afx-hbox ref = "mybox" if = {bar == "left"}>
<afx-tab-bar data-ref="tabbar" ></afx-tab-bar>
<div data-ref="container"></div>
</afx-hbox>
<afx-vbox ref = "mybox" if = { bar == "top"}>
<afx-tab-bar data-ref="tabbar" ></afx-tab-bar>
<div data-ref="container"></div>
</afx-vbox>
<script>
this.bar = opts.bar || "top"
this.barwidth = opts.barwidth
this.barheight = opts.barheight
var schemes = []
var self = this
var calibrate = function()
{
$(self.refs.mybox.root).css("width", $(self.root).width()+"px")
$(self.refs.mybox.root).css("height", $(self.root).height()+"px")
self.root.observable.trigger("calibrate")
}
self.on("mount", function () {
self.tabbar = $("[data-ref='tabbar']", self.root)[0]
self.container = $("[data-ref='container']", self.root)[0]
if(self.barwidth)
$(self.tabbar).attr("data-width", self.barwidth)
if(self.barheight)
$(self.tabbar).attr("data-height", self.barheight)
self.root.observable = (self.parent && self.parent.root && self.parent.root.observable) || opts.observable || riot.observable()
self.tabbar.set("ontabselect", function(e){
$(self.container).children().each(function(el){
$(this).hide()
})
$(e.data.scheme).show()
e.data.handler.render()
calibrate()
})
self.root.observable.on("resize", function(){
calibrate()
})
})
self.on("update", function(){
$(self.container).children().each(function(e){
if(this.update) this.update()
})
})
var render = function(el)
{
var sch = $.parseHTML(el.scheme)
$(self.container).append(sch)
el.scheme = sch
riot.mount(sch, {observable: self.root.observable})
$(sch).hide()
el.handler = el.handler(sch[0])
//console.log(el.handler)
//el.handler.render()
self.root.observable.trigger("tabrendered")
//self.root.observable.trigger("calibrate")
}
var addTab = function(el)
{
if(!el.f)
el.f = (function(){})
self.tabbar.push(el)
if(el.url)
{
el.url.asFileHandle().read(function(d){
el.scheme = d
render(el)
})
}
else
{
render(el)
}
}
self.root.setTabs = function(arr)
{
if(arr.length <= 0)
{
self.tabbar.set("selected", 0)
return
}
self.root.observable.one("tabrendered", function(){
arr.splice(0,1)
self.root.setTabs(arr)
})
addTab(arr[0])
}
</script>
</afx-tab-container>

169
src/core/tags/afx-tree-view.tag
View File

@ -1,169 +0,0 @@
<afx-tree-view>
<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() && 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>
{ data.name }
</li>
</ul>
</div>
<ul if={ isFolder() } show={ isFolder() && open }>
<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.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.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 || 0
var istoggle = false
if(opts.treeroot)
{
this.treeroot = opts.treeroot
this.treeroot.counter++
}
else
{
this.treeroot = self
this.treeroot.counter = 0
}
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]
}
if(opts.observable)
this.root.observable = opts.observable
else
{
this.root.observable = riot.observable()
}
this.on("mount", function(){
$(self.refs.padding)
.css("display", "inline-block")
.css("height","1px")
.css("padding",0)
.css("margin", 0)
.css("background-color","transparent")
.css("width", self.indent*15 + "px" )
})
isFolder() {
return self.data.nodes //&& self.nodes.length
}
toggle(e) {
self.open = !self.open
e.preventDefault()
istoggle = true
if(self.open && self.data.nodes.length == 0 && self.fetch)
{
self.fetch(e.item, function(d){
self.data.nodes = d
self.update()
})
}
}
select(event)
{
if(istoggle)
{
istoggle = false
return
}
/*var data = {
id:self.rid,
data:event.item,
path:self.data.path
} */
if(self.ontreeselect)
self.ontreeselect(self.data)
self.treeroot.selectedItem = self.data
this.root.observable.trigger('treeselect',self.data)
event.preventUpdate = true
self.treeroot.update()
event.preventDefault()
}
_dbclick(event)
{
if(istoggle)
{
istoggle = false
return
}
/*data = {
id:self.rid,
data:event.item,
path: self.data.path}*/
if(self.ontreedbclick)
{
self.ontreedbclick(self.data)
}
self.root.observable.trigger('treedbclick', self.data)
}
</script>
</afx-tree-view>

81
src/core/tags/afx-vbox.tag
View File

@ -1,81 +0,0 @@
<afx-vbox style = "display:block;">
<div ref = "container" class="afx-vbox-container">
<yield/>
</div>
<script>
var self = this
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
this.on('mount', function(){
self.root.observable = (self.parent && self.parent.root && self.parent.root.observable) || opts.observable || riot.observable()
$(self.refs.container)
.css("display","flex")
.css("flex-direction","column")
.css("width","100%")
//.css("background-color","red")
//.css("overflow", "hidden")
calibrate_size()
if(self.root.observable)
{
self.root.observable.on("resize", function(w,h){
calibrate_size()
})
self.root.observable.on("calibrate", function(){
calibrate_size()
})
}
})
self.root.update = function()
{
self.update()
}
var calibrate_size = function()
{
var auto_height = []
var csize, ocheight = 0, avaiheight;
avaiheight = $(self.root).height()
avaiwidth = $(self.root).width()
/*if(avaiheight == 0)
{
avaiheight = $(self.parent.root).height()
$(self.root).css("height", avaiheight+"px")
}
if(avaiwidth == 0)
{
avaiwidth = $(self.parent.root).width()
$(self.root).css("height", avaiwidth+"px")
}*/
$(self.refs.container).css("height",avaiheight + "px")
$(self.refs.container)
.children()
.each(function(e)
{
this.observable = self.root.observable
//.css("border","1px solid black")
var dw = $(this).attr("data-height")
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)
}
else
{
$(this).css("flex-grow","1")
auto_height.push(this)
}
})
csize = (avaiheight - ocheight)/ (auto_height.length)
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})
}
</script>
</afx-vbox>

4
src/core/vfs.coffee
View File

@ -5,7 +5,7 @@
# This program is free software: you can redistribute it and/or
# modify it under the terms of the GNU General Public License as
# published by the Free Software Foundation, either version 3 of
# published by the Free Software Foundation, either version 3 of
# the License, or (at your option) any later version.
# This program is distributed in the hope that it will be useful,
@ -80,7 +80,7 @@ class BaseFileHandle
return resolve "" unless @cache
if t is "object" or typeof @cache is "string"
if t is "object"
b64 = (JSON.stringify @cache).asBase64()
b64 = JSON.stringify(@cache, undefined, 4).asBase64()
else
b64 = @cache.asBase64()
b64 = "data:#{m};base64,#{b64}"