BorderPainting.cpp 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599
  1. /*
  2. * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
  3. * Copyright (c) 2021-2023, Sam Atkins <atkinssj@serenityos.org>
  4. * Copyright (c) 2022, MacDue <macdue@dueutil.tech>
  5. *
  6. * SPDX-License-Identifier: BSD-2-Clause
  7. */
  8. #include <AK/CircularQueue.h>
  9. #include <LibGfx/AntiAliasingPainter.h>
  10. #include <LibWeb/DOM/Document.h>
  11. #include <LibWeb/Layout/Node.h>
  12. namespace Web::Painting {
  13. static constexpr double dark_light_absolute_value_difference = 1. / 3;
  14. static Color light_color_for_inset_and_outset(Color const& color)
  15. {
  16. auto hsv = color.to_hsv();
  17. if (hsv.value >= dark_light_absolute_value_difference)
  18. return Color::from_hsv(hsv);
  19. return Color::from_hsv({ hsv.hue, hsv.saturation, hsv.value + dark_light_absolute_value_difference });
  20. }
  21. static Color dark_color_for_inset_and_outset(Color const& color)
  22. {
  23. auto hsv = color.to_hsv();
  24. if (hsv.value < dark_light_absolute_value_difference)
  25. return Color::from_hsv(hsv);
  26. return Color::from_hsv({ hsv.hue, hsv.saturation, hsv.value - dark_light_absolute_value_difference });
  27. }
  28. Gfx::Color border_color(BorderEdge edge, BordersDataDevicePixels const& borders_data)
  29. {
  30. auto const& border_data = [&] {
  31. switch (edge) {
  32. case BorderEdge::Top:
  33. return borders_data.top;
  34. case BorderEdge::Right:
  35. return borders_data.right;
  36. case BorderEdge::Bottom:
  37. return borders_data.bottom;
  38. case BorderEdge::Left:
  39. return borders_data.left;
  40. default:
  41. VERIFY_NOT_REACHED();
  42. }
  43. }();
  44. if (border_data.line_style == CSS::LineStyle::Inset) {
  45. auto top_left_color = dark_color_for_inset_and_outset(border_data.color);
  46. auto bottom_right_color = light_color_for_inset_and_outset(border_data.color);
  47. return (edge == BorderEdge::Left || edge == BorderEdge::Top) ? top_left_color : bottom_right_color;
  48. } else if (border_data.line_style == CSS::LineStyle::Outset) {
  49. auto top_left_color = light_color_for_inset_and_outset(border_data.color);
  50. auto bottom_right_color = dark_color_for_inset_and_outset(border_data.color);
  51. return (edge == BorderEdge::Left || edge == BorderEdge::Top) ? top_left_color : bottom_right_color;
  52. }
  53. return border_data.color;
  54. }
  55. void paint_border(Gfx::Painter& painter, BorderEdge edge, DevicePixelRect const& rect, Gfx::AntiAliasingPainter::CornerRadius const& radius, Gfx::AntiAliasingPainter::CornerRadius const& opposite_radius, BordersDataDevicePixels const& borders_data, Gfx::Path& path, bool last)
  56. {
  57. auto const& border_data = [&] {
  58. switch (edge) {
  59. case BorderEdge::Top:
  60. return borders_data.top;
  61. case BorderEdge::Right:
  62. return borders_data.right;
  63. case BorderEdge::Bottom:
  64. return borders_data.bottom;
  65. default: // BorderEdge::Left:
  66. return borders_data.left;
  67. }
  68. }();
  69. if (border_data.width <= 0)
  70. return;
  71. auto color = border_color(edge, borders_data);
  72. auto border_style = border_data.line_style;
  73. struct Points {
  74. DevicePixelPoint p1;
  75. DevicePixelPoint p2;
  76. };
  77. auto points_for_edge = [](BorderEdge edge, DevicePixelRect const& rect) -> Points {
  78. switch (edge) {
  79. case BorderEdge::Top:
  80. return { rect.top_left(), rect.top_right().moved_left(1) };
  81. case BorderEdge::Right:
  82. return { rect.top_right().moved_left(1), rect.bottom_right().translated(-1) };
  83. case BorderEdge::Bottom:
  84. return { rect.bottom_left().moved_up(1), rect.bottom_right().translated(-1) };
  85. default: // Edge::Left
  86. return { rect.top_left(), rect.bottom_left().moved_up(1) };
  87. }
  88. };
  89. auto gfx_line_style = Gfx::Painter::LineStyle::Solid;
  90. switch (border_style) {
  91. case CSS::LineStyle::None:
  92. case CSS::LineStyle::Hidden:
  93. return;
  94. case CSS::LineStyle::Dotted:
  95. gfx_line_style = Gfx::Painter::LineStyle::Dotted;
  96. break;
  97. case CSS::LineStyle::Dashed:
  98. gfx_line_style = Gfx::Painter::LineStyle::Dashed;
  99. break;
  100. case CSS::LineStyle::Solid:
  101. gfx_line_style = Gfx::Painter::LineStyle::Solid;
  102. break;
  103. case CSS::LineStyle::Double:
  104. case CSS::LineStyle::Groove:
  105. case CSS::LineStyle::Ridge:
  106. case CSS::LineStyle::Inset:
  107. case CSS::LineStyle::Outset:
  108. // FIXME: Implement these
  109. break;
  110. }
  111. if (gfx_line_style != Gfx::Painter::LineStyle::Solid) {
  112. auto [p1, p2] = points_for_edge(edge, rect);
  113. switch (edge) {
  114. case BorderEdge::Top:
  115. p1.translate_by(border_data.width / 2, border_data.width / 2);
  116. p2.translate_by(-border_data.width / 2, border_data.width / 2);
  117. break;
  118. case BorderEdge::Right:
  119. p1.translate_by(-border_data.width / 2, border_data.width / 2);
  120. p2.translate_by(-border_data.width / 2, -border_data.width / 2);
  121. break;
  122. case BorderEdge::Bottom:
  123. p1.translate_by(border_data.width / 2, -border_data.width / 2);
  124. p2.translate_by(-border_data.width / 2, -border_data.width / 2);
  125. break;
  126. case BorderEdge::Left:
  127. p1.translate_by(border_data.width / 2, border_data.width / 2);
  128. p2.translate_by(border_data.width / 2, -border_data.width / 2);
  129. break;
  130. }
  131. if (border_style == CSS::LineStyle::Dotted) {
  132. painter.draw_line(p1.to_type<int>(), p2.to_type<int>(), color, border_data.width.value(), gfx_line_style);
  133. return;
  134. }
  135. painter.draw_line(p1.to_type<int>(), p2.to_type<int>(), color, border_data.width.value(), gfx_line_style);
  136. return;
  137. }
  138. auto draw_border = [&](Vector<Gfx::FloatPoint> const& points, bool joined_corner_has_inner_corner, bool opposite_joined_corner_has_inner_corner, Gfx::FloatSize joined_inner_corner_offset, Gfx::FloatSize opposite_joined_inner_corner_offset, bool ready_to_draw) {
  139. int current = 0;
  140. path.move_to(points[current++]);
  141. path.elliptical_arc_to(
  142. points[current++],
  143. Gfx::FloatSize(radius.horizontal_radius, radius.vertical_radius),
  144. 0,
  145. false,
  146. false);
  147. path.line_to(points[current++]);
  148. if (joined_corner_has_inner_corner) {
  149. path.elliptical_arc_to(
  150. points[current++],
  151. Gfx::FloatSize(radius.horizontal_radius - joined_inner_corner_offset.width(), radius.vertical_radius - joined_inner_corner_offset.height()),
  152. 0,
  153. false,
  154. true);
  155. }
  156. path.line_to(points[current++]);
  157. if (opposite_joined_corner_has_inner_corner) {
  158. path.elliptical_arc_to(
  159. points[current++],
  160. Gfx::FloatSize(opposite_radius.horizontal_radius - opposite_joined_inner_corner_offset.width(), opposite_radius.vertical_radius - opposite_joined_inner_corner_offset.height()),
  161. 0,
  162. false,
  163. true);
  164. }
  165. path.line_to(points[current++]);
  166. path.elliptical_arc_to(
  167. points[current++],
  168. Gfx::FloatSize(opposite_radius.horizontal_radius, opposite_radius.vertical_radius),
  169. 0,
  170. false,
  171. false);
  172. // If joined borders have the same color, combine them to draw together.
  173. if (ready_to_draw) {
  174. path.close_all_subpaths();
  175. Gfx::AntiAliasingPainter aa_painter(painter);
  176. aa_painter.fill_path(path, color, Gfx::Painter::WindingRule::EvenOdd);
  177. path.clear();
  178. }
  179. };
  180. auto compute_midpoint = [&](int horizontal_radius, int vertical_radius, int joined_border_width) {
  181. if (horizontal_radius == 0 && vertical_radius == 0) {
  182. return Gfx::FloatPoint(0, 0);
  183. }
  184. if (joined_border_width == 0) {
  185. switch (edge) {
  186. case BorderEdge::Top:
  187. case BorderEdge::Bottom:
  188. return Gfx::FloatPoint(horizontal_radius, 0);
  189. case BorderEdge::Right:
  190. case BorderEdge::Left:
  191. return Gfx::FloatPoint(0, vertical_radius);
  192. default:
  193. VERIFY_NOT_REACHED();
  194. }
  195. }
  196. // FIXME: this middle point rule seems not exacly the same as main browsers
  197. // compute the midpoint based on point whose tangent slope of 1
  198. // https://math.stackexchange.com/questions/3325134/find-the-points-on-the-ellipse-where-the-slope-of-the-tangent-line-is-1
  199. return Gfx::FloatPoint(
  200. (horizontal_radius * horizontal_radius) / AK::sqrt(1.0f * horizontal_radius * horizontal_radius + vertical_radius * vertical_radius),
  201. (vertical_radius * vertical_radius) / AK::sqrt(1.0f * horizontal_radius * horizontal_radius + vertical_radius * vertical_radius));
  202. };
  203. /**
  204. * 0 /-------------\ 7
  205. * / /-----------\ \
  206. * /-/ 3 4 \-\
  207. * 1 2 5 6
  208. * For each border edge, need to compute 8 points at most, then paint them as closed path.
  209. * 8 points are the most complicated case, it happens when the joined border width is not 0 and border radius larger than border width on both side.
  210. * If border radius is smaller than the border width, then the inner corner of the border corner is a right angle.
  211. */
  212. switch (edge) {
  213. case BorderEdge::Top: {
  214. auto joined_border_width = borders_data.left.width;
  215. auto opposite_joined_border_width = borders_data.right.width;
  216. bool joined_corner_has_inner_corner = border_data.width < radius.vertical_radius && joined_border_width < radius.horizontal_radius;
  217. bool opposite_joined_corner_has_inner_corner = border_data.width < opposite_radius.vertical_radius && opposite_joined_border_width < opposite_radius.horizontal_radius;
  218. Gfx::FloatPoint joined_corner_endpoint_offset;
  219. Gfx::FloatPoint opposite_joined_border_corner_offset;
  220. {
  221. auto midpoint = compute_midpoint(radius.horizontal_radius, radius.vertical_radius, joined_border_width.value());
  222. joined_corner_endpoint_offset = Gfx::FloatPoint(-midpoint.x(), radius.vertical_radius - midpoint.y());
  223. }
  224. {
  225. auto midpoint = compute_midpoint(opposite_radius.horizontal_radius, opposite_radius.vertical_radius, opposite_joined_border_width.value());
  226. opposite_joined_border_corner_offset = Gfx::FloatPoint(midpoint.x(), opposite_radius.vertical_radius - midpoint.y());
  227. }
  228. Vector<Gfx::FloatPoint, 8> points;
  229. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()));
  230. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + joined_corner_endpoint_offset);
  231. if (joined_corner_has_inner_corner) {
  232. Gfx::FloatPoint midpoint = compute_midpoint(
  233. radius.horizontal_radius - joined_border_width.value(),
  234. radius.vertical_radius - border_data.width.value(),
  235. joined_border_width.value());
  236. Gfx::FloatPoint inner_corner_endpoint_offset = Gfx::FloatPoint(
  237. -midpoint.x(),
  238. radius.vertical_radius - border_data.width.value() - midpoint.y());
  239. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) + inner_corner_endpoint_offset);
  240. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()));
  241. } else {
  242. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(
  243. joined_border_width.value() - radius.horizontal_radius,
  244. 0);
  245. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) + inner_right_angle_offset);
  246. }
  247. if (opposite_joined_corner_has_inner_corner) {
  248. Gfx::FloatPoint midpoint = compute_midpoint(
  249. opposite_radius.horizontal_radius - opposite_joined_border_width.value(),
  250. opposite_radius.vertical_radius - border_data.width.value(),
  251. opposite_joined_border_width.value());
  252. Gfx::FloatPoint inner_corner_endpoint_offset = Gfx::FloatPoint(
  253. midpoint.x(),
  254. opposite_radius.vertical_radius - border_data.width.value() - midpoint.y());
  255. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()));
  256. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) + inner_corner_endpoint_offset);
  257. } else {
  258. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(
  259. opposite_joined_border_width.value() - opposite_radius.horizontal_radius,
  260. 0);
  261. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) - inner_right_angle_offset);
  262. }
  263. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) + opposite_joined_border_corner_offset);
  264. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()));
  265. draw_border(
  266. points,
  267. joined_corner_has_inner_corner,
  268. opposite_joined_corner_has_inner_corner,
  269. Gfx::FloatSize(joined_border_width.value(), border_data.width.value()),
  270. Gfx::FloatSize(opposite_joined_border_width.value(), border_data.width.value()),
  271. last || color != border_color(BorderEdge::Right, borders_data));
  272. break;
  273. }
  274. case BorderEdge::Right: {
  275. auto joined_border_width = borders_data.top.width;
  276. auto opposite_joined_border_width = borders_data.bottom.width;
  277. bool joined_corner_has_inner_corner = border_data.width < radius.horizontal_radius && joined_border_width < radius.vertical_radius;
  278. bool opposite_joined_corner_has_inner_corner = border_data.width < opposite_radius.horizontal_radius && opposite_joined_border_width < opposite_radius.vertical_radius;
  279. Gfx::FloatPoint joined_corner_endpoint_offset;
  280. Gfx::FloatPoint opposite_joined_border_corner_offset;
  281. {
  282. auto midpoint = compute_midpoint(radius.horizontal_radius, radius.vertical_radius, joined_border_width.value());
  283. joined_corner_endpoint_offset = Gfx::FloatPoint(midpoint.x() - radius.horizontal_radius, -midpoint.y());
  284. }
  285. {
  286. auto midpoint = compute_midpoint(opposite_radius.horizontal_radius, opposite_radius.vertical_radius, opposite_joined_border_width.value());
  287. opposite_joined_border_corner_offset = Gfx::FloatPoint(midpoint.x() - opposite_radius.horizontal_radius, midpoint.y());
  288. }
  289. Vector<Gfx::FloatPoint, 8> points;
  290. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()));
  291. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) + joined_corner_endpoint_offset);
  292. if (joined_corner_has_inner_corner) {
  293. auto midpoint = compute_midpoint(
  294. radius.horizontal_radius - border_data.width.value(),
  295. radius.vertical_radius - joined_border_width.value(),
  296. joined_border_width.value());
  297. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(
  298. -(radius.horizontal_radius - midpoint.x() - border_data.width.value()),
  299. -midpoint.y());
  300. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + inner_corner);
  301. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()));
  302. } else {
  303. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(0, joined_border_width.value() - radius.horizontal_radius);
  304. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + inner_right_angle_offset);
  305. }
  306. if (opposite_joined_corner_has_inner_corner) {
  307. auto midpoint = compute_midpoint(
  308. opposite_radius.horizontal_radius - border_data.width.value(),
  309. opposite_radius.vertical_radius - opposite_joined_border_width.value(),
  310. opposite_joined_border_width.value());
  311. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(
  312. -(opposite_radius.horizontal_radius - midpoint.x() - border_data.width.value()),
  313. midpoint.y());
  314. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()));
  315. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) + inner_corner);
  316. } else {
  317. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(0, opposite_joined_border_width.value() - opposite_radius.horizontal_radius);
  318. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) - inner_right_angle_offset);
  319. }
  320. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) + opposite_joined_border_corner_offset);
  321. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()));
  322. draw_border(
  323. points,
  324. joined_corner_has_inner_corner,
  325. opposite_joined_corner_has_inner_corner,
  326. Gfx::FloatSize(border_data.width.value(), joined_border_width.value()),
  327. Gfx::FloatSize(border_data.width.value(), opposite_joined_border_width.value()),
  328. last || color != border_color(BorderEdge::Bottom, borders_data));
  329. break;
  330. }
  331. case BorderEdge::Bottom: {
  332. auto joined_border_width = borders_data.right.width;
  333. auto opposite_joined_border_width = borders_data.left.width;
  334. bool joined_corner_has_inner_corner = border_data.width < radius.vertical_radius && joined_border_width < radius.horizontal_radius;
  335. bool opposite_joined_corner_has_inner_corner = border_data.width < opposite_radius.vertical_radius && opposite_joined_border_width < opposite_radius.horizontal_radius;
  336. Gfx::FloatPoint joined_corner_endpoint_offset;
  337. Gfx::FloatPoint opposite_joined_border_corner_offset;
  338. {
  339. auto midpoint = compute_midpoint(radius.horizontal_radius, radius.vertical_radius, joined_border_width.value());
  340. joined_corner_endpoint_offset = Gfx::FloatPoint(midpoint.x(), midpoint.y() - radius.vertical_radius);
  341. }
  342. {
  343. auto midpoint = compute_midpoint(opposite_radius.horizontal_radius, opposite_radius.vertical_radius, opposite_joined_border_width.value());
  344. opposite_joined_border_corner_offset = Gfx::FloatPoint(-midpoint.x(), midpoint.y() - opposite_radius.vertical_radius);
  345. }
  346. Vector<Gfx::FloatPoint, 8> points;
  347. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()));
  348. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) + joined_corner_endpoint_offset);
  349. if (joined_corner_has_inner_corner) {
  350. auto midpoint = compute_midpoint(
  351. radius.horizontal_radius - joined_border_width.value(),
  352. radius.vertical_radius - border_data.width.value(),
  353. joined_border_width.value());
  354. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(midpoint.x(), -(radius.vertical_radius - midpoint.y() - border_data.width.value()));
  355. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) + inner_corner);
  356. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()));
  357. } else {
  358. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(joined_border_width.value() - radius.horizontal_radius, 0);
  359. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) - inner_right_angle_offset);
  360. }
  361. if (opposite_joined_corner_has_inner_corner) {
  362. auto midpoint = compute_midpoint(
  363. opposite_radius.horizontal_radius - opposite_joined_border_width.value(),
  364. opposite_radius.vertical_radius - border_data.width.value(),
  365. opposite_joined_border_width.value());
  366. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(
  367. -midpoint.x(),
  368. -(opposite_radius.vertical_radius - midpoint.y() - border_data.width.value()));
  369. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()));
  370. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + inner_corner);
  371. } else {
  372. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(opposite_joined_border_width.value() - opposite_radius.horizontal_radius, 0);
  373. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + inner_right_angle_offset);
  374. }
  375. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) + opposite_joined_border_corner_offset);
  376. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()));
  377. draw_border(
  378. points,
  379. joined_corner_has_inner_corner,
  380. opposite_joined_corner_has_inner_corner,
  381. Gfx::FloatSize(joined_border_width.value(), border_data.width.value()),
  382. Gfx::FloatSize(opposite_joined_border_width.value(), border_data.width.value()),
  383. last || color != border_color(BorderEdge::Left, borders_data));
  384. break;
  385. }
  386. case BorderEdge::Left: {
  387. auto joined_border_width = borders_data.bottom.width;
  388. auto opposite_joined_border_width = borders_data.top.width;
  389. bool joined_corner_has_inner_corner = border_data.width < radius.horizontal_radius && joined_border_width < radius.vertical_radius;
  390. bool opposite_joined_corner_has_inner_corner = border_data.width < opposite_radius.horizontal_radius && opposite_joined_border_width < opposite_radius.vertical_radius;
  391. Gfx::FloatPoint joined_corner_endpoint_offset;
  392. Gfx::FloatPoint opposite_joined_border_corner_offset;
  393. {
  394. auto midpoint = compute_midpoint(radius.horizontal_radius, radius.vertical_radius, joined_border_width.value());
  395. joined_corner_endpoint_offset = Gfx::FloatPoint(radius.horizontal_radius - midpoint.x(), midpoint.y());
  396. }
  397. {
  398. auto midpoint = compute_midpoint(opposite_radius.horizontal_radius, opposite_radius.vertical_radius, opposite_joined_border_width.value());
  399. opposite_joined_border_corner_offset = Gfx::FloatPoint(opposite_radius.horizontal_radius - midpoint.x(), -midpoint.y());
  400. }
  401. Vector<Gfx::FloatPoint, 8> points;
  402. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()));
  403. points.append(Gfx::FloatPoint(rect.bottom_left().to_type<int>()) + joined_corner_endpoint_offset);
  404. if (joined_corner_has_inner_corner) {
  405. auto midpoint = compute_midpoint(
  406. radius.horizontal_radius - border_data.width.value(),
  407. radius.vertical_radius - joined_border_width.value(),
  408. joined_border_width.value());
  409. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(radius.horizontal_radius - border_data.width.value() - midpoint.x(), midpoint.y());
  410. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) + inner_corner);
  411. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()));
  412. } else {
  413. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(0, joined_border_width.value() - radius.vertical_radius);
  414. points.append(Gfx::FloatPoint(rect.bottom_right().to_type<int>()) - inner_right_angle_offset);
  415. }
  416. if (opposite_joined_corner_has_inner_corner) {
  417. auto midpoint = compute_midpoint(
  418. opposite_radius.horizontal_radius - border_data.width.value(),
  419. opposite_radius.vertical_radius - opposite_joined_border_width.value(),
  420. opposite_joined_border_width.value());
  421. Gfx::FloatPoint inner_corner = Gfx::FloatPoint(
  422. opposite_radius.horizontal_radius - border_data.width.value() - midpoint.x(),
  423. -midpoint.y());
  424. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()));
  425. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) + inner_corner);
  426. } else {
  427. Gfx::FloatPoint inner_right_angle_offset = Gfx::FloatPoint(0, opposite_joined_border_width.value() - opposite_radius.vertical_radius);
  428. points.append(Gfx::FloatPoint(rect.top_right().to_type<int>()) + inner_right_angle_offset);
  429. }
  430. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()) + opposite_joined_border_corner_offset);
  431. points.append(Gfx::FloatPoint(rect.top_left().to_type<int>()));
  432. draw_border(
  433. points,
  434. joined_corner_has_inner_corner,
  435. opposite_joined_corner_has_inner_corner,
  436. Gfx::FloatSize(border_data.width.value(), joined_border_width.value()),
  437. Gfx::FloatSize(border_data.width.value(), opposite_joined_border_width.value()),
  438. last || color != border_color(BorderEdge::Top, borders_data));
  439. break;
  440. }
  441. }
  442. }
  443. void paint_all_borders(Gfx::Painter& painter, DevicePixelRect const& border_rect, CornerRadii const& corner_radii, BordersDataDevicePixels const& borders_data)
  444. {
  445. if (borders_data.top.width <= 0 && borders_data.right.width <= 0 && borders_data.left.width <= 0 && borders_data.bottom.width <= 0)
  446. return;
  447. auto top_left = corner_radii.top_left;
  448. auto top_right = corner_radii.top_right;
  449. auto bottom_right = corner_radii.bottom_right;
  450. auto bottom_left = corner_radii.bottom_left;
  451. // Disable border radii if the corresponding borders don't exist:
  452. if (borders_data.bottom.width <= 0 && borders_data.left.width <= 0)
  453. bottom_left = { 0, 0 };
  454. if (borders_data.bottom.width <= 0 && borders_data.right.width <= 0)
  455. bottom_right = { 0, 0 };
  456. if (borders_data.top.width <= 0 && borders_data.left.width <= 0)
  457. top_left = { 0, 0 };
  458. if (borders_data.top.width <= 0 && borders_data.right.width <= 0)
  459. top_right = { 0, 0 };
  460. DevicePixelRect top_border_rect = {
  461. border_rect.x() + top_left.horizontal_radius,
  462. border_rect.y(),
  463. border_rect.width() - top_left.horizontal_radius - top_right.horizontal_radius,
  464. borders_data.top.width
  465. };
  466. DevicePixelRect right_border_rect = {
  467. border_rect.x() + (border_rect.width() - borders_data.right.width),
  468. border_rect.y() + top_right.vertical_radius,
  469. borders_data.right.width,
  470. border_rect.height() - top_right.vertical_radius - bottom_right.vertical_radius
  471. };
  472. DevicePixelRect bottom_border_rect = {
  473. border_rect.x() + bottom_left.horizontal_radius,
  474. border_rect.y() + (border_rect.height() - borders_data.bottom.width),
  475. border_rect.width() - bottom_left.horizontal_radius - bottom_right.horizontal_radius,
  476. borders_data.bottom.width
  477. };
  478. DevicePixelRect left_border_rect = {
  479. border_rect.x(),
  480. border_rect.y() + top_left.vertical_radius,
  481. borders_data.left.width,
  482. border_rect.height() - top_left.vertical_radius - bottom_left.vertical_radius
  483. };
  484. AK::CircularQueue<BorderEdge, 4> borders;
  485. borders.enqueue(BorderEdge::Top);
  486. borders.enqueue(BorderEdge::Right);
  487. borders.enqueue(BorderEdge::Bottom);
  488. borders.enqueue(BorderEdge::Left);
  489. // Try to find the first border that has a different color than the previous one,
  490. // then start painting from that border.
  491. for (size_t i = 0; i < borders.size(); i++) {
  492. if (border_color(borders.at(0), borders_data) != border_color(borders.at(1), borders_data)) {
  493. borders.enqueue(borders.dequeue());
  494. break;
  495. }
  496. borders.enqueue(borders.dequeue());
  497. }
  498. Gfx::Path path;
  499. for (BorderEdge edge : borders) {
  500. switch (edge) {
  501. case BorderEdge::Top:
  502. paint_border(painter, BorderEdge::Top, top_border_rect, top_left, top_right, borders_data, path, edge == borders.last());
  503. break;
  504. case BorderEdge::Right:
  505. paint_border(painter, BorderEdge::Right, right_border_rect, top_right, bottom_right, borders_data, path, edge == borders.last());
  506. break;
  507. case BorderEdge::Bottom:
  508. paint_border(painter, BorderEdge::Bottom, bottom_border_rect, bottom_right, bottom_left, borders_data, path, edge == borders.last());
  509. break;
  510. case BorderEdge::Left:
  511. paint_border(painter, BorderEdge::Left, left_border_rect, bottom_left, top_left, borders_data, path, edge == borders.last());
  512. break;
  513. default:
  514. VERIFY_NOT_REACHED();
  515. }
  516. }
  517. }
  518. Optional<BordersData> borders_data_for_outline(Layout::Node const& layout_node, Color outline_color, CSS::OutlineStyle outline_style, CSSPixels outline_width)
  519. {
  520. CSS::LineStyle line_style;
  521. if (outline_style == CSS::OutlineStyle::Auto) {
  522. // `auto` lets us do whatever we want for the outline. 2px of the link colour seems reasonable.
  523. line_style = CSS::LineStyle::Dotted;
  524. outline_color = layout_node.document().link_color();
  525. outline_width = 2;
  526. } else {
  527. line_style = CSS::value_id_to_line_style(CSS::to_value_id(outline_style)).value_or(CSS::LineStyle::None);
  528. }
  529. if (outline_color.alpha() == 0 || line_style == CSS::LineStyle::None || outline_width == 0)
  530. return {};
  531. CSS::BorderData border_data {
  532. .color = outline_color,
  533. .line_style = line_style,
  534. .width = outline_width,
  535. };
  536. return BordersData { border_data, border_data, border_data, border_data };
  537. }
  538. }