mirror of
https://github.com/lxsang/antos-frontend.git
synced 2024-12-27 01:38:21 +01:00
add appearance setting
This commit is contained in:
parent
8fef0c5e96
commit
07bb58b7eb
@ -217,7 +217,7 @@ self.OS.GUI =
|
||||
wp = _OS.setting.appearance.wp
|
||||
$("body").css("background-image", "url(#{_API.handler.get}/#{wp.url})" )
|
||||
.css("background-size", wp.size)
|
||||
.css("ackground-repeat", wp.repeat)
|
||||
.css("background-repeat", wp.repeat)
|
||||
|
||||
initDM: ->
|
||||
($ document).on 'webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange', ()->
|
||||
|
@ -3,7 +3,7 @@
|
||||
_OS.setting.applications = conf.applications if conf.applications
|
||||
_OS.setting.appearance = conf.appearance if conf.appearance
|
||||
_OS.setting.appearance.wp = {
|
||||
url: "os://resources/themes/system/wp/wp2.png",
|
||||
url: "os://resources/themes/system/wp/wp2.jpg",
|
||||
size: "cover",
|
||||
repeat: "repeat"
|
||||
} unless _OS.setting.appearance.wp
|
||||
|
@ -1,6 +1,6 @@
|
||||
<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}>
|
||||
<div if = {opts.dropdown == "true"} ref = "current" style = {opts.width?"min-width:" + opts.width + "px;":""} onclick = {show_list}>
|
||||
</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}>
|
||||
@ -113,8 +113,12 @@
|
||||
|
||||
this.on("mount", function(){
|
||||
self.root.observable = opts.observable || (self.parent && self.parent.root && self.parent.root.observable) || riot.observable()
|
||||
|
||||
if(opts.dropdown == "true")
|
||||
{
|
||||
self.root.observable.on("calibrate", function(){
|
||||
$(self.refs.container).css("width", $(self.root).width() + "px" )
|
||||
})
|
||||
$(document).click(function(event) {
|
||||
if(!$(event.target).closest(self.refs.container).length) {
|
||||
$(self.refs.mlist).hide()
|
||||
|
@ -32,7 +32,7 @@
|
||||
$(this).hide()
|
||||
})
|
||||
$(e.data.scheme).show()
|
||||
e.data.f()
|
||||
e.data.handler.render()
|
||||
calibrate()
|
||||
})
|
||||
self.root.observable.on("resize", function(){
|
||||
@ -46,7 +46,9 @@
|
||||
el.scheme = sch
|
||||
riot.mount(sch, {observable: self.root.observable})
|
||||
$(sch).hide()
|
||||
el.f()
|
||||
el.handler = el.handler(sch[0])
|
||||
//console.log(el.handler)
|
||||
//el.handler.render()
|
||||
self.root.observable.trigger("tabrendered")
|
||||
//self.root.observable.trigger("calibrate")
|
||||
}
|
||||
|
48
src/packages/Setting/AppearanceHandler.coffee
Normal file
48
src/packages/Setting/AppearanceHandler.coffee
Normal file
@ -0,0 +1,48 @@
|
||||
class AppearanceHandler extends SettingHandler
|
||||
constructor:(scheme, parent) ->
|
||||
super(scheme, parent)
|
||||
me = @
|
||||
@wplist = @find "wplist"
|
||||
@wpreview = @find "wp-preview"
|
||||
@wpsize = @find "wpsize"
|
||||
@wprepeat = @find "wprepeat"
|
||||
@themelist = @find "theme-list"
|
||||
@wpsize.set "onlistselect", (e)->
|
||||
me.parent.systemsetting.appearance.wp.size = e.data.text
|
||||
me.parent._gui.wallpaper()
|
||||
|
||||
sizes = [
|
||||
{ text: "cover", selected: me.parent.systemsetting.appearance.wp.size is "cover" },
|
||||
{ text: "auto", selected: me.parent.systemsetting.appearance.wp.size is "auto" },
|
||||
{ text: "contain", selected: me.parent.systemsetting.appearance.wp.size is "contain" }
|
||||
]
|
||||
@wpsize.set "items", sizes
|
||||
@wplist.set "onlistselect", (e) ->
|
||||
$(me.wpreview).css("background-image", "url(#{me.parent._api.handler.get}/#{e.data.path})" )
|
||||
.css("background-size", "cover")
|
||||
me.parent.systemsetting.appearance.wp.url = e.data.path
|
||||
me.parent._gui.wallpaper()
|
||||
|
||||
|
||||
repeats = [
|
||||
{ text: "repeat", selected: me.parent.systemsetting.appearance.wp.repeat is "repeat" },
|
||||
{ text: "repeat-x", selected: me.parent.systemsetting.appearance.wp.repeat is "repeat-x" },
|
||||
{ text: "repeat-y", selected: me.parent.systemsetting.appearance.wp.repeat is "repeat-y" },
|
||||
{ text: "no-repeat", selected: me.parent.systemsetting.appearance.wp.repeat is "no-repeat" }
|
||||
]
|
||||
@wprepeat.set "items", repeats
|
||||
@wprepeat.set "onlistselect", (e) ->
|
||||
me.parent.systemsetting.appearance.wp.repeat = e.data.text
|
||||
me.parent._gui.wallpaper()
|
||||
|
||||
@themelist.set "items" , [{ text: "antos", selected: true }]
|
||||
render: () ->
|
||||
me = @
|
||||
path = "os://resources/themes/system/wp"
|
||||
path.asFileHandler().read (d) ->
|
||||
me.parent.error __("Cannot read wallpaper list from {0}", path) if d.error
|
||||
for v in d.result
|
||||
v.text = v.filename
|
||||
v.selected = true if v.path is me.parent.systemsetting.appearance.wp.url
|
||||
v.iconclass = "fa fa-file-image-o"
|
||||
me.wplist.set "items", d.result
|
@ -1,4 +1,4 @@
|
||||
coffee_files = main.coffee
|
||||
coffee_files = main.coffee AppearanceHandler.coffee
|
||||
|
||||
jsfiles =
|
||||
|
||||
|
@ -1,3 +1,12 @@
|
||||
class SettingHandler
|
||||
constructor:(@scheme, @parent) ->
|
||||
|
||||
find: (id) -> ($ "[data-id='#{id}']", @scheme)[0] if @scheme
|
||||
|
||||
render: () ->
|
||||
|
||||
|
||||
|
||||
class Setting extends this.OS.GUI.BaseApplication
|
||||
constructor: (args) ->
|
||||
super "Setting", args
|
||||
@ -7,18 +16,21 @@ class Setting extends this.OS.GUI.BaseApplication
|
||||
@container = @find "container"
|
||||
@container.setTabs [
|
||||
{
|
||||
text: "Appearance",
|
||||
iconclass: "fa fa-paint-brush",
|
||||
url: "#{@path()}/schemes/appearance.html",
|
||||
f: () ->
|
||||
console.log "finish init appearance"
|
||||
text: "Appearance",
|
||||
iconclass: "fa fa-paint-brush",
|
||||
url: "#{@path()}/schemes/appearance.html",
|
||||
handler: (sch) ->
|
||||
me.appearance = new AppearanceHandler(sch, me)
|
||||
me.appearance
|
||||
},
|
||||
{
|
||||
text: "VFS",
|
||||
iconclass: "fa fa-inbox" ,
|
||||
url: "#{@path()}/schemes/vfs.html" ,
|
||||
f: () ->
|
||||
console.log "finish init VFS"
|
||||
handler: (sch) ->
|
||||
render: () ->
|
||||
console.log "finish init VFS"
|
||||
|
||||
}
|
||||
]
|
||||
Setting.singleton = true
|
||||
|
@ -8,4 +8,24 @@ afx-app-window[data-id = "setting-window"] afx-tab-container afx-tab-bar afx-lis
|
||||
}
|
||||
afx-app-window[data-id = "setting-window"] afx-tab-container div[data-ref="container"]{
|
||||
border-left: 1px solid #cbcbcb;
|
||||
}
|
||||
|
||||
afx-app-window[data-id = "setting-window"] afx-label.header{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*APPEARANCE*/
|
||||
afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] div[data-id = "wp-preview"]{
|
||||
display: block;
|
||||
border:1px solid #cbcbcb;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] afx-list-view[data-id="wplist"]
|
||||
{
|
||||
border:1px solid #cbcbcb;
|
||||
}
|
||||
afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] afx-resizer{
|
||||
border:0;
|
||||
background-color: transparent;
|
||||
}
|
@ -1,14 +1,31 @@
|
||||
<afx-vbox>
|
||||
<afx-label text = "__(Wallpaper)" class = "header" data-height="30"></afx-label>
|
||||
<afx-vbox data-id="appearance">
|
||||
<div data-height="5"></div>
|
||||
<afx-hbox>
|
||||
<afx-list-view data-width="120"></afx-list-view>
|
||||
<div>
|
||||
</div>
|
||||
<div data-width="10"></div>
|
||||
<afx-vbox>
|
||||
<afx-label text = "__(Wallpaper)" iconclass = "fa fa-image" class = "header" data-height="23"></afx-label>
|
||||
<afx-hbox>
|
||||
<afx-list-view data-width="120" data-id="wplist"></afx-list-view>
|
||||
<afx-resizer data-width="5"></afx-resizer>
|
||||
<div data-id = "wp-preview"></div>
|
||||
</afx-hbox>
|
||||
<div data-height="5"></div>
|
||||
<afx-hbox data-height="30">
|
||||
<afx-button data-width="130" text= "__(Add)"></afx-button>
|
||||
<afx-list-view data-id = "wpsize" dropdown="true"></afx-list-view>
|
||||
<div data-width="5"></div>
|
||||
<afx-list-view data-id = "wprepeat" dropdown="true"></afx-list-view>
|
||||
</afx-hbox>
|
||||
<div data-height="5"></div>
|
||||
<afx-label text = "__(Theme)" iconclass = "fa fa-window-restore" class = "header" data-height="23"></afx-label>
|
||||
<afx-list-view data-height="30" data-id="theme-list" dropdown="true"></afx-list-view>
|
||||
<div data-height="5"></div>
|
||||
</afx-vbox>
|
||||
<div data-width="10"></div>
|
||||
</afx-hbox>
|
||||
<afx-label text = "__(Theme)" class = "header" data-height="30"></afx-label>
|
||||
<afx-list-view data-height="50" dropdown="true"></afx-list-view>
|
||||
<afx-hbox data-height="30" >
|
||||
<div></div>
|
||||
<afx-button text="__(Save)" iconclass="fa fa-save" data-width="50"></afx-button>
|
||||
<div style="text-align:right;"><afx-button text="__(Save)" iconclass="fa fa-save"></afx-button></div>
|
||||
<div data-width="10"></div>
|
||||
</afx-hbox>
|
||||
<div data-height="5"></div>
|
||||
</afx-vbox>
|
@ -9,9 +9,11 @@ title:
|
||||
|
||||
coffee:
|
||||
- mkdir build
|
||||
for f in $(coffee_files); do (coffee -cs < $$f >build/"$$f.js");done
|
||||
for f in build/*.coffee.js; do (cat "$${f}"; echo) >> build/main.js; done
|
||||
- rm build/*.coffee.js
|
||||
for f in $(coffee_files); do (cat "$${f}"; echo) >>"build/main.coffee";done
|
||||
coffee --compile build/main.coffee
|
||||
#for f in $(coffee_files); do (coffee -cs < $$f >build/"$$f.js");done
|
||||
#for f in build/*.coffee.js; do (cat "$${f}"; echo) >> build/main.js; done
|
||||
- rm build/*.coffee
|
||||
|
||||
js: coffee
|
||||
for f in $(jsfiles); do (cat "$${f}"; echo) >> build/main.js; done
|
||||
|
@ -90,6 +90,7 @@ afx-list-view.dropdown > div.list-container > ul{
|
||||
border-radius: 3px;
|
||||
padding:2px;
|
||||
border-top-left-radius: 0px;
|
||||
z-index: 10;
|
||||
}
|
||||
afx-list-view.dropdown > div.list-container > ul > li{
|
||||
display: inline-block;
|
||||
|
@ -5,9 +5,6 @@ html,body{
|
||||
font-size: 13px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url(wp2.jpg);
|
||||
background-size: cover;
|
||||
background-repeat: repeat;
|
||||
overflow: hidden;
|
||||
}
|
||||
#wrapper{
|
||||
|
Loading…
Reference in New Issue
Block a user