hongshaorou/rustdesk
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

too many issues

Browse Source
This commit is contained in:
open-trade 2022-01-06 18:48:10 +08:00
parent cf13957b45
commit e86d0a0fc1
6 changed files with 97 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
src/ui/ab.js
View File

@ -16,30 +16,22 @@ export function getSessionsStyle(type) {
return v; return v;
} }
// Fixed var searchPatterns = {};
// function stupidUpdate(me) {
// /* hidden is workaround of stupid sciter bug */
// me.hidden = true;
// me.componentUpdate();
// self.timer(60ms, function() {
// me.hidden = false;
// me.componentUpdate();
// });
// }
export class SearchBar extends Element { export class SearchBar extends Element {
parent;
value = "";
this(props) { this(props) {
this.parent = props.parent; this.type = (props || {}).type || "";
} }
render() { render() {
let value = searchPatterns[this.type] || "";
setTimeout(() => { this.$("input").value = value; }, 1);
return (<div class="search-id" > return (<div class="search-id" >
<span class=".search-icon">{search_icon}</span> <span class="search-icon">{search_icon}</span>
<input type="text" novalue={translate("Search ID")} /> <input type="text" novalue={translate("Search ID")} />
{this.value && <span class="clear-input">{clear_icon}</span>} {value && <span class="clear-input">{clear_icon}</span>}
</div>); </div>);
} }
@ -53,9 +45,8 @@ export class SearchBar extends Element {
} }
onChange(v) { onChange(v) {
this.value = v; searchPatterns[this.type] = v;
this.componentUpdate(); app.multipleSessions.update();
this.parent.filter(v);
} }
} }
@ -63,12 +54,12 @@ export class SessionStyle extends Element {
type = ""; type = "";
this(props) { this(props) {
this.type = (props || {}).type; this.type = (props || {}).type || "";
} }
render() { render() {
let sessionsStyle = getSessionsStyle(this.type); let sessionsStyle = getSessionsStyle(this.type);
return (<div class="sessions-style" > return (<div class="sessions-tab" style="margin-left: 0.5em;">
<span class={sessionsStyle == "tile" ? "active" : "inactive"}>{svg_tile}</span> <span class={sessionsStyle == "tile" ? "active" : "inactive"}>{svg_tile}</span>
<span class={sessionsStyle != "tile" ? "active" : "inactive"}>{svg_list}</span> <span class={sessionsStyle != "tile" ? "active" : "inactive"}>{svg_list}</span>
</div>); </div>);
@ -78,7 +69,6 @@ export class SessionStyle extends Element {
let option = getSessionsStyleOption(this.type); let option = getSessionsStyleOption(this.type);
let sessionsStyle = getSessionsStyle(this.type); let sessionsStyle = getSessionsStyle(this.type);
handler.xcall("set_option", option, sessionsStyle == "tile" ? "list" : "tile"); handler.xcall("set_option", option, sessionsStyle == "tile" ? "list" : "tile");
//stupidUpdate(app); // seems fixed in new sciter
app.componentUpdate(); app.componentUpdate();
} }
} }
@ -87,7 +77,7 @@ export class SessionList extends Element {
sessions = []; sessions = [];
type = ""; type = "";
style; style;
filterPattern = "";
this(props) { this(props) {
this.sessions = props.sessions; this.sessions = props.sessions;
@ -95,16 +85,11 @@ export class SessionList extends Element {
this.style = getSessionsStyle(props.type); this.style = getSessionsStyle(props.type);
} }
filter(v) {
this.filterPattern = v;
this.componentUpdate();
}
getSessions() { getSessions() {
let p = this.filterPattern; let p = searchPatterns[this.type];
if (!p) return this.sessions; if (!p) return this.sessions;
let tmp = []; let tmp = [];
this.sessions.map(function (s) { this.sessions.map( (s) => {
let name = s[4] || s.alias || s[0] || s.id || ""; let name = s[4] || s.alias || s[0] || s.id || "";
if (name.indexOf(p) >= 0) tmp.push(s); if (name.indexOf(p) >= 0) tmp.push(s);
}); });
@ -113,20 +98,22 @@ export class SessionList extends Element {
render() { render() {
let sessions = this.getSessions(); let sessions = this.getSessions();
if (sessions.length == 0) return <span />; if (sessions.length == 0) return <div style="margin: *; font-size: 1.6em;">{translate("Empty")}</div>;
sessions = sessions.map((x) => this.getSession(x)); sessions = sessions.map((x) => this.getSession(x));
// TODO is_win
// TODO <li id="rdp">RDP<EditRdpPort /></li>
return <div class="recent-sessions-content" key={sessions.length} > return <div class="recent-sessions-content" key={sessions.length} >
<popup> <popup>
<menu class="context" id="remote-context"> <menu class="context" id="remote-context">
<li id="connect">{translate('Connect')}</li> <li id="connect">{translate('Connect')}</li>
<li id="transfer">{translate('Transfer File')}</li> <li id="transfer">{translate('Transfer File')}</li>
<li id="tunnel">{translate('TCP Tunneling')}</li> <li id="tunnel">{translate('TCP Tunneling')}</li>
<li id="rdp">RDP</li>
<div class="separator" />
<li id="rename">{translate('Rename')}</li> <li id="rename">{translate('Rename')}</li>
<li id="remove">{translate('Remove')}</li> {this.type != "fav" && <li id="remove">{translate('Remove')}</li>}
{is_win && <li id="shortcut">{translate('Create Desktop Shortcut')}</li>} {is_win && <li di="shortcut">{translate('Create Desktop Shortcut')}</li>}
<li id="forget-password">{translate('Unremember Password')}</li>
{(!this.type || this.type == "fav") && <li id="add-fav">{translate('Add to Favorites')}</li>}
{(!this.type || this.type == "fav") && <li id="remove-fav">{translate('Remove from Favorites')}</li>}
</menu> </menu>
</popup> </popup>
{sessions} {sessions}
@ -142,7 +129,7 @@ export class SessionList extends Element {
if (this.style == "list") { if (this.style == "list") {
return (<div class="remote-session-link remote-session-list" id={id} platform={platform} title={alias ? "ID: " + id : ""} > return (<div class="remote-session-link remote-session-list" id={id} platform={platform} title={alias ? "ID: " + id : ""} >
<div class="platform" style={"background:" + string2RGB(id + platform, 0.5)}> <div class="platform" style={"background:" + string2RGB(id + platform, 0.5)}>
{platformSvg(platform, "white")} {platform && platformSvg(platform, "white")}
</div> </div>
<div class="name"> <div class="name">
<div> <div>
@ -157,7 +144,7 @@ export class SessionList extends Element {
} }
return (<div class="remote-session-link remote-session" id={id} platform={platform} title={alias ? "ID: " + id : ""} style={"background:" + string2RGB(id + platform, 0.5)} > return (<div class="remote-session-link remote-session" id={id} platform={platform} title={alias ? "ID: " + id : ""} style={"background:" + string2RGB(id + platform, 0.5)} >
<div class="platform"> <div class="platform">
{platformSvg(platform, "white")} {platform && platformSvg(platform, "white")}
<div class="username ellipsis">{username}@{hostname}</div> <div class="username ellipsis">{username}@{hostname}</div>
</div> </div>
<div class="text"> <div class="text">
@ -174,9 +161,23 @@ export class SessionList extends Element {
["on click at #menu"](_, me) { ["on click at #menu"](_, me) {
let id = me.parentElement.parentElement.id; let id = me.parentElement.parentElement.id;
let platform = me.parentElement.parentElement.getAttribute("platform"); let platform = me.parentElement.parentElement.getAttribute("platform");
console.log("menu id,platform:",id,platform); this.$("#rdp").style.setProperty(
// TODO rdp "display", (platform == "Windows" && is_win) ? "block" : "none",
// this.$("#rdp").style.setProperty("display", (platform == "Windows" && is_win) ? "block" : "none"); );
this.$("#forget-password").style.setProperty(
"display", handler.xcall("peer_has_password", id) ? "block" : "none",
);
if (!this.type || this.type == "fav") {
let in_fav = handler.xcall("get_fav").indexOf(id) >= 0;
let el = this.$("add-fav");
if (el) el.style.setProperty(
"display", in_fav ? "none" : "block",
);
el = this.$("remove-fav");
if (el) el.style.setProperty(
"display", in_fav ? "block" : "none",
);
}
// https://sciter.com/forums/topic/replacecustomize-context-menu/ // https://sciter.com/forums/topic/replacecustomize-context-menu/
let menu = this.$("menu#remote-context"); let menu = this.$("menu#remote-context");
menu.setAttribute("remote-id",id); menu.setAttribute("remote-id",id);
@ -186,8 +187,6 @@ export class SessionList extends Element {
["on click at menu#remote-context li"](evt, me) { ["on click at menu#remote-context li"](evt, me) {
let action = me.id; let action = me.id;
let id = me.parentElement.getAttribute("remote-id"); let id = me.parentElement.getAttribute("remote-id");
if(!id) return
console.log("click li",id);
if (action == "connect") { if (action == "connect") {
createNewConnect(id, "connect"); createNewConnect(id, "connect");
} else if (action == "transfer") { } else if (action == "transfer") {
@ -238,58 +237,47 @@ export class SessionList extends Element {
} }
function getSessionsType() { function getSessionsType() {
return handler.get_local_option("show-sessions-type"); return handler.xcall("get_local_option", "show-sessions-type");
} }
class Favorites: Reactor.Component { class Favorites extends Element {
function render() { render() {
var sessions = handler.get_fav().map(function(f) { var sessions = handler.xcall("get_fav").map(function(f) {
return handler.get_peer(f); return handler.xcall("get_peer", f);
}); });
return <SessionList sessions={sessions} type="fav" />; return <SessionList sessions={sessions} type="fav" />;
} }
} }
class MultipleSessions: Reactor.Component { export class MultipleSessions extends Element {
function render() { render() {
var type = getSessionsType(); var type = getSessionsType();
return <div style="size: *"> return <div style="size: *">
<div .sessions-bar> <div class="sessions-bar">
<div style="width:*" .sessions-tab #sessions-type> <div style="width:*" class="sessions-tab" id="sessions-type">
<span class={!type ? 'active' : 'inactive'}>{translate('Recent Sessions')}</span> <span class={!type ? 'active' : 'inactive'}>{translate('Recent Sessions')}</span>
<span #fav class={type == "fav" ? 'active' : 'inactive'}>{translate('Favorites')}</span> <span id="fav" class={type == "fav" ? 'active' : 'inactive'}>{translate('Favorites')}</span>
</div> </div>
{!this.hidden && <SearchBar type={type} />} {!this.hidden && <SearchBar type={type} />}
{!this.hidden && <SessionStyle type={type} />} {!this.hidden && <SessionStyle type={type} />}
</div> </div>
{!this.hidden && {!this.hidden &&
((type == "fav" && <Favorites />) || ((type == "fav" && <Favorites />) ||
<SessionList sessions={handler.get_recent_sessions()} />)} <SessionList sessions={handler.xcall("get_recent_sessions")} />)}
</div>; </div>;
} }
function stupidUpdate() { ["on click at div#sessions-type span.inactive"] (_, el) {
/* hidden is workaround of stupid sciter bug */ handler.xcall("set_option", 'show-sessions-type', el.id || "");
this.hidden = true; this.componentUpdate();
this.update();
var me = this;
self.timer(60ms, function() {
me.hidden = false;
me.update();
});
} }
event click $(div#sessions-type span.inactive) (_, el) { onSize() {
handler.set_option('show-sessions-type', el.id || ""); let w = this.$(".sessions-bar").state.box("width") - 220;
this.stupidUpdate(); this.$("#sessions-type span").style.setProperty(
} "max-width", (w / 2) + "px",
);
function onSize() {
var w = this.$(.sessions-bar).box(#width) - 220;
this.$(#sessions-type span).style.set{
"max-width": (w / 2) + "px",
};
} }
} }
view.on("size", function() { if (app && app.multipleSessions) app.multipleSessions.onSize(); }); document.onsizechange = () => { if (app && app.multipleSessions) app.multipleSessions.onSize(); }

1
src/ui/common.js
View File

@ -220,7 +220,6 @@ function getMsgboxParams() {
// tmp workaround https://sciter.com/forums/topic/menu-not-be-hidden-when-open-dialog-on-linux/ // 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 = "") { 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 if (is_linux) { // fix menu not hidden issue
setTimeout(() => msgbox_(type, title, text, callback, height, width, retry, contentStyle), 1); setTimeout(() => msgbox_(type, title, text, callback, height, width, retry, contentStyle), 1);
} else { } else {

4
src/ui/file_transfer.js
View File

@ -12,7 +12,7 @@ const svg_trash = (<svg viewBox="0 0 473.41 473.41">
<path transform="matrix(.064 -.998 .998 .064 -.546 19.418)" d="m-360.4 301.29h207.54v29.592h-207.54z"/> <path transform="matrix(.064 -.998 .998 .064 -.546 19.418)" d="m-360.4 301.29h207.54v29.592h-207.54z"/>
<path transform="matrix(.998 -.064 .064 .998 -.628 .399)" d="m141.64 202.35h29.592v207.54h-29.592z"/> <path transform="matrix(.998 -.064 .064 .998 -.628 .399)" d="m141.64 202.35h29.592v207.54h-29.592z"/>
</svg>); </svg>);
const svg_arrow = (<svg viewBox="0 0 482.24 482.24"> export const svg_arrow = (<svg viewBox="0 0 482.24 482.24">
<path d="m206.81 447.79-206.81-206.67 206.74-206.67 24.353 24.284-165.17 165.17h416.31v34.445h-416.31l165.24 165.24z"/> <path d="m206.81 447.79-206.81-206.67 206.74-206.67 24.353 24.284-165.17 165.17h416.31v34.445h-416.31l165.24 165.24z"/>
</svg>); </svg>);
const svg_home = (<svg viewBox="0 0 476.91 476.91"> const svg_home = (<svg viewBox="0 0 476.91 476.91">
@ -21,7 +21,7 @@ const svg_home = (<svg viewBox="0 0 476.91 476.91">
const svg_refresh = (<svg viewBox="0 0 551.13 551.13"> const svg_refresh = (<svg viewBox="0 0 551.13 551.13">
<path d="m482.24 310.01c0 113.97-92.707 206.67-206.67 206.67s-206.67-92.708-206.67-206.67c0-102.21 74.639-187.09 172.23-203.56v65.78l86.114-86.114-86.114-86.115v71.641c-116.65 16.802-206.67 117.14-206.67 238.37 0 132.96 108.16 241.12 241.12 241.12s241.12-108.16 241.12-241.12z"/> <path d="m482.24 310.01c0 113.97-92.707 206.67-206.67 206.67s-206.67-92.708-206.67-206.67c0-102.21 74.639-187.09 172.23-203.56v65.78l86.114-86.114-86.114-86.115v71.641c-116.65 16.802-206.67 117.14-206.67 238.37 0 132.96 108.16 241.12 241.12 241.12s241.12-108.16 241.12-241.12z"/>
</svg>); </svg>);
const svg_cancel = (<svg class="cancel" viewBox="0 0 612 612"><polygon points="612 36.004 576.52 0.603 306 270.61 35.478 0.603 0 36.004 270.52 306.01 0 576 35.478 611.4 306 341.41 576.52 611.4 612 576 341.46 306.01"/></svg>); export const svg_cancel = (<svg class="cancel" viewBox="0 0 612 612"><polygon points="612 36.004 576.52 0.603 306 270.61 35.478 0.603 0 36.004 270.52 306.01 0 576 35.478 611.4 306 341.41 576.52 611.4 612 576 341.46 306.01"/></svg>);
const svg_computer = (<svg class="computer" viewBox="0 0 480 480"> const svg_computer = (<svg class="computer" viewBox="0 0 480 480">
<g> <g>
<path fill="#2C8CFF" d="m276 395v11.148c0 2.327-1.978 4.15-4.299 3.985-21.145-1.506-42.392-1.509-63.401-0.011-2.322 0.166-4.3-1.657-4.3-3.985v-11.137c0-2.209 1.791-4 4-4h64c2.209 0 4 1.791 4 4zm204-340v288c0 17.65-14.35 32-32 32h-416c-17.65 0-32-14.35-32-32v-288c0-17.65 14.35-32 32-32h416c17.65 0 32 14.35 32 32zm-125.62 386.36c-70.231-21.843-158.71-21.784-228.76 0-4.22 1.31-6.57 5.8-5.26 10.02 1.278 4.085 5.639 6.591 10.02 5.26 66.093-20.58 151.37-21.125 219.24 0 4.22 1.31 8.71-1.04 10.02-5.26s-1.04-8.71-5.26-10.02z"/> <path fill="#2C8CFF" d="m276 395v11.148c0 2.327-1.978 4.15-4.299 3.985-21.145-1.506-42.392-1.509-63.401-0.011-2.322 0.166-4.3-1.657-4.3-3.985v-11.137c0-2.209 1.791-4 4-4h64c2.209 0 4 1.791 4 4zm204-340v288c0 17.65-14.35 32-32 32h-416c-17.65 0-32-14.35-32-32v-288c0-17.65 14.35-32 32-32h416c17.65 0 32 14.35 32 32zm-125.62 386.36c-70.231-21.843-158.71-21.784-228.76 0-4.22 1.31-6.57 5.8-5.26 10.02 1.278 4.085 5.639 6.591 10.02 5.26 66.093-20.58 151.37-21.125 219.24 0 4.22 1.31 8.71-1.04 10.02-5.26s-1.04-8.71-5.26-10.02z"/>

82
src/ui/index.js
View File

@ -1,5 +1,5 @@
import { is_osx,view,OS,handler,translate,msgbox,is_win,svg_checkmark,svg_edit,isReasonableSize,centerize,svg_eye } from "./common"; import { is_osx,view,OS,handler,translate,msgbox,is_win,svg_checkmark,svg_edit,isReasonableSize,centerize,svg_eye, PasswordComponent } from "./common";
import { SearchBar,SessionStyle,SessionList } from "./ab.js"; import { SearchBar,SessionStyle,SessionList, MultipleSessions } from "./ab.js";
import {$} from "@sciter"; //TEST $$ import import {$} from "@sciter"; //TEST $$ import
if (is_osx) view.blurBehind = "light"; if (is_osx) view.blurBehind = "light";
@ -53,31 +53,6 @@ class ConnectStatus extends Element {
} }
} }
class RecentSessions extends Element {
sessionList;
componentDidMount(){
this.sessionList = this.$("#SessionList")
}
render() {
let sessions = handler.xcall("get_recent_sessions");
if (sessions.length == 0) return <span />;
return (<div style="width: *">
<div class="sessions-bar">
<div style="width:*">
{translate("Recent Sessions")}
</div>
{!app.hidden && <SearchBar parent={this} />}
{!app.hidden && <SessionStyle />}
</div>
{!app.hidden && <SessionList id="SessionList" sessions={sessions} />}
</div>);
}
filter(v) {
this.sessionList.filter(v);
}
}
export function createNewConnect(id, type) { export function createNewConnect(id, type) {
id = id.replace(/\s/g, ""); id = id.replace(/\s/g, "");
app.remote_id.value = formatId(id); app.remote_id.value = formatId(id);
@ -91,20 +66,20 @@ export function createNewConnect(id, type) {
} }
var direct_server; var direct_server;
class DirectServer: Reactor.Component { class DirectServer extends Element {
function this() { this() {
direct_server = this; direct_server = this;
} }
function render() { render() {
var text = translate("Enable Direct IP Access"); var text = translate("Enable Direct IP Access");
var cls = handler.get_option("direct-server") == "Y" ? "selected" : "line-through"; var cls = handler.xcall("get_option", "direct-server") == "Y" ? "selected" : "line-through";
return <li class={cls}><span>{svg_checkmark}</span>{text}</li>; return <li class={cls}><span>{svg_checkmark}</span>{text}</li>;
} }
function onClick() { onClick() {
handler.set_option("direct-server", handler.get_option("direct-server") == "Y" ? "" : "Y"); handler.xcall("set_option", "direct-server", handler.xcall("get_option", "direct-server") == "Y" ? "" : "Y");
this.update(); this.componentUpdate();
} }
} }
@ -179,17 +154,19 @@ class MyIdMenu extends Element {
<div class="separator" /> <div class="separator" />
<li id="whitelist" title={translate('whitelist_tip')}>{translate('IP Whitelisting')}</li> <li id="whitelist" title={translate('whitelist_tip')}>{translate('IP Whitelisting')}</li>
<li id="custom-server">{translate('ID/Relay Server')}</li> <li id="custom-server">{translate('ID/Relay Server')}</li>
<li id="socks5-server">{translate('Socks5 Proxy')}</li>
<div class="separator" /> <div class="separator" />
<li id="stop-service" class={service_stopped ? "line-through" : "selected"}><span>{svg_checkmark}</span>{translate("Enable Service")}</li> <li id="stop-service" class={service_stopped ? "line-through" : "selected"}><span>{svg_checkmark}</span>{translate("Enable Service")}</li>
<DirectServer />
<div class="separator" /> <div class="separator" />
<li id="about">{translate('About')} {" "} {handler.xcall("get_app_name")}</li> <li id="about">{translate('About')} {" "} {handler.xcall("get_app_name")}</li>
</menu> </menu>
</popup>); </popup>);
} }
// TEST svg#menu // .popup()
["on click at svg#menu"](_, me) { ["on click at svg#menu"](_, me) {
console.log("open menu")
audioInputMenu.componentUpdate({ show: true }); audioInputMenu.componentUpdate({ show: true });
this.toggleMenuState(); this.toggleMenuState();
let menu = this.$("menu#config-options"); let menu = this.$("menu#config-options");
@ -261,12 +238,12 @@ class MyIdMenu extends Element {
handler.xcall("set_options",configOptions); handler.xcall("set_options",configOptions);
}, 240); }, 240);
} else if (me.id == "socks5-server") { } else if (me.id == "socks5-server") {
var socks5 = handler.get_socks() || {}; var socks5 = handler.xcall("get_socks") || {};
var old_proxy = socks5[0] || ""; var old_proxy = socks5[0] || "";
var old_username = socks5[1] || ""; var old_username = socks5[1] || "";
var old_password = socks5[2] || ""; var old_password = socks5[2] || "";
msgbox("custom-server", "Socks5 Proxy", <div .form .set-password> msgbox("custom-server", "Socks5 Proxy", <div class="form set-password">
<div><span>{translate("Hostname")}</span><input .outline-focus style='width: *' name='proxy' value={old_proxy} /></div> <div><span>{translate("Hostname")}</span><input class="outline-focus" style='width: *' name='proxy' value={old_proxy} /></div>
<div><span>{translate("Username")}</span><input style='width: *' name='username' value={old_username} /></div> <div><span>{translate("Username")}</span><input style='width: *' name='username' value={old_username} /></div>
<div><span>{translate("Password")}</span><PasswordComponent value={old_password} /></div> <div><span>{translate("Password")}</span><PasswordComponent value={old_password} /></div>
</div> </div>
@ -277,10 +254,10 @@ class MyIdMenu extends Element {
var password = (res.password || "").trim(); var password = (res.password || "").trim();
if (proxy == old_proxy && username == old_username && password == old_password) return; if (proxy == old_proxy && username == old_username && password == old_password) return;
if (proxy) { if (proxy) {
var err = handler.test_if_valid_server(proxy); var err = handler.xcall("test_if_valid_server", proxy);
if (err) return translate("Server") + ": " + err; if (err) return translate("Server") + ": " + err;
} }
handler.set_socks(proxy, username, password); handler.xcall("set_socks", proxy, username, password);
}, 240); }, 240);
} else if (me.id == "stop-service") { } else if (me.id == "stop-service") {
handler.xcall("set_option","stop-service", service_stopped ? "" : "Y"); handler.xcall("set_option","stop-service", service_stopped ? "" : "Y");
@ -314,7 +291,7 @@ class App extends Element{
componentDidMount(){ componentDidMount(){
this.remote_id = this.$("#ID"); this.remote_id = this.$("#ID");
this.recent_sessions = this.$("#RecentSessions"); this.multipleSessions = this.$("#multipleSessions");
this.connect_status = this.$("#ConnectStatus"); this.connect_status = this.$("#ConnectStatus");
} }
@ -323,8 +300,8 @@ class App extends Element{
return(<div class="app"> return(<div class="app">
<popup> <popup>
<menu class="context" id="edit-password-context"> <menu class="context" id="edit-password-context">
<li id="refresh-password">Refresh random password</li> <li id="refresh-password">{translate('Refresh random password')}</li>
<li id="set-password">Set your own password</li> <li id="set-password">{translate('Set your own password')}</li>
</menu> </menu>
</popup> </popup>
<div class="left-pane"> <div class="left-pane">
@ -359,7 +336,7 @@ class App extends Element{
<button class="button" id="connect">{translate('Connect')}</button> <button class="button" id="connect">{translate('Connect')}</button>
</div> </div>
</div> </div>
<RecentSessions id="RecentSessions" /> <MultipleSessions id="multipleSessions" />
</div> </div>
<ConnectStatus id="ConnectStatus" /> <ConnectStatus id="ConnectStatus" />
</div> </div>
@ -398,7 +375,7 @@ class InstallMe extends Element {
return (<div class="install-me"> return (<div class="install-me">
<span /> <span />
<div>{translate('install_tip')}</div> <div>{translate('install_tip')}</div>
<button id="install-me" class="button">{translate('Install')}</button> <div style="text-align: center; margin-top: 1em;"><button id="install-me" class="button">{translate('Install')}</button></div>
</div>); </div>);
} }
@ -479,7 +456,6 @@ class UpdateMe extends Element {
["on click at #install-me"]() { ["on click at #install-me"]() {
handler.xcall("open_url","https://rustdesk.com"); handler.xcall("open_url","https://rustdesk.com");
return; return;
// TODO return?
if (!is_win) { if (!is_win) {
handler.xcall("open_url","https://rustdesk.com"); handler.xcall("open_url","https://rustdesk.com");
return; return;
@ -572,10 +548,6 @@ class ModifyDefaultLogin extends Element {
} }
["on click at #modify-default-login"]() { ["on click at #modify-default-login"]() {
// TEST change tis old:
// if (var r = handler.modify_default_login()) {
// msgbox("custom-error", "Error", r);
// }
let r = handler.xcall("modify_default_login"); let r = handler.xcall("modify_default_login");
if (r) { if (r) {
msgbox("custom-error", "Error", r); msgbox("custom-error", "Error", r);
@ -587,7 +559,7 @@ class ModifyDefaultLogin extends Element {
function watch_trust() { function watch_trust() {
// not use TrustMe::update, because it is buggy // not use TrustMe::update, because it is buggy
let trusted = handler.xcall("is_process_trusted",false); let trusted = handler.xcall("is_process_trusted",false);
let el = document.$("div.trust-me"); let el = $("div.trust-me");
if (el) { if (el) {
el.style.setProperty("display", trusted ? "none" : "block"); el.style.setProperty("display", trusted ? "none" : "block");
} }
@ -628,10 +600,8 @@ class Password extends Element {
</div>); </div>);
} }
// TODO expecting element to popup 这里组件无法触发
["on click at svg#edit"](_,me) { ["on click at svg#edit"](_,me) {
let menu = this.$("menu#edit-password-context"); let menu = $("menu#edit-password-context");
console.log("修改密码",me)
me.popup(menu); me.popup(menu);
} }
@ -755,6 +725,6 @@ setInterval(() => {
} }
if (handler.xcall("recent_sessions_updated")) { if (handler.xcall("recent_sessions_updated")) {
console.log("recent sessions updated"); console.log("recent sessions updated");
app.recent_sessions.componentUpdate(); app.componentUpdate();
} }
}, 1000); }, 1000);

6
src/ui/msgbox.js
View File

@ -1,8 +1,8 @@
import { PasswordComponent } from "./common";
import {$,$$} from "@sciter"; //TEST $$ import import {$,$$} from "@sciter"; //TEST $$ import
const view = Window.this; const view = Window.this;
var type, title, text, getParams, remember, retry, callback, contentStyle; var type, title, text, getParams, remember, retry, callback, contentStyle;
var my_translate; // TEST var my_translate; // TEST
function updateParams(params) { function updateParams(params) {
type = params.type; type = params.type;
title = params.title; title = params.title;
@ -59,7 +59,6 @@ class Body extends Element {
getInputPasswordContent() { getInputPasswordContent() {
var ts = remember ? { checked: true } : {}; var ts = remember ? { checked: true } : {};
// TODO <button type="checkbox" ...
// <div><button|checkbox(remember) {ts}>{my_translate('Remember password')}</button></div> // <div><button|checkbox(remember) {ts}>{my_translate('Remember password')}</button></div>
return <div class="form"> return <div class="form">
<div>{my_translate('Please enter your password')}</div> <div>{my_translate('Please enter your password')}</div>
@ -100,8 +99,7 @@ class Body extends Element {
let hasOk = type != "connecting" && type.indexOf("nook") < 0; let hasOk = type != "connecting" && type.indexOf("nook") < 0;
let hasClose = type.indexOf("hasclose") >= 0; let hasClose = type.indexOf("hasclose") >= 0;
let show_progress = type == "connecting"; let show_progress = type == "connecting";
this.style.setProperty("border",(color + " solid 1px")); document.body.style.setProperty("border",(color + " solid 1px"));
console.log(content)
setTimeout(()=>this.$("#content").content(my_translate(content)),1); setTimeout(()=>this.$("#content").content(my_translate(content)),1);
return ( return (
<div style="size: *"> <div style="size: *">

11
src/ui/port_forward.js
View File

@ -1,4 +1,5 @@
import { translate } from "./common.js"; import { translate, handler } from "./common.js";
import { svg_arrow, svg_cancel } from "./file_transfer.js";
class PortForward extends Element { class PortForward extends Element {
render() { render() {
@ -73,8 +74,8 @@ class PortForward extends Element {
export function initializePortForward() export function initializePortForward()
{ {
$("#file-transfer-wrapper").content(<PortForward />); document.$("#file-transfer-wrapper").content(<PortForward />);
$("#video-wrapper").style.setProperty("visibility","hidden"); document.$("#video-wrapper").style.setProperty("visibility","hidden");
$("#video-wrapper").style.setProperty("position","absolute") document.$("#video-wrapper").style.setProperty("position","absolute")
$("#file-transfer-wrapper").style.setProperty("display","block"); document.$("#file-transfer-wrapper").style.setProperty("display","block");
} }