need fix header / remote

src/ui/ab.js

@@ -186,6 +186,7 @@ export class SessionList extends Element {
     ["on click at menu#remote-context li"](evt, me) {
         let action = me.id;
         let id = me.parentElement.getAttribute("remote-id");
+        if(!id) return
         console.log("click li",id);
         if (action == "connect") {
             createNewConnect(id, "connect");

src/ui/common.js

@@ -11,7 +11,8 @@ export const is_linux = OS == "Linux";
 
 view.mediaVar("is_osx", is_osx);
 view.mediaVar("not_osx", !is_osx);
-export var is_file_transfer;
+handler.is_port_forward = false;
+handler.is_file_transfer = false;
 export var is_xfce = false;
 try { is_xfce = handler.xcall("is_xfce"); } catch (e) { }
 
@@ -219,6 +220,7 @@ function getMsgboxParams() {
 
 // tmp workaround https://sciter.com/forums/topic/menu-not-be-hidden-when-open-dialog-on-linux/
 export function msgbox(type, title, text, callback = null, height = 180, width = 500, retry = 0, contentStyle = "") {
+    console.log("msgbox text:",text);
     if (is_linux) { // fix menu not hidden issue
         setTimeout(() => msgbox_(type, title, text, callback, height, width, retry, contentStyle), 1);
     } else {
@@ -255,14 +257,15 @@ function msgbox_(type, title, text, callback, height, width, retry, contentStyle
     if (type.indexOf("custom") >= 0) {
         //
     } else if (!res) {
-        if (!is_port_forward) view.close();
+        if (!handler.is_port_forward) view.close();
     } else if (res == "!alive") {
         // do nothing
     } else if (res.type == "input-password") {
+        if (!handler.is_port_forward) msgbox("connecting", "Connecting...", "Logging in...");
         handler.login(res.password, res.remember);
         if (!is_port_forward) msgbox("connecting", "Connecting...", "Logging in...");
     } else if (res.reconnect) {
-        if (!is_port_forward) connecting();
+        if (!handler.is_port_forward) connecting();
         handler.reconnect();
     }
 }

src/ui/header.js

@@ -1,6 +1,6 @@
-import { handler,view,is_file_transfer,setWindowButontsAndIcon,translate,msgbox,adjustBorder,is_osx,is_xfce,svg_chat,svg_checkmark, is_linux } from "./common.js";
+import { handler,view,setWindowButontsAndIcon,translate,msgbox,adjustBorder,is_osx,is_xfce,svg_chat,svg_checkmark, is_linux } from "./common.js";
 import {$,$$} from "@sciter";
-import { adaptDisplay,is_port_forward } from "./remote.js";
+import { adaptDisplay, audio_enabled, clipboard_enabled, keyboard_enabled } from "./remote.js";
 var pi = handler.xcall("get_default_pi"); // peer information
 
 var chat_msgs = [];
@@ -148,7 +148,7 @@ class Header extends Element {
                 <div class="separator" />
                 {keyboard_enabled ? <li id="lock-screen">{translate('Insert Lock')}</li> : ""}
                 {false && pi.platform == "Windows" ? <li id="block-input">Block user input </li> : ""}
-                {handler.support_refresh() ? <li id="refresh">{translate('Refresh')}</li> : ""}
+                {handler.xcall("support_refresh") ? <li id="refresh">{translate('Refresh')}</li> : ""}
             </menu>
         </popup>);
     }
@@ -299,10 +299,10 @@ function toggleMenuState() {
     let s = handler.xcall("get_view_style");
     if (!s) s = "original";
     values.push(s);
-    for (let el in $$("menu#display-options>li")) {
+    for (let el of $$("menu#display-options>li")) {
         el.classList.toggle("selected", values.indexOf(el.id) >= 0);
     }
-    for (let id in ["show-remote-cursor", "disable-audio", "disable-clipboard", "lock-after-session-end", "privacy-mode"]) {
+    for (let id of ["show-remote-cursor", "disable-audio", "disable-clipboard", "lock-after-session-end", "privacy-mode"]) {
         let el = $('#' + id); // TEST
         if (el) {
             el.classList.toggle("selected", handler.xcall("get_toggle_option",id));
@@ -314,7 +314,7 @@ if (is_osx) {
     $("header").content(<Header />);
     $("header").attributes["role"] = "window-caption"; // TODO 
 } else {
-    if (is_file_transfer || is_port_forward) {
+    if (handler.is_file_transfer || handler.is_port_forward) {
         $("caption").content(<Header />);
     } else {
         $("div.window-toolbar").content(<Header />);
@@ -322,7 +322,7 @@ if (is_osx) {
     setWindowButontsAndIcon();
 }
 
-if (!(is_file_transfer || is_port_forward)) {
+if (!(handler.is_file_transfer || handler.is_port_forward)) {
     $("header").style.setProperty("height","32px");
     if (!is_osx) {
         $("div.window-icon").style.setProperty("size","32px");
@@ -332,7 +332,7 @@ if (!(is_file_transfer || is_port_forward)) {
 handler.updatePi = function(v) {
     pi = v;
     header.componentUpdate();
-    if (is_port_forward) {
+    if (handler.is_port_forward) {
         view.state = Window.WINDOW_MINIMIZED;
     }
 }

src/ui/index.js

@@ -1,8 +1,10 @@
 import { is_osx,view,OS,handler,translate,msgbox,is_win,svg_checkmark,svg_edit,isReasonableSize,centerize,svg_eye } from "./common";
 import { SearchBar,SessionStyle,SessionList } from "./ab.js";
+import {$} from "@sciter"; //TEST $$ import
+
 if (is_osx) view.blurBehind = "light";
 console.log("current platform:", OS);
-
+console.log("wayland",handler.xcall("is_login_wayland"));
 // html min-width, min-height not working on mac, below works for all
 view.minSize = [500, 300]; // TODO not work on ubuntu
 
@@ -118,7 +120,7 @@ class AudioInputs extends Element {
         if (!this.show) return <li />;
         let inputs = handler.xcall("get_sound_inputs");
         if (is_win) inputs = ["System Sound"].concat(inputs);
-        if (!inputs.length) return null; // TODO TEST null element
+        if (!inputs.length) return <div/>;
         inputs = ["Mute"].concat(inputs);
         setTimeout(()=>this.toggleMenuState(),1);
         return (<li>{translate('Audio Input')}
@@ -187,6 +189,7 @@ class MyIdMenu extends Element {
 
     // TEST svg#menu  // .popup()
     ["on click at svg#menu"](_, me) {
+        console.log("open menu")
         audioInputMenu.componentUpdate({ show: true });
         this.toggleMenuState();
         let menu = this.$("menu#config-options");
@@ -194,9 +197,10 @@ class MyIdMenu extends Element {
     }
 
     toggleMenuState() {
-        for (let el in this.$$("menu#config-options>li")) {
+        for (let el of this.$$("menu#config-options>li")) {
             if (el.id && el.id.indexOf("enable-") == 0) {
                 let enabled = handler.xcall("get_option",el.id) != "N";
+                console.log(el.id,enabled)
                 el.classList.toggle("selected", enabled);
                 el.classList.toggle("line-through", !enabled);
             }
@@ -624,9 +628,10 @@ class Password extends Element {
         </div>);
     }
 
-    // TODO expecting element to popup
+    // TODO expecting element to popup 这里组件无法触发
     ["on click at svg#edit"](_,me) {
         let menu = this.$("menu#edit-password-context");
+        console.log("修改密码",me)
         me.popup(menu);
     }
 

src/ui/msgbox.js

@@ -13,7 +13,7 @@ function updateParams(params) {
     my_translate = params.translate;
     retry = params.retry;
     contentStyle = params.contentStyle;
-    console.log("params",type,title,text,getParams,remember,callback,my_translate,retry,contentStyle)
+
     try { text = translate_text(text); } catch (e) {}
     if (retry > 0) {
         setTimeout(()=>view.close({ reconnect: true }),retry * 1000);// TEST
@@ -101,12 +101,8 @@ class Body extends Element {
         let hasClose = type.indexOf("hasclose") >= 0;
         let show_progress = type == "connecting";
         this.style.setProperty("border",(color + " solid 1px"));
-        setTimeout(()=>{
+        console.log(content)
-            if (typeof content == "string")
+        setTimeout(()=>this.$("#content").content(my_translate(content)),1);
-                this.$("#content").html = my_translate(content);
-            else
-                this.$("#content").content(content);
-        },1);
         return (
         <div style="size: *">
             <header style={"height: 2em; background: " + color}>
@@ -158,7 +154,7 @@ class Body extends Element {
         }
         if (type == "re-input-password") {
             type = "input-password";
-            body.update();
+            body.componentUpdate();
             set_outline_focus();
             return;
         }
@@ -251,9 +247,9 @@ setInterval(function() {
     } else if (tmp != params) {
         params = tmp;
         updateParams(params);
-        body.update();
+        body.componentUpdate();
         set_outline_focus();
     }
 },30);
 
-$("body").content(<Body />);
+document.body.content(<Body />);

src/ui/port_forward.js

@@ -1,4 +1,4 @@
-import { translate } from "./common.js";
+import {  translate } from "./common.js";
 
 class PortForward extends Element {
     render() {

src/ui/remote.js

@@ -1,22 +1,23 @@
 import { $ } from "@sciter";
-import { handler,view,is_file_transfer,isReasonableSize,msgbox,is_osx, is_linux, centerize, connecting } from "./common.js";
+import { handler,view,isReasonableSize,msgbox,is_osx, is_linux, centerize, connecting } from "./common.js";
 import { initializeFileTransfer, save_file_transfer_close_state } from "./file_transfer.js";
 import { initializePortForward } from "./port_forward.js";
 import { header } from "./header.js";
 
+const body = document.body;
 var cursor_img = $("img#cursor");
 var last_key_time = 0;
-is_file_transfer = handler.xcall("is_file_transfer");
-export var is_port_forward = handler.xcall("is_port_forward");
 var display_width = 0;
 var display_height = 0;
 var display_origin_x = 0;
 var display_origin_y = 0;
 var display_scale = 1;
-var keyboard_enabled = true; // server side
+export var keyboard_enabled = true; // server side
-var clipboard_enabled = true; // server side
+export var clipboard_enabled = true; // server side
-var audio_enabled = true; // server side
+export var audio_enabled = true; // server side
-var scroll_body = $(body);
+
+handler.is_port_forward = handler.xcall("is_port_forward");
+handler.is_file_transfer = handler.xcall("is_file_transfer");
 
 handler.setDisplay = function(x, y, w, h) {
     display_width = w;
@@ -41,9 +42,8 @@ export function adaptDisplay() {
             el = $("li#adjust-window");
             el.style.setProperty("display","block");
             el.on("click",function() {
-                // TODO old:view.state == Window.WINDOW_SHOWN; 
                 view.state = Window.WINDOW_SHOWN;
-                let [x, y] = view.state.box("position", "border", "screen");
+                let [x, y] = body.state.box("position", "border", "screen"); // TEST
                 // extra for border
                 let extra = 2;
                 view.move(x, y, w + extra, h + hh + extra);
@@ -51,8 +51,8 @@ export function adaptDisplay() {
         }
     }
     if (style != "original") {
-        let bw = $("body").state.box("width", "border");
+        let bw = body.state.box("width", "border");
-        let bh = $("body").state.box("height", "border");
+        let bh = body.state.box("height", "border");
         if (view.state == Window.WINDOW_FULL_SCREEN) {
             bw = sw;
             bh = sh;
@@ -401,7 +401,7 @@ handler.setCursorPosition = function(x, y) {
 document.on("ready",()=> {
     let w = 960;
     let h = 640;
-    if (is_file_transfer || is_port_forward) {
+    if (handler.is_file_transfer || handler.is_port_forward) {
         let r = handler.xcall("get_size");
         if (isReasonableSize(r) && r[2] > 0) {
             view.move(r[0], r[1], r[2], r[3]);
@@ -411,9 +411,9 @@ document.on("ready",()=> {
     } else {
         centerize(w, h);
     }
-    if (!is_port_forward) connecting();
+    if (!handler.is_port_forward) connecting();
-    if (is_file_transfer) initializeFileTransfer();
+    if (handler.is_file_transfer) initializeFileTransfer();
-    if (is_port_forward) initializePortForward();
+    if (handler.is_port_forward) initializePortForward();
 })
 
 var workarea_offset = 0;
@@ -449,9 +449,10 @@ handler.adaptSize = function() {
 }
 
 document.on("unloadequest",()=> {
-    let [x, y, w, h] = view.state.box("rectw", "border", "screen");
+    let [x, y, w, h] = body.state.box("rectw", "border", "screen");
-    if (is_file_transfer) save_file_transfer_close_state();
+    console.log("remote.js unloadequest",x, y, w, h)
-    if (is_file_transfer || is_port_forward || size_adapted) handler.xcall("save_size",x, y, w, h);
+    if (handler.is_file_transfer) save_file_transfer_close_state();
+    if (handler.is_file_transfer || handler.is_port_forward || size_adapted) handler.xcall("save_size",x, y, w, h);
 })
 
 handler.setPermission = function(name, enabled) {
@@ -464,5 +465,6 @@ handler.setPermission = function(name, enabled) {
 // TODO
 handler.closeSuccess = function() {
     // handler.msgbox("success", "Successful", "Ready to go.");
+    console.log("remote.js handler.closeSuccess");
     handler.msgbox("", "", "");
 }