Skip to content
This repository was archived by the owner on Sep 6, 2021. It is now read-only.

Commit ce2b870

Browse files
g-217shubhsnov
g-217
authored and
shubhsnov
committed
Adding infobar for remote debugging enabled (#14956)
* Adding infobar for remote debugging enabled * Changing infobar type to warning * Removed button related codes * infobar is an independent unit * Changed getRemoteDebuggingPort usage * Addressing review comments * Updating infobar message
1 parent d5d00d4 commit ce2b870

10 files changed

Lines changed: 377 additions & 23 deletions

File tree

‎src/brackets.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -257,6 +257,16 @@ define(function (require, exports, module) {
257257
);
258258
}
259259

260+
brackets.app.getRemoteDebuggingPort(function (err, remote_debugging_port){
261+
if (remote_debugging_port && remote_debugging_port > 0) {
262+
var InfoBar = require('widgets/infobar');
263+
InfoBar.showInfoBar({
264+
type: "warning",
265+
title: `${Strings.REMOTE_DEBUGGING_ENABLED} ${remote_debugging_port}`,
266+
description: ""
267+
});
268+
}
269+
});
260270
// Use quiet scrollbars if we aren't on Lion. If we're on Lion, only
261271
// use native scroll bars when the mouse is not plugged in or when
262272
// using the "Always" scroll bar setting.

‎src/document/DocumentCommandHandlers.js‎

Lines changed: 25 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1642,28 +1642,31 @@ define(function (require, exports, module) {
16421642
if (brackets.inBrowser) {
16431643
result.resolve();
16441644
} else {
1645-
var port = brackets.app.getRemoteDebuggingPort ? brackets.app.getRemoteDebuggingPort() : 9234;
1646-
Inspector.getDebuggableWindows("127.0.0.1", port)
1647-
.fail(result.reject)
1648-
.done(function (response) {
1649-
var page = response[0];
1650-
if (!page || !page.webSocketDebuggerUrl) {
1651-
result.reject();
1652-
return;
1653-
}
1654-
var _socket = new WebSocket(page.webSocketDebuggerUrl);
1655-
// Disable the cache
1656-
_socket.onopen = function _onConnect() {
1657-
_socket.send(JSON.stringify({ id: 1, method: "Network.setCacheDisabled", params: { "cacheDisabled": true } }));
1658-
};
1659-
// The first message will be the confirmation => disconnected to allow remote debugging of Brackets
1660-
_socket.onmessage = function _onMessage(e) {
1661-
_socket.close();
1662-
result.resolve();
1663-
};
1664-
// In case of an error
1665-
_socket.onerror = result.reject;
1666-
});
1645+
brackets.app.getRemoteDebuggingPort(function (err, port){
1646+
if (port && port > 0) {
1647+
Inspector.getDebuggableWindows("127.0.0.1", port)
1648+
.fail(result.reject)
1649+
.done(function (response) {
1650+
var page = response[0];
1651+
if (!page || !page.webSocketDebuggerUrl) {
1652+
result.reject();
1653+
return;
1654+
}
1655+
var _socket = new WebSocket(page.webSocketDebuggerUrl);
1656+
// Disable the cache
1657+
_socket.onopen = function _onConnect() {
1658+
_socket.send(JSON.stringify({ id: 1, method: "Network.setCacheDisabled", params: { "cacheDisabled": true } }));
1659+
};
1660+
// The first message will be the confirmation => disconnected to allow remote debugging of Brackets
1661+
_socket.onmessage = function _onMessage(e) {
1662+
_socket.close();
1663+
result.resolve();
1664+
};
1665+
// In case of an error
1666+
_socket.onerror = result.reject;
1667+
});
1668+
}
1669+
});
16671670
}
16681671

16691672
return result.promise();

‎src/htmlContent/infobar-template.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<div id="info-bar-template" {{#type}}class={{{type}}}{{/type}} tabindex="0">
2+
<div id="icon-container">
3+
<svg id="info-icon"> </svg>
4+
</div>
5+
<div id="content-container">
6+
<p id="info-content"><span id="heading">{{title}}</span>&nbsp;&nbsp;<span id="description">{{{description}}}</span></p>
7+
</div>
8+
{{^buttons}}
9+
<div id="close-icon-container">
10+
<button type="button" id="close-icon" tabIndex="0">&times;</button>
11+
</div>
12+
{{/buttons}}
13+
</div>

‎src/nls/root/strings.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -897,5 +897,8 @@ define({
897897
"REFERENCES_NO_RESULTS" : "No References available for current cursor position",
898898

899899
"CMD_FIND_DOCUMENT_SYMBOLS" : "Find Document Symbols",
900-
"CMD_FIND_PROJECT_SYMBOLS" : "Find Project Symbols"
900+
"CMD_FIND_PROJECT_SYMBOLS" : "Find Project Symbols",
901+
902+
// Remote debugging enabled
903+
"REMOTE_DEBUGGING_ENABLED" : "Remote debugging enabled on localhost:"
901904
});

‎src/styles/brackets_shared.less‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,3 +57,5 @@
5757

5858
// Styling for scrollbars
5959
@import url("brackets_scrollbars.less");
60+
61+
@import url("infobar-styles.less");

‎src/styles/images/infobar-alert.svg‎

Lines changed: 10 additions & 0 deletions
Loading

‎src/styles/images/infobar-checkmarkcircle.svg‎

Lines changed: 10 additions & 0 deletions
Loading

‎src/styles/images/infobar-info.svg‎

Lines changed: 10 additions & 0 deletions
Loading

‎src/styles/infobar-styles.less‎

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
/*
2+
* Copyright (c) 2019 - present Adobe Systems Incorporated. All rights reserved.
3+
*
4+
* Permission is hereby granted, free of charge, to any person obtaining a
5+
* copy of this software and associated documentation files (the "Software"),
6+
* to deal in the Software without restriction, including without limitation
7+
* the rights to use, copy, modify, merge, publish, distribute, sublicense,
8+
* and/or sell copies of the Software, and to permit persons to whom the
9+
* Software is furnished to do so, subject to the following conditions:
10+
*
11+
* The above copyright notice and this permission notice shall be included in
12+
* all copies or substantial portions of the Software.
13+
*
14+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
15+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
16+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
17+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
18+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
19+
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
20+
* DEALINGS IN THE SOFTWARE.
21+
*
22+
*/
23+
24+
/*info Bar*/
25+
#info-bar-template {
26+
display: block;
27+
background-color: #105F9C;
28+
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.53);
29+
height: 38px;
30+
width: 100%;
31+
position: absolute;
32+
z-index: 15;
33+
left: 0px;
34+
bottom: 25px;
35+
outline: none;
36+
overflow: hidden;
37+
}
38+
39+
#info-bar-template #icon-container {
40+
width: auto;
41+
height: auto;
42+
padding: 11px;
43+
float: left;
44+
}
45+
#info-bar-template #icon-container #info-icon {
46+
background: url("images/infobar-info.svg") no-repeat 0 0;
47+
width: 16px;
48+
height: 16px;
49+
display: block;
50+
}
51+
52+
#info-bar-template #content-container {
53+
padding: 10px 7px;
54+
float: left;
55+
max-width: 78%;
56+
}
57+
58+
#info-bar-template #content-container #info-content {
59+
margin: 0px !important; /*Check if this important is necessary*/
60+
line-height: 18px;
61+
font-size: 14px;
62+
font-family: 'SourceSansPro';
63+
color: #FFFFFF;
64+
overflow: hidden;
65+
text-overflow: ellipsis;
66+
white-space: nowrap;
67+
}
68+
69+
#info-bar-template #content-container #info-content #heading{
70+
font-weight: bold;
71+
}
72+
/*For focussed link of brackets.io*/
73+
#info-bar-template #content-container #info-content #description a:focus{
74+
box-shadow: none;
75+
}
76+
77+
#info-bar-template #content-container #info-content #description a{
78+
text-decoration: underline;
79+
color: #FFFFFF;
80+
}
81+
82+
#info-bar-template #close-icon-container {
83+
height: auto;
84+
padding: 9px;
85+
position: fixed;
86+
float: right;
87+
text-align: center;
88+
width: auto;
89+
min-width: 66px;
90+
right: 30px;
91+
background-color: #105F9C;
92+
}
93+
94+
#info-bar-template #close-icon-container #close-icon {
95+
display: block;
96+
color: white;
97+
font-size: 18px;
98+
line-height: 18px;
99+
text-decoration: none;
100+
width: 18px;
101+
height: 18px;
102+
background-color: transparent;
103+
border: none;
104+
padding: 0px; /*This is needed to center the icon*/
105+
float: right;
106+
}
107+
108+
#info-bar-template #close-icon-container #close-icon:hover {
109+
background-color: rgba(255, 255, 255 ,0.16);
110+
border-radius: 50%;
111+
}
112+
113+
#info-bar-template #close-icon-container #close-icon:focus {
114+
background-color: rgba(255, 255, 255 ,0.16);
115+
border-radius: 50%;
116+
border: 1px solid #C3E3FF;
117+
outline: 0;
118+
}
119+
120+
#info-bar-template #close-icon-container #close-icon:focus:active {
121+
background-color: rgba(255, 255, 255 ,0.32);
122+
border: none;
123+
}
124+
125+
/*Warning Message in info Bar*/
126+
#info-bar-template.warning, #info-bar-template.warning #close-icon-container {
127+
background-color: #DA7A12;
128+
}
129+
130+
.dark #info-bar-template.warning, .dark #info-bar-template.warning #close-icon-container {
131+
background-color: #E6851A;
132+
}
133+
134+
#info-bar-template.warning #icon-container #info-icon,
135+
#info-bar-template.error #icon-container #info-icon {
136+
background: url("images/infobar-alert.svg") no-repeat 0 0;
137+
}
138+
139+
/*Error message in info Bar*/
140+
#info-bar-template.error, #info-bar-template.error #close-icon-container {
141+
background-color: #D7373F;
142+
}
143+
144+
.dark #info-bar-template.error, .dark #info-bar-template.error #close-icon-container{
145+
background-color: #E4484F;
146+
}
147+
/*Success message in info Bar*/
148+
#info-bar-template.success, #info-bar-template.success #close-icon-container {
149+
background-color: #278E6B;
150+
}
151+
152+
.dark #info-bar-template.success, .dark #info-bar-template.success #close-icon-container {
153+
background-color: #2E9D77;
154+
}
155+
156+
#info-bar-template.success #icon-container #info-icon{
157+
background: url("images/infobar-checkmarkcircle.svg") no-repeat 0 0;
158+
}

0 commit comments

Comments
 (0)
⚡