jcs.org
Serenity Operating System
1/*
2 * Copyright (c) 2020, Hunter Salyer <thefalsehonesty@gmail.com>
3 * Copyright (c) 2021, Andreas Kling <kling@serenityos.org>
4 * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
5 * Copyright (c) 2022, the SerenityOS developers.
6 *
7 * SPDX-License-Identifier: BSD-2-Clause
8 */
9
10#include "ConsoleWidget.h"
11#include <AK/StringBuilder.h>
12#include <Applications/Browser/Browser.h>
13#include <LibGUI/BoxLayout.h>
14#include <LibGUI/Button.h>
15#include <LibGUI/TextBox.h>
16#include <LibGfx/Font/FontDatabase.h>
17#include <LibJS/MarkupGenerator.h>
18#include <LibJS/SyntaxHighlighter.h>
19
20namespace Browser {
21
22ConsoleWidget::ConsoleWidget()
23{
24 set_layout<GUI::VerticalBoxLayout>();
25 set_fill_with_background_color(true);
26
27 m_output_view = add<WebView::OutOfProcessWebView>();
28 m_output_view->load("data:text/html,<html></html>"sv);
29 // Wait until our output WebView is loaded, and then request any messages that occurred before we existed
30 m_output_view->on_load_finish = [this](auto&) {
31 if (on_request_messages)
32 on_request_messages(0);
33 };
34
35 auto& bottom_container = add<GUI::Widget>();
36 bottom_container.set_layout<GUI::HorizontalBoxLayout>();
37 bottom_container.set_fixed_height(22);
38
39 m_input = bottom_container.add<GUI::TextBox>();
40 m_input->set_syntax_highlighter(make<JS::SyntaxHighlighter>());
41 // FIXME: Syntax Highlighting breaks the cursor's position on non fixed-width fonts.
42 m_input->set_font(Gfx::FontDatabase::default_fixed_width_font());
43 m_input->set_history_enabled(true);
44
45 m_input->on_return_pressed = [this] {
46 auto js_source = m_input->text();
47
48 if (js_source.is_whitespace())
49 return;
50
51 m_input->add_current_text_to_history();
52 m_input->clear();
53
54 print_source_line(js_source);
55
56 if (on_js_input)
57 on_js_input(js_source);
58 };
59
60 set_focus_proxy(m_input);
61
62 auto& clear_button = bottom_container.add<GUI::Button>();
63 clear_button.set_fixed_size(22, 22);
64 clear_button.set_icon(g_icon_bag.delete_icon);
65 clear_button.set_tooltip("Clear the console output");
66 clear_button.on_click = [this](auto) {
67 clear_output();
68 };
69}
70
71void ConsoleWidget::request_console_messages()
72{
73 VERIFY(!m_waiting_for_messages);
74 VERIFY(on_request_messages);
75 on_request_messages(m_highest_received_message_index + 1);
76 m_waiting_for_messages = true;
77}
78
79void ConsoleWidget::notify_about_new_console_message(i32 message_index)
80{
81 if (message_index <= m_highest_received_message_index) {
82 dbgln("Notified about console message we already have");
83 return;
84 }
85 if (message_index <= m_highest_notified_message_index) {
86 dbgln("Notified about console message we're already aware of");
87 return;
88 }
89
90 m_highest_notified_message_index = message_index;
91 if (!m_waiting_for_messages)
92 request_console_messages();
93}
94
95void ConsoleWidget::handle_console_messages(i32 start_index, Vector<DeprecatedString> const& message_types, Vector<DeprecatedString> const& messages)
96{
97 i32 end_index = start_index + message_types.size() - 1;
98 if (end_index <= m_highest_received_message_index) {
99 dbgln("Received old console messages");
100 return;
101 }
102
103 for (size_t i = 0; i < message_types.size(); i++) {
104 auto& type = message_types[i];
105 auto& message = messages[i];
106
107 if (type == "html") {
108 print_html(message);
109 } else if (type == "clear") {
110 clear_output();
111 } else if (type == "group") {
112 begin_group(message, true);
113 } else if (type == "groupCollapsed") {
114 begin_group(message, false);
115 } else if (type == "groupEnd") {
116 end_group();
117 } else {
118 VERIFY_NOT_REACHED();
119 }
120 }
121
122 m_highest_received_message_index = end_index;
123 m_waiting_for_messages = false;
124
125 if (m_highest_received_message_index < m_highest_notified_message_index)
126 request_console_messages();
127}
128
129void ConsoleWidget::print_source_line(StringView source)
130{
131 StringBuilder html;
132 html.append("<span class=\"repl-indicator\">"sv);
133 html.append("> "sv);
134 html.append("</span>"sv);
135
136 html.append(JS::MarkupGenerator::html_from_source(source).release_value_but_fixme_should_propagate_errors());
137
138 print_html(html.string_view());
139}
140
141void ConsoleWidget::print_html(StringView line)
142{
143 StringBuilder builder;
144
145 int parent_id = m_group_stack.is_empty() ? 0 : m_group_stack.last().id;
146 if (parent_id == 0) {
147 builder.append(R"~~~(
148 var parentGroup = document.body;
149)~~~"sv);
150 } else {
151 builder.appendff(R"~~~(
152 var parentGroup = document.getElementById("group_{}");
153)~~~",
154 parent_id);
155 }
156
157 builder.append(R"~~~(
158 var p = document.createElement("p");
159 p.innerHTML = ")~~~"sv);
160 builder.append_escaped_for_json(line);
161 builder.append(R"~~~("
162 parentGroup.appendChild(p);
163)~~~"sv);
164 m_output_view->run_javascript(builder.string_view());
165 // FIXME: Make it scroll to the bottom, using `window.scrollTo()` in the JS above.
166 // We used to call `m_output_view->scroll_to_bottom();` here, but that does not work because
167 // it runs synchronously, meaning it happens before the HTML is output via IPC above.
168 // (See also: begin_group())
169}
170
171void ConsoleWidget::clear_output()
172{
173 m_group_stack.clear();
174 m_output_view->run_javascript(R"~~~(
175 document.body.innerHTML = "";
176 )~~~"sv);
177}
178
179void ConsoleWidget::begin_group(StringView label, bool start_expanded)
180{
181 StringBuilder builder;
182 int parent_id = m_group_stack.is_empty() ? 0 : m_group_stack.last().id;
183 if (parent_id == 0) {
184 builder.append(R"~~~(
185 var parentGroup = document.body;
186)~~~"sv);
187 } else {
188 builder.appendff(R"~~~(
189 var parentGroup = document.getElementById("group_{}");
190)~~~",
191 parent_id);
192 }
193
194 Group group;
195 group.id = m_next_group_id++;
196 group.label = label;
197
198 builder.appendff(R"~~~(
199 var group = document.createElement("details");
200 group.id = "group_{}";
201 var label = document.createElement("summary");
202 label.innerHTML = ")~~~",
203 group.id);
204 builder.append_escaped_for_json(label);
205 builder.append(R"~~~(";
206 group.appendChild(label);
207 parentGroup.appendChild(group);
208)~~~"sv);
209
210 if (start_expanded)
211 builder.append("group.open = true;"sv);
212
213 m_output_view->run_javascript(builder.string_view());
214 // FIXME: Scroll console to bottom - see note in print_html()
215 m_group_stack.append(group);
216}
217
218void ConsoleWidget::end_group()
219{
220 m_group_stack.take_last();
221}
222
223void ConsoleWidget::reset()
224{
225 clear_output();
226 m_highest_notified_message_index = -1;
227 m_highest_received_message_index = -1;
228 m_waiting_for_messages = false;
229}
230
231}