mirror of
https://github.com/lxsang/antos-frontend.git
synced 2024-11-08 05:58:22 +01:00
fix bug and add afx-nspinner widget
This commit is contained in:
parent
7659438138
commit
aec5457a31
@ -1,13 +1,16 @@
|
||||
<afx-button>
|
||||
<button disabled={ enable == "false" } onclick="{ _onbtclick }" ref = "mybtn" >
|
||||
<afx-button class= { btactive: selected }>
|
||||
<button disabled={ enable == false } onclick="{ _onbtclick }" ref = "mybtn" >
|
||||
<afx-label color = {color} icon={icon} iconclass = {iconclass} text = {text} ></afx-label>
|
||||
</button>
|
||||
<script>
|
||||
this.enable = opts.enable
|
||||
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)
|
||||
@ -37,6 +40,8 @@
|
||||
{
|
||||
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>
|
75
src/core/tags/afx-nspinner.tag
Normal file
75
src/core/tags/afx-nspinner.tag
Normal file
@ -0,0 +1,75 @@
|
||||
<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.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 + 1;
|
||||
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() - 3 + "px" )
|
||||
$(self.refs.spinner).css("height", $(self.root).height() - 5 + "px" )
|
||||
}
|
||||
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 - 1;
|
||||
self.update();
|
||||
if(self.onchange) self.onchange(self.value);
|
||||
}
|
||||
|
||||
</script>
|
||||
</afx-nspinner>
|
@ -35,7 +35,7 @@ class BuildDialog extends this.OS.GUI.BasicDialog
|
||||
{
|
||||
text: "+",
|
||||
onbtclick: (e) ->
|
||||
d.selectFile ["text/coffeescript"], (f) ->
|
||||
d.selectFile ["text/.*coffeescript"], (f) ->
|
||||
lv.push { text: f }, true if f
|
||||
},
|
||||
{
|
||||
|
@ -262,7 +262,7 @@ class AntOSDK extends this.OS.GUI.BaseApplication
|
||||
{
|
||||
path: "#{rpath}/assets/scheme.html",
|
||||
content: """
|
||||
<afx-app-window apptitle="" width="600" height="500" data-id="#{n}">
|
||||
<afx-app-window apptitle="#{n}" width="600" height="500" data-id="#{n}">
|
||||
<afx-hbox ></afx-hbox>
|
||||
</afx-app-window>
|
||||
"""
|
||||
|
@ -6,7 +6,7 @@
|
||||
"author": "Xuan Sang LE",
|
||||
"email": "xsang.le@gmail.com"
|
||||
},
|
||||
"version":"0.0.3-a",
|
||||
"version":"0.0.4-a",
|
||||
"category":"System",
|
||||
"iconclass":"fa fa-cubes",
|
||||
"mimes":[
|
||||
|
@ -74,7 +74,7 @@ class DummyApp extends this.OS.GUI.BaseApplication
|
||||
(@find "sw").set "onchange", (e) ->
|
||||
console.log e, ((self.find "sw").get "swon")
|
||||
tree.set "data",tdata
|
||||
|
||||
(@find "spinner").set "onchange", (e) -> console.log e
|
||||
list = @find "mylist"
|
||||
ldata = [
|
||||
{text:"some thing with avery long text"},
|
||||
|
@ -9,7 +9,8 @@
|
||||
</afx-vbox>
|
||||
<afx-resizer data-width = "5" ></afx-resizer>
|
||||
<afx-vbox>
|
||||
<afx-button data-height="30" text="__(Read more)" iconclass="fa fa-camera-retro fa-lg" id="button"></afx-button>
|
||||
<afx-nspinner value = "10" data-height="30" data-id="spinner"></afx-nspinner>
|
||||
<afx-button data-height="30" toggle = "true" text="__(Read more)" iconclass="fa fa-camera-retro fa-lg" id="button"></afx-button>
|
||||
<afx-switch data-id="sw" enable= true data-height="30"></afx-switch>
|
||||
<afx-calendar-view></afx-calendar-view>
|
||||
<afx-resizer data-height = "5" ></afx-resizer>
|
||||
|
@ -18,7 +18,7 @@ afx-button i.icon-style {
|
||||
display: inline-block;
|
||||
float:left;
|
||||
}
|
||||
afx-button button:active {
|
||||
afx-button button:active, afx-button.btactive button {
|
||||
background-color: #2786F3;
|
||||
color: white;
|
||||
border: 1px solid #dedede;
|
||||
|
44
src/themes/antos/afx-nspinner.css
Normal file
44
src/themes/antos/afx-nspinner.css
Normal file
@ -0,0 +1,44 @@
|
||||
afx-nspinner{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
afx-nspinner ul{
|
||||
padding:0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
}
|
||||
afx-nspinner ul li{
|
||||
display: block;
|
||||
border: 1px solid #a6a6a6;
|
||||
width: 100%;
|
||||
padding:0;
|
||||
margin: 0;
|
||||
height:45%;
|
||||
border-radius: 3px;
|
||||
color: #414339;
|
||||
position: relative;
|
||||
}
|
||||
afx-nspinner ul li:hover{
|
||||
color:#116cD6;
|
||||
}
|
||||
afx-nspinner ul li i {
|
||||
display: block;
|
||||
}
|
||||
afx-nspinner ul li.incr i:before{
|
||||
content: "\f0d8";
|
||||
font-family: "FontAwesome";
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
position: absolute;
|
||||
top:-6px;
|
||||
left: 5px;
|
||||
}
|
||||
afx-nspinner ul li.decr i:before{
|
||||
content: "\f0d7";
|
||||
font-family: "FontAwesome";
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
position: absolute;
|
||||
bottom: -4px;
|
||||
left: 5px;
|
||||
}
|
Loading…
Reference in New Issue
Block a user