mirror of
https://github.com/lxsang/antos-frontend.git
synced 2024-07-01 11:09:49 +02:00
add calendar view & stuff
This commit is contained in:
Xuan Sang LE
parent
1a054dbc9c
commit
c4fe3ba415
32
Makefile
32
Makefile
|
|
@ -13,34 +13,8 @@ coffees= src/core/core.coffee\
|
|||
src/core/BaseService.coffee\
|
||||
src/core/BaseEvent.coffee\
|
||||
src/antos.coffee
|
||||
|
||||
|
||||
tags= src/core/tags/afx-button.js\
|
||||
src/core/tags/afx-menu.js\
|
||||
src/core/tags/afx-sys-panel.js\
|
||||
src/core/tags/afx-apps-dock.js\
|
||||
src/core/tags/afx-app-window.js\
|
||||
src/core/tags/afx-vbox.js\
|
||||
src/core/tags/afx-hbox.js\
|
||||
src/core/tags/afx-list-view.js\
|
||||
src/core/tags/afx-tree-view.js \
|
||||
src/core/tags/afx-overlay.js\
|
||||
src/core/tags/afx-dummy.js\
|
||||
src/core/tags/afx-feed.js\
|
||||
src/core/tags/afx-grid-view.js
|
||||
|
||||
antos_themes = src/themes/antos/font-awesome.css\
|
||||
src/themes/antos/ubuntu-regular.css\
|
||||
src/themes/antos/hermit-light.css\
|
||||
src/themes/antos/antos.css\
|
||||
src/themes/antos/afx-button.css\
|
||||
src/themes/antos/afx-menu.css\
|
||||
src/themes/antos/afx-sys-panel.css\
|
||||
src/themes/antos/afx-dock.css\
|
||||
src/themes/antos/afx-list-view.css\
|
||||
src/themes/antos/afx-tree-view.css\
|
||||
src/themes/antos/afx-grid-view.css\
|
||||
src/themes/antos/afx-feed.css\
|
||||
src/themes/antos/afx-app-window.css
|
||||
|
||||
|
||||
|
||||
|
|
@ -76,7 +50,7 @@ build_tags:
|
|||
@echo "=======$(BLUE)Building tag files=======$(NC)"
|
||||
-mkdir $(BUILDDIR)/resources
|
||||
-rm $(BUILDDIR)/resources/antos_tags.js
|
||||
for f in $(tags); do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/antos_tags.js; done
|
||||
for f in src/core/tags/*; do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/antos_tags.js; done
|
||||
|
||||
build_themes: antos_themes_build
|
||||
|
||||
|
|
@ -85,7 +59,7 @@ antos_themes_build:
|
|||
@echo "=======$(BLUE)Building themes name: antos=======$(NC)"
|
||||
-rm -rf $(BUILDDIR)/resources/themes/antos/*
|
||||
-mkdir -p $(BUILDDIR)/resources/themes/antos
|
||||
for f in $(antos_themes); do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/themes/antos/antos.css; done
|
||||
for f in src/themes/antos/*.css; do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/themes/antos/antos.css;done
|
||||
-mkdir -p $(BUILDDIR)/resources/themes/antos/fonts
|
||||
cp -rf src/themes/antos/fonts/* $(BUILDDIR)/resources/themes/antos/fonts
|
||||
cp src/themes/antos/wallpaper.jpg $(BUILDDIR)/resources/themes/antos/
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ class BaseApplication extends this.OS.GUI.BaseModel
|
|||
if not evt.prevent
|
||||
@.appmenu.set "items", [] if @.pid == @.appmenu.pid
|
||||
($ @scheme).remove()
|
||||
|
||||
meta: () -> _APP[@name].meta
|
||||
baseMenu: ->
|
||||
mn =
|
||||
[{
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ _GUI = self.OS.GUI
|
|||
class BaseModel
|
||||
constructor: (@name) ->
|
||||
@observable = riot.observable()
|
||||
@pid = 0
|
||||
@_api = self.OS.API
|
||||
me = @
|
||||
@on "exit", () -> me.quit()
|
||||
|
|
@ -31,16 +30,20 @@ class BaseModel
|
|||
trigger: (e, d) -> @observable.trigger e, d
|
||||
|
||||
subscribe: (e, f) -> _MAIL.on e, f, @
|
||||
meta: () -> _APP[@name].meta
|
||||
|
||||
publish: (t, m) ->
|
||||
mt = @meta()
|
||||
_MAIL.trigger t, { id: @pid, name: @name, data: { m: m, icon: mt.icon, iconclass: mt.iconclass } }
|
||||
|
||||
notify: (m) ->
|
||||
@publish "notification", m
|
||||
|
||||
warn: (m) ->
|
||||
@publish "warning", m
|
||||
|
||||
error: (m) ->
|
||||
@publish "error", m
|
||||
|
||||
fail: (m) ->
|
||||
@publish "fail", m
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<afx-dummy>
|
||||
<afx-overlay data-id = "notifyzone" width = "250">
|
||||
<afx-button text = "Clear all" data-id = "btclear"></afx-button>
|
||||
<afx-list-view data-id="notifylist"></afx-list-view>
|
||||
<style>
|
||||
afx-overlay[data-id = "notifyzone"]{
|
||||
|
|
@ -10,6 +11,13 @@
|
|||
padding:3px;
|
||||
margin: 0;
|
||||
}
|
||||
afx-overlay[data-id = "notifyzone"] afx-button button{
|
||||
width: 250px;
|
||||
background-color: rgba(215,215,215,0.9);
|
||||
}
|
||||
afx-overlay[data-id = "notifyzone"] afx-button button:active{
|
||||
color:#414339;
|
||||
}
|
||||
afx-list-view[data-id = "notifylist"]
|
||||
{
|
||||
padding:0;
|
||||
|
|
@ -21,7 +29,7 @@
|
|||
}
|
||||
</style>
|
||||
</afx-overlay>
|
||||
<afx-feed data-id = "notifeed" style = "display: none;" closable="true">
|
||||
<afx-feed data-id = "notifeed" style = "display: none;">
|
||||
<!--afx-button text = "click me"></afx-button-->
|
||||
<style>
|
||||
afx-feed[data-id = "notifeed"]{
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
this.icon = opts.icon
|
||||
this.iconclass = opts.iconclass
|
||||
var self = this
|
||||
|
||||
this.onbtclick = opts.onbtclick
|
||||
self.root.set = function(k,v)
|
||||
{
|
||||
if(k == "*")
|
||||
|
|
@ -25,10 +25,10 @@
|
|||
}
|
||||
this._onbtclick = function(e)
|
||||
{
|
||||
if(typeof opts.onbtclick == 'string')
|
||||
eval(opts.onbtclick())
|
||||
else if(opts.onbtclick)
|
||||
opts.onbtclick()
|
||||
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})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<afx-feed>
|
||||
<div>
|
||||
<div each = {items}>
|
||||
<p>
|
||||
<i if={iconclass} class = {iconclass} ></i>
|
||||
<i if={icon} class="icon-style" style = { "background: url("+icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
|
||||
|
|
@ -13,11 +13,7 @@
|
|||
</div>
|
||||
<script>
|
||||
var self = this
|
||||
this.icon = opts.icon
|
||||
this.iconclass = opts.iconclass
|
||||
this.closable = opts.closable
|
||||
this.header = opts.header||""
|
||||
this.text = opts.text || ""
|
||||
self.items = opts.items || []
|
||||
self.root.set = function(k,v)
|
||||
{
|
||||
if(k == "*")
|
||||
|
|
@ -27,6 +23,24 @@
|
|||
self[k] = v
|
||||
self.update()
|
||||
}
|
||||
self.root.push = function(i,u)
|
||||
{
|
||||
self.items.push(i)
|
||||
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.unshift = function(i,u)
|
||||
{
|
||||
self.items.unshift(i)
|
||||
if(u) self.update()
|
||||
}
|
||||
self.root.get = function(k)
|
||||
{
|
||||
return self[k]
|
||||
|
|
|
|||
|
|
@ -6,14 +6,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<script>
|
||||
this.rows= []
|
||||
if(opts.data)
|
||||
{
|
||||
this.header = opts.data.header
|
||||
this.rows = opts.data.data
|
||||
}
|
||||
this.header = opts.header
|
||||
this.rows = opts.rows || []
|
||||
var self = this
|
||||
this.rid = $(self.root).attr("data-id")
|
||||
this.rid = $(self.root).attr("data-id") || Math.floor(Math.random() * 100000) + 1
|
||||
self.selidx = -1
|
||||
self.nrow = 0
|
||||
self.root.set = function(k,v)
|
||||
|
|
@ -27,7 +23,7 @@
|
|||
self[k] = v
|
||||
self.update()
|
||||
}
|
||||
var calibrate_size = function()
|
||||
this.calibrate_size = function()
|
||||
{
|
||||
if(self.header)
|
||||
{
|
||||
|
|
@ -58,10 +54,10 @@
|
|||
.css("display","flex")
|
||||
.css("flex-direction","column")
|
||||
.css("width","100%")
|
||||
calibrate_size()
|
||||
self.calibrate_size()
|
||||
|
||||
this.root.observable.on("resize",function(){
|
||||
calibrate_size()
|
||||
self.calibrate_size()
|
||||
if(self.refs.gridhead)
|
||||
self.refs.gridhead.calibrate_size()
|
||||
})
|
||||
|
|
@ -71,7 +67,7 @@
|
|||
self.selidx = -1
|
||||
if(self.nrow == self.rows.length) return
|
||||
self.nrow = self.rows.length
|
||||
calibrate_size()
|
||||
self.calibrate_size()
|
||||
if(self.refs.gridhead)
|
||||
self.refs.gridhead.calibrate_size()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,14 +1,13 @@
|
|||
<afx-list-view class = {dropdown: opts.dropdown == "true"}>
|
||||
<div class = "list-container" ref = "container">
|
||||
<div if = {opts.dropdown == "true"} ref = "current" style = {opts.width?"min-width:" + opts.width + "px;":"min-width:150px;"} onclick = {show_list}>
|
||||
{selectedText}
|
||||
</div>
|
||||
<ul ref = "mlist">
|
||||
<li each={ items } class={selected: selected} onclick = {parent._select}>
|
||||
<i if={iconclass} class = {iconclass} ></i>
|
||||
<i if={icon} class="icon-style" style = { "background: url("+icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
|
||||
{ text }
|
||||
<i if = {closable} class = "closable" click = {parent._remove}></i>
|
||||
<li each={item,i in items } class={selected: parent._autoselect(item,i)} onclick = {parent._select}>
|
||||
<i if={item.iconclass} class = {item.iconclass} ></i>
|
||||
<i if={item.icon} class="icon-style" style = { "background: url("+item.icon+");background-size: 100% 100%;background-repeat: no-repeat;" }></i>
|
||||
{ item.text }
|
||||
<i if = {item.closable} class = "closable" click = {parent._remove}></i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -16,12 +15,16 @@
|
|||
this.items = opts.child || []
|
||||
var self = this
|
||||
self.selidx = -1
|
||||
self.selectedText = ""
|
||||
self.onlistselect = opts.onlistselect
|
||||
var onclose = false
|
||||
self.root.set = function(k,v)
|
||||
{
|
||||
if(k == "selected")
|
||||
self._select({item:self.items[v], preventDefault:function(){}})
|
||||
{
|
||||
if(self.selidx != -1)
|
||||
self.items[self.selidx].selected =false
|
||||
self.items[v].selected = true
|
||||
}
|
||||
else if(k == "*")
|
||||
for(var i in v)
|
||||
self[i] = v[i]
|
||||
|
|
@ -71,7 +74,7 @@
|
|||
.css("left","0")
|
||||
}
|
||||
})
|
||||
show_list()
|
||||
show_list(event)
|
||||
{
|
||||
var desktoph = $("#desktop").height()
|
||||
var off = $(self.root).offset().top + $(self.refs.mlist).height()
|
||||
|
|
@ -81,6 +84,8 @@
|
|||
else
|
||||
$(self.refs.mlist).css("top","100%")
|
||||
$(self.refs.mlist).show()
|
||||
//event.preventDefault()
|
||||
event.preventUpdate = true
|
||||
}
|
||||
_remove(event)
|
||||
{
|
||||
|
|
@ -90,20 +95,48 @@
|
|||
self.selidx = -1
|
||||
}
|
||||
self.items.splice(self.items.indexOf(event.item),1)
|
||||
event.target = self.root
|
||||
self.update()
|
||||
onclose = true
|
||||
}
|
||||
_autoselect(it,i)
|
||||
{
|
||||
if(!it.selected || it.selected == false) return false
|
||||
var data = {
|
||||
id:$(self.root).attr("data-id"),
|
||||
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.current).html(it.text)
|
||||
}
|
||||
if(self.onlistselect)
|
||||
self.onlistselect(data)
|
||||
this.root.observable.trigger('listselect',data)
|
||||
return true
|
||||
}
|
||||
_select(event)
|
||||
{
|
||||
var data = {
|
||||
id:$(self.root).attr("data-id"),
|
||||
data:event.item,
|
||||
idx:self.items.indexOf(event.item)}
|
||||
if(onclose)
|
||||
{
|
||||
onclose = false
|
||||
event.preventUpdate = true
|
||||
return
|
||||
}
|
||||
if(self.selidx != -1)
|
||||
self.items[self.selidx].selected =false
|
||||
event.item.item.selected = true
|
||||
/*var data = {
|
||||
id:$(self.root).attr("data-id"),
|
||||
data:event.item.item,
|
||||
idx:event.item.i}
|
||||
|
||||
self.selidx = data.idx
|
||||
if(!self.items[self.selidx])
|
||||
return
|
||||
return
|
||||
|
||||
self.items[self.selidx].selected = true
|
||||
if(opts.dropdown == "true")
|
||||
|
|
@ -111,10 +144,10 @@
|
|||
$(self.refs.mlist).hide()
|
||||
self.selectedText = self.items[self.selidx].text
|
||||
}
|
||||
if(self.onlistselect)
|
||||
self.onlistselect(data)
|
||||
|
||||
this.root.observable.trigger('listselect',data)
|
||||
//event.preventDefault()
|
||||
//event.preventDefault()*/
|
||||
|
||||
}
|
||||
</script>
|
||||
</afx-list-view>
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
<script src="scripts/ace/ace.js"></script>
|
||||
<script src="scripts/ace/ext-language_tools.js"></script>
|
||||
<script src="scripts/ace/ext-modelist.js"></script>
|
||||
<script src="scripts/ace/ext-themelist.js"></script>
|
||||
<script src="scripts/antos.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,12 @@
|
|||
<afx-app-window apptitle="Preview" width="600" height="400">
|
||||
<afx-app-window apptitle="Preview" width="600" height="600">
|
||||
<afx-vbox>
|
||||
<afx-tree-view data-id="mytree"> </afx-tree-view>
|
||||
<afx-hbox>
|
||||
<afx-button data-height="50" text="Read more" iconclass="fa fa-camera-retro fa-lg" id="button">
|
||||
</afx-button>
|
||||
<afx-list-view data-id = "mylist" dropdown = "true" width="200"></afx-list-view>
|
||||
<div data-height="100" style=" vertical-align: top; width:100%;height:100%;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
|
||||
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
|
||||
<afx-calendar-view></afx-calendar-view>
|
||||
<afx-list-view data-id = "mylist" dropdown = "true" width="200" data-height = "50"></afx-list-view>
|
||||
|
||||
</afx-hbox>
|
||||
</afx-vbox>
|
||||
</afx-app-window>
|
||||
|
|
@ -8,8 +8,6 @@ class NotePad extends this.OS.GUI.BaseApplication
|
|||
div = @find "datarea"
|
||||
ace.require "ace/ext/language_tools"
|
||||
@.editor = ace.edit div
|
||||
@.editor.setTheme "ace/theme/monokai"
|
||||
@.editor.getSession().setMode 'ace/mode/text'
|
||||
@.editor.setOptions {
|
||||
enableBasicAutocompletion: true,
|
||||
enableSnippets: true,
|
||||
|
|
@ -22,22 +20,39 @@ class NotePad extends this.OS.GUI.BaseApplication
|
|||
list = @find "modelist"
|
||||
@modes = ace.require "ace/ext/modelist"
|
||||
ldata = []
|
||||
ldata.push {text:m.name, mode:m.mode} for m in @modes.modes
|
||||
list.set "items",ldata
|
||||
list.set "onlistselect", (e)->
|
||||
ldata.push {
|
||||
text: m.name,
|
||||
mode: m.mode,
|
||||
selected: if m.mode is 'ace/mode/text' then true else false
|
||||
} for m in @modes.modes
|
||||
list.set "items", ldata
|
||||
list.set "onlistselect", (e) ->
|
||||
me.editor.session.setMode e.data.mode
|
||||
|
||||
themelist = @find "themelist"
|
||||
themes = ace.require "ace/ext/themelist"
|
||||
ldata = []
|
||||
ldata.push {
|
||||
text: m.caption,
|
||||
mode: m.theme,
|
||||
selected: if m.theme is "ace/theme/monokai" then true else false
|
||||
} for k, m of themes.themesByName
|
||||
console.log themes.themesByName
|
||||
themelist.set "items", ldata
|
||||
themelist.set "onlistselect", (e) ->
|
||||
me.editor.setTheme e.data.mode
|
||||
|
||||
stat = @find "editorstat"
|
||||
#status
|
||||
stup = (e)->
|
||||
stup = (e) ->
|
||||
c = me.editor.session.selection.getCursor()
|
||||
l = me.editor.session.getLength()
|
||||
$(stat).html "Row #{c.row}, col #{c.column}, lines: #{l}"
|
||||
stup(0)
|
||||
@.editor.getSession().selection.on "changeCursor", (e)->stup(e)
|
||||
|
||||
@on "resize", ()-> me.editor.resize()
|
||||
@on "focus", ()->me.editor.focus()
|
||||
@on "resize", () -> me.editor.resize()
|
||||
@on "focus", () -> me.editor.focus()
|
||||
|
||||
menu: ()->
|
||||
menu = [{
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
afx-app-window[data-id="notepad"] afx-list-view[data-id="modelist"] {
|
||||
afx-app-window[data-id="notepad"] afx-list-view {
|
||||
margin: 2px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
afx-app-window[data-id="notepad"] afx-list-view[data-id="modelist"] div.list-container{
|
||||
afx-app-window[data-id="notepad"] afx-list-view div.list-container{
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@
|
|||
<div data-id="datarea"></div>
|
||||
<afx-vbox data-height="30" data-id="bottom-vbox">
|
||||
<div ><span data-id = "editorstat"></span></div>
|
||||
<afx-list-view data-width="170" data-id = "themelist" dropdown = "true" width="150"></afx-list-view>
|
||||
<afx-list-view data-width="170" data-id = "modelist" dropdown = "true" width="150"></afx-list-view>
|
||||
|
||||
</afx-vbox>
|
||||
|
|
|
|||
|
|
@ -13,8 +13,10 @@ class PushNotification extends this.OS.GUI.BaseService
|
|||
main: ->
|
||||
me = @
|
||||
mfeed = @find "notifeed"
|
||||
@scheme = @find "notifyzone"
|
||||
@nzone = @find "notifyzone"
|
||||
mlist = @find "notifylist"
|
||||
(@find "btclear").set "onbtclick", (e) -> mlist.set "items", []
|
||||
#mlist.set "onlistselect", (e) -> console.log e
|
||||
@subscribe "notification", (o) ->
|
||||
d = {
|
||||
header: "#{o.name} (#{o.id})"
|
||||
|
|
@ -37,7 +39,7 @@ class PushNotification extends this.OS.GUI.BaseService
|
|||
mlist.push d, true
|
||||
me.notifeed d, mfeed
|
||||
|
||||
($ @scheme).css "right", 0
|
||||
($ @nzone).css "right", 0
|
||||
.css "top", "-3px"
|
||||
.css "height", ""
|
||||
.css "bottom", "0"
|
||||
|
|
@ -46,22 +48,22 @@ class PushNotification extends this.OS.GUI.BaseService
|
|||
.css "top", "0"
|
||||
|
||||
notifeed: (d, mfeed) ->
|
||||
mfeed.set "*", d
|
||||
mfeed.push d, true
|
||||
($ mfeed).show()
|
||||
timer = setTimeout () ->
|
||||
($ mfeed).hide()
|
||||
clearTimeout timer
|
||||
mfeed.remove d, true
|
||||
clearTimeout timer
|
||||
, 3000
|
||||
|
||||
awake: (e) ->
|
||||
if @view then ($ @scheme).hide() else ($ @scheme).show()
|
||||
if @view then ($ @nzone).hide() else ($ @nzone).show()
|
||||
@view = not @view
|
||||
me = @
|
||||
if not @cb
|
||||
@cb = (e) ->
|
||||
return if e.originalEvent.item and e.originalEvent.item.closable
|
||||
if not ($ e.target).closest($ me.scheme).length and not ($ e.target).closest($ me.holder.root).length
|
||||
($ me.scheme).hide()
|
||||
if not ($ e.target).closest($ me.nzone).length and not ($ e.target).closest($ me.holder.root).length
|
||||
($ me.nzone).hide()
|
||||
$(document).unbind "click", me.cb
|
||||
me.view = not me.view
|
||||
if @view
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
afx-grid-view{
|
||||
overflow: hidden;
|
||||
padding:5px;
|
||||
display: block;
|
||||
}
|
||||
afx-grid-view afx-grid-row div{
|
||||
padding:3px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user