defmodule RaxolWeb.UIComponentView do use RaxolWeb, :view @moduledoc """ A view for rendering UI components in the web interface. This module provides functions for rendering various UI components including charts, visualizations, and other interactive elements that can be displayed in web templates. """ alias Raxol.Plugins.Visualization.ChartRenderer alias Raxol.Core.Metrics.Visualizer @color_map %{ black: "#000000", red: "#ff0000", green: "#00ff00", yellow: "#ffff00", blue: "#0000ff", magenta: "#ff00ff", cyan: "#00ffff", white: "#ffffff", dark_gray: "#404040" } @doc """ Renders a chart component for web display. ## Parameters * `chart_data` - The data to display in the chart * `opts` - Chart options including type, title, dimensions, etc. ## Options * `:type` - Chart type (:bar, :line, :sparkline) * `:title` - Chart title * `:width` - Chart width in pixels * `:height` - Chart height in pixels * `:series` - List of data series * `:show_axes` - Whether to show axes (default: true) * `:show_labels` - Whether to show labels (default: true) * `:show_legend` - Whether to show legend (default: true) * `:orientation` - Chart orientation (:vertical, :horizontal) * `:style` - Additional styling options ## Returns HTML-safe string containing the chart markup """ def render_chart(chart_data, opts \\ []) do chart_opts = build_chart_options(chart_data, opts) generate_chart_html(chart_opts[:title], chart_opts, opts) end @doc """ Renders a metrics visualization chart. ## Parameters * `metrics` - Metrics data to visualize * `chart_type` - Type of chart (:line, :bar, :gauge, :histogram) * `opts` - Additional options for the visualization ## Returns HTML-safe string containing the metrics chart markup """ def render_metrics_chart(metrics, chart_type \\ :line, opts \\ []) do title = Keyword.get(opts, :title, "Metrics Visualization") width = Keyword.get(opts, :width, 600) height = Keyword.get(opts, :height, 400) chart_options = %{ type: chart_type, title: title, width: width, height: height, color: Keyword.get(opts, :color, "#4A90E2"), show_legend: Keyword.get(opts, :show_legend, true), show_grid: Keyword.get(opts, :show_grid, true), time_range: Keyword.get(opts, :time_range) } case Visualizer.create_chart(metrics, chart_options) do {:ok, _chart_id, chart_data} -> generate_metrics_chart_html(chart_data, chart_options) {:error, reason} -> generate_error_html( "Failed to create metrics chart: #{inspect(reason)}" ) end end @doc """ Renders a simple bar chart using terminal-style rendering. ## Parameters * `data` - List of {label, value} tuples or maps with :label and :value keys * `opts` - Chart options ## Returns HTML-safe string containing the terminal-style chart markup """ def render_terminal_chart(data, opts \\ []) do title = Keyword.get(opts, :title, "Chart") width = Keyword.get(opts, :width, 80) height = Keyword.get(opts, :height, 24) bounds = %{width: width, height: height} chart_opts = %{title: title} # Use the terminal chart renderer rendered_chart = ChartRenderer.render_chart_content(data, chart_opts, bounds, %{}) # Convert terminal cells to HTML convert_terminal_chart_to_html(rendered_chart, title, opts) end @doc """ Renders a dashboard widget container. ## Parameters * `widget_data` - Widget configuration and data * `opts` - Rendering options ## Returns HTML-safe string containing the widget markup """ def render_widget(widget_data, opts \\ []) do widget_type = Map.get(widget_data, :type, :info) render_widget_by_type(widget_type, widget_data, opts) end # Private helper functions defp build_chart_options(chart_data, opts) do series = prepare_chart_series(chart_data, opts) [ type: Keyword.get(opts, :type, :bar), series: series, width: Keyword.get(opts, :width, 400), height: Keyword.get(opts, :height, 300), show_axes: Keyword.get(opts, :show_axes, true), show_labels: Keyword.get(opts, :show_labels, true), show_legend: Keyword.get(opts, :show_legend, true), orientation: Keyword.get(opts, :orientation, :vertical), style: Keyword.get(opts, :style, []) ] end defp prepare_chart_series(chart_data, opts) do case chart_data do data when is_list(data) -> # Handle list of {label, value} tuples [ %{ name: Keyword.get(opts, :series_name, "Data"), data: Enum.map(data, fn {_label, value} -> value end), color: Keyword.get(opts, :color, :blue) } ] %{series: series} when is_list(series) -> # Handle pre-formatted series data series _ -> # Default empty series [] end end defp generate_chart_html(title, chart_opts, _opts) do chart_id = generate_chart_id() # Create canvas element for the chart canvas_html = """ """ # Create container with title """