mirror of
https://github.com/lxsang/antos-frontend.git
synced 2025-07-19 15:29:51 +02:00
fix: use row/column as common directives for all UI horizontal/vertical direction
This commit is contained in:
@ -1267,7 +1267,7 @@ namespace OS {
|
||||
schemes.ws = `\
|
||||
<afx-sys-panel id = "syspanel"></afx-sys-panel>
|
||||
<div id = "workspace">
|
||||
<afx-desktop id = "desktop" dir="vertical" ></afx-desktop>
|
||||
<afx-desktop id = "desktop" dir="column" ></afx-desktop>
|
||||
<afx-notification id="sys_notification" ></afx-notification>
|
||||
</div>
|
||||
<afx-stack-menu id="contextmenu" data-id="contextmenu" context="true" style="display:none;"></afx-stack-menu>
|
||||
|
@ -169,7 +169,7 @@ namespace OS {
|
||||
.css("left", `${cleft}px`);
|
||||
const w = $(e).width();
|
||||
const h = $(e).height();
|
||||
if (this.dir === "vertical") {
|
||||
if (this.dir === "column") {
|
||||
ctop += h + 20;
|
||||
if (ctop + h > gh) {
|
||||
ctop = 20;
|
||||
|
@ -777,9 +777,9 @@ namespace OS {
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Getter: Get list direction: horizontal or vertical (default)
|
||||
* Getter: Get list direction: row or column (default)
|
||||
*
|
||||
* Setter: Get list direction: horizontal or vertical
|
||||
* Setter: Get list direction: row or column
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof ListViewTag
|
||||
@ -787,7 +787,7 @@ namespace OS {
|
||||
set dir(v: string) {
|
||||
if(this.dropdown)
|
||||
{
|
||||
$(this).attr("dir", "vertical");
|
||||
$(this).attr("dir", "column");
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -1357,7 +1357,7 @@ namespace OS {
|
||||
*/
|
||||
scroll_to_end()
|
||||
{
|
||||
if(this.dir == "vertical")
|
||||
if(this.dir == "column")
|
||||
{
|
||||
this.refs.mlist.scrollTo({ top: this.refs.mlist.scrollHeight, behavior: 'smooth' });
|
||||
}
|
||||
@ -1374,7 +1374,7 @@ namespace OS {
|
||||
*/
|
||||
scroll_to_start()
|
||||
{
|
||||
if(this.dir == "vertical")
|
||||
if(this.dir == "column")
|
||||
{
|
||||
this.refs.mlist.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
}
|
||||
|
@ -92,8 +92,8 @@ namespace OS {
|
||||
* Setter:
|
||||
*
|
||||
* Set resize direction, two possible values:
|
||||
* - `hz` - horizontal direction, resize by width
|
||||
* - `ve` - vertical direction, resize by height
|
||||
* - `row` - horizontal direction, resize by width
|
||||
* - `column` - vertical direction, resize by height
|
||||
*
|
||||
* Getter:
|
||||
*
|
||||
@ -105,18 +105,14 @@ namespace OS {
|
||||
let att: string;
|
||||
$(this).attr("dir", v);
|
||||
$(this).off("pointerdown", null);
|
||||
if (v === "hz") {
|
||||
$(this).css("cursor", "col-resize");
|
||||
$(this).addClass("horizontal");
|
||||
if (v === "row") {
|
||||
if (this._resizable_el) {
|
||||
att = $(this._resizable_el).attr("min-width");
|
||||
if (att) {
|
||||
this._minsize = parseInt(att);
|
||||
}
|
||||
}
|
||||
} else if (v === "ve") {
|
||||
$(this).css("cursor", "row-resize");
|
||||
$(this).addClass("vertical");
|
||||
} else if (v === "column") {
|
||||
if (this._resizable_el) {
|
||||
att = $(this._resizable_el).attr("min-height");
|
||||
if (att) {
|
||||
@ -192,11 +188,11 @@ namespace OS {
|
||||
return;
|
||||
}
|
||||
if (tagname === "AFX-HBOX") {
|
||||
this.dir = "hz";
|
||||
this.dir = "row";
|
||||
} else if (tagname === "AFX-VBOX") {
|
||||
this.dir = "ve";
|
||||
this.dir = "column";
|
||||
} else {
|
||||
this.dir = "hz";
|
||||
this.dir = "row";
|
||||
}
|
||||
}
|
||||
|
||||
@ -235,9 +231,9 @@ namespace OS {
|
||||
if (!this._resizable_el) {
|
||||
return;
|
||||
}
|
||||
if (this.dir === "hz") {
|
||||
if (this.dir === "row") {
|
||||
return this.horizontalResize(evt as JQuery.MouseEventBase);
|
||||
} else if (this.dir === "ve") {
|
||||
} else if (this.dir === "column") {
|
||||
return this.verticalResize(evt as JQuery.MouseEventBase);
|
||||
}
|
||||
});
|
||||
|
@ -64,7 +64,7 @@ namespace OS {
|
||||
*/
|
||||
protected init(): void {
|
||||
this.selected = -1;
|
||||
this.dir = "horizontal";
|
||||
this.dir = "row";
|
||||
this._previous_touch = {x: 0, y:0};
|
||||
}
|
||||
|
||||
@ -95,8 +95,8 @@ namespace OS {
|
||||
* Setter:
|
||||
*
|
||||
* Set the tab bar direction:
|
||||
* - `horizontal`: horizontal direction
|
||||
* - `vertical`: vertical direction
|
||||
* - `row`: horizontal direction
|
||||
* - `column`: vertical direction
|
||||
*
|
||||
* Getter:
|
||||
*
|
||||
@ -109,6 +109,7 @@ namespace OS {
|
||||
if (!v) {
|
||||
return;
|
||||
}
|
||||
console.log("direction is", v);
|
||||
(this.refs.list as ListViewTag).dir = v;
|
||||
}
|
||||
get dir(): string {
|
||||
@ -233,7 +234,7 @@ namespace OS {
|
||||
const offset = {x:0, y:0};
|
||||
offset.x = this._previous_touch.x - e.touches[0].pageX ;
|
||||
offset.y = this._previous_touch.y - e.touches[0].pageY;
|
||||
if(this.dir == "horizontal")
|
||||
if(this.dir == "row")
|
||||
{
|
||||
el.scrollLeft += offset.x;
|
||||
}
|
||||
@ -245,7 +246,7 @@ namespace OS {
|
||||
this._previous_touch.y = e.touches[0].pageY;
|
||||
}, {passive: true});
|
||||
el.addEventListener("wheel", (evt)=>{
|
||||
if(this.dir == "horizontal")
|
||||
if(this.dir == "row")
|
||||
{
|
||||
el.scrollLeft += (evt as WheelEvent).deltaY;
|
||||
}
|
||||
@ -265,7 +266,7 @@ namespace OS {
|
||||
scroll_to_end()
|
||||
{
|
||||
const list_container = $(".list-container", this.refs.list)[0];
|
||||
if(this.dir == "vertical")
|
||||
if(this.dir == "column")
|
||||
{
|
||||
list_container.scrollTo({ top: list_container.scrollHeight, behavior: 'smooth' });
|
||||
}
|
||||
@ -283,7 +284,7 @@ namespace OS {
|
||||
scroll_to_start()
|
||||
{
|
||||
const list_container = $(".list-container", this.refs.list)[0];
|
||||
if(this.dir == "vertical")
|
||||
if(this.dir == "column")
|
||||
{
|
||||
list_container.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
}
|
||||
|
@ -133,13 +133,13 @@ namespace OS {
|
||||
return;
|
||||
}
|
||||
(this.refs.wrapper as TileLayoutTag).dir = v;
|
||||
if(v === "row")
|
||||
if(v == "row")
|
||||
{
|
||||
(this.refs.bar as TabBarTag).dir = "vertical";
|
||||
(this.refs.bar as TabBarTag).dir = "column";
|
||||
}
|
||||
else
|
||||
{
|
||||
(this.refs.bar as TabBarTag).dir = "horizontal";
|
||||
(this.refs.bar as TabBarTag).dir = "row";
|
||||
}
|
||||
}
|
||||
get dir(): "row" | "column" {
|
||||
|
Reference in New Issue
Block a user