refacto(code-highlighter): Refactor plugin code and css style

Author: jeanjerome

_plugins/highlight-linedivs.rb

@@ -6,32 +6,27 @@ module Formatters
     class HTMLLegacy < Formatter
       tag 'html_legacy'
 
-      # @option opts [String] :css_class ('highlight')
-      # @option opts [true/false] :line_numbers (false)
-      # @option opts [true/false] :linewise (false)
-      # @option opts [RougeLines::CSSTheme] :inline_theme (nil)
-      # @option opts [true/false] :wrap (true)
-      #
-      # Initialize with options.
-      #
-      # If `:inline_theme` is given, then instead of rendering the
-      # tokens as <span> tags with CSS classes, the styles according to
-      # the given theme will be inlined in "style" attributes.  This is
-      # useful for formats in which stylesheets are not available.
-      #
-      # Content will be wrapped in a tag (`div` if tableized, `pre` if
-      # not) with the given `:css_class` unless `:wrap` is set to `false`.
-      def initialize(opts={})
-        @formatter = opts[:inline_theme] ? HTMLInline.new(opts[:inline_theme])
-                     : HTML.new
-
-        @formatter = HTMLLinewise.new(@formatter, opts) if opts[:linewise]
-
-        @formatter = HTMLTable.new(@formatter, opts) if opts[:line_numbers]
-
-        if opts.fetch(:wrap, true)
-          @formatter = HTMLPygments.new(@formatter, opts.fetch(:css_class, 'codehilite'))
-        end
+      DEFAULT_OPTS = {
+        css_class: 'highlight',
+        line_numbers: false,
+        linewise: false,
+        inline_theme: nil,
+        wrap: true
+      }
+
+      def initialize(opts = {})
+        opts = DEFAULT_OPTS.merge(opts)
+        @formatter = select_formatter(opts)
+      end
+
+      private
+
+      def select_formatter(opts)
+        formatter = opts[:inline_theme] ? HTMLInline.new(opts[:inline_theme]) : HTML.new
+        formatter = HTMLLinewise.new(formatter, opts) if opts[:linewise]
+        formatter = HTMLTable.new(formatter, opts) if opts[:line_numbers]
+        formatter = HTMLPygments.new(formatter, opts.fetch(:css_class, 'codehilite')) if opts.fetch(:wrap, true)
+        formatter
       end
     end
   end
@@ -42,98 +37,53 @@ module Tags
     class HighlightBlock < Liquid::Block
       include Liquid::StandardFilters
 
+      OPTIONS_REGEX = %r!(?:\w="[^"]*"|\w=\w|\w)+!
+      SYNTAX = %r!^([a-zA-Z0-9_+-]+)\s*(\S.*)?$!
+
       def initialize(tag_name, markup, tokens)
         super
         if markup.strip =~ SYNTAX
           @lang = Regexp.last_match(1).downcase
-          @highlight_options = parse_options(Regexp.last_match(2))
+          @highlight_options = parse_options(Regexp.last_match(2) || "")
         else
-          raise SyntaxError, <<-MSG
-Syntax Error in tag 'highlight' while parsing the following markup:
-
-  #{markup}
-
-Valid syntax: highlight <lang> [linenos] [linedivs]
-MSG
+          raise SyntaxError, "Syntax Error in tag 'highlight' while parsing: #{markup.strip}. Valid syntax: highlight <lang> [linenos] [linedivs]"
         end
       end
 
       def render(context)
-        prefix = " " \
-"
-<div class=\"code-container\">
-    <div class=\"code-window\">
-        <div class=\"window-header\">
-            <div class=\"window-controls\">
-                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\">
-                    <g fill=\"none\" fillRule=\"evenodd\" transform=\"translate(1 1)\">
-                        <circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#EC6A5E\" stroke=\"#EC6A5E\" strokeWidth=\".5\" />
-                        <circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#F4BF4F\" stroke=\"#F4BF4F\" strokeWidth=\".5\" />
-                        <circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#61C554\" stroke=\"#61C554\" strokeWidth=\".5\" />
-                    </g>
-                </svg>
-            </div>
-            <div class=\"window-copy\">
-                <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"window-copy-icon\" height=\"24\" width=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"1.5\">
-                  <path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"></path>
-                  <path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"></path>
-                </svg>
-            </div>
-        </div>
-"
-        suffix = " " \
-"
-        <div class=\"code-label\">
-            #{@lang.capitalize}
-        </div>
-    </div>
-</div>
-"
-        code = super.to_s.gsub(%r!\A(\n|\r)+|(\n|\r)+\z!, "")
-
+        code = super.to_s.strip
         is_safe = !!context.registers[:site].safe
 
-        output =
-          case context.registers[:site].highlighter
-          when "pygments"
-            render_pygments(code, is_safe)
-          when "rouge"
-            render_rouge(code)
-          else
-            render_codehighlighter(code)
-          end
+        output = case context.registers[:site].highlighter
+                 when "pygments"
+                   render_pygments(code, is_safe)
+                 when "rouge"
+                   render_rouge(code)
+                 else
+                   render_codehighlighter(code)
+                 end
 
         rendered_output = add_code_tag(output)
-        prefix + rendered_output + suffix
+        "#{prefix_html}#{rendered_output}#{suffix_html}"
       end
 
       def sanitized_opts(opts, is_safe)
         if is_safe
-          Hash[[
-                 [:startinline, opts.fetch(:startinline, nil)],
-                 [:hl_lines,    opts.fetch(:hl_lines, nil)],
-                 [:linenos,     opts.fetch(:linenos, nil)],
-                 [:linedivs,    opts.fetch(:linedivs, nil)],
-                 [:encoding,    opts.fetch(:encoding, "utf-8")],
-                 [:cssclass,    opts.fetch(:cssclass, nil)],
-               ].reject { |f| f.last.nil? }]
+          opts.slice(:startinline, :hl_lines, :linenos, :linedivs, :encoding, :cssclass).compact
         else
           opts
         end
       end
 
-      private 
-
-      OPTIONS_REGEX = %r!(?:\w="[^"]*"|\w=\w|\w)+!
+      private
 
       def parse_options(input)
         options = {}
         return options if input.empty?
 
-        # Split along 3 possible forms -- key="<quoted list>", key=value, or key
         input.scan(OPTIONS_REGEX) do |opt|
-          key, value = opt.split("=")
-          # If a quoted list, convert to array
+          key, value = opt.split("=", 2)
+          # Si la valeur est une chaîne entre guillemets
           if value && value.include?('"')
             value.delete!('"')
             value = value.split
@@ -147,16 +97,54 @@ def parse_options(input)
 
       def render_rouge(code)
         formatter = ::Rouge::Formatters::HTMLLegacy.new(
-          :line_numbers => @highlight_options[:linenos],
-          :linewise     => @highlight_options[:linedivs],
-          :wrap         => false,
-          :css_class    => "highlight",
-          :gutter_class => "gutter",
-          :code_class   => "code"
+          line_numbers: @highlight_options[:linenos],
+          linewise: @highlight_options[:linedivs],
+          wrap: false,
+          css_class: "highlight",
+          gutter_class: "gutter",
+          code_class: "code"
         )
-        lexer = ::Rouge::Lexer.find_fancy(@lang, code) || Rouge::Lexers::PlainText
+        lexer = ::Rouge::Lexer.find_fancy(@lang, code)
+        unless lexer
+          lexer = Rouge::Lexers::PlainText
+          puts "Warning: Language '#{@lang}' not found. Defaulting to plain text."
+        end
         formatter.format(lexer.lex(code))
       end
+
+      def prefix_html
+        <<~HTML
+          <div class="code-container">
+              <div class="code-window">
+                  <div class="window-header">
+                      <div class="window-controls">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="54" height="14" viewBox="0 0 54 14">
+                              <g fill="none" fill-rule="evenodd" transform="translate(1 1)">
+                                  <circle cx="6" cy="6" r="6" fill="#EC6A5E" stroke="#EC6A5E" stroke-width=".5" />
+                                  <circle cx="26" cy="6" r="6" fill="#F4BF4F" stroke="#F4BF4F" stroke-width=".5" />
+                                  <circle cx="46" cy="6" r="6" fill="#61C554" stroke="#61C554" stroke-width=".5" />
+                              </g>
+                          </svg>
+                      </div>
+                      <div class="window-copy">
+                          <svg xmlns="http://www.w3.org/2000/svg" class="window-copy-icon" height="24" width="24" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+                            <path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"></path>
+                            <path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"></path>
+                          </svg>
+                      </div>
+                  </div>
+        HTML
+      end
+
+      def suffix_html
+        <<~HTML
+                  <div class="code-label">
+                      #{@lang.capitalize}
+                  </div>
+              </div>
+          </div>
+        HTML
+      end
     end
   end
 end

_posts/2021-03-16-installer-java-sdkman.markdown

@@ -63,24 +63,28 @@ correctement sur votre système. Voici les instructions détaillées pour instal
 
 ### Installation sur macOS et Linux:
 
-1. Ouvrez votre terminal.
+- **Étape 1** : Ouvrez votre terminal.
 
-2. Exécutez la commande suivante pour télécharger le script d'installation de SDKMAN :
-   {% highlight shell %}curl -s "https://get.sdkman.io" | bash{% endhighlight %}
+- **Étape 2** : Exécutez la commande suivante pour télécharger le script d'installation de SDKMAN :
+{% highlight shell %}curl -s "https://get.sdkman.io" | bash{% endhighlight %}
 
-3. Attendez que le téléchargement et l'installation du script soient terminés.
+- **Étape 3** : Attendez que le téléchargement et l'installation du script soient terminés.
 
-4. Après l'installation :
+- **Étape 4** : Après l'installation :
    - Lancez un nouveau terminal
    - Ou exécutez la commande suivante pour charger SDKMAN dans votre session en cours :
-     {% highlight shell %}source "$HOME/.sdkman/bin/sdkman-init.sh"{% endhighlight %}
+{% highlight shell %}
+source "$HOME/.sdkman/bin/sdkman-init.sh"
+{% endhighlight %}
 
-5. Pour vérifier si SDKMAN a été installé avec succès, tapez la commande suivante :
-   {% highlight shell %}sdk version{% endhighlight %}
+- **Étape 5** : Pour vérifier si SDKMAN a été installé avec succès, tapez la commande suivante :
+{% highlight shell %}
+sdk version
+{% endhighlight %}
 
-6. Vous devriez voir :
+Vous devriez voir :
 
-{% highlight shell %}
+{% highlight output %}
 SDKMAN!
 script: 5.18.2
 native: 0.4.2
@@ -120,7 +124,9 @@ Il faut donc déjà choisir le SDK (candidate) à installer.
 #### Candidate
 
 Pour voir la liste des SDK/candidate, lancez la commande suivante :
-{% highlight zsh %}% sdk list {% endhighlight %}
+{% highlight shell %}
+sdk list
+{% endhighlight %}
 
 > info "Note"
 > Tapez `q` pour sortir de la liste
@@ -142,7 +148,9 @@ Vous voyez qu'il est possible d'installer pas mal de choses. Pour n'en citer que
 Bon, le candidat qui nous intéresse, c'est `Java`. Voyons à présent les versions que nous propose SDKMAN.
 
 Pour cela, interrogeons SDKMAN :
-{% highlight zsh %}% sdk list java{% endhighlight %}
+{% highlight shell %}
+sdk list java
+{% endhighlight %}
 
 Voici la liste que j'obtiens :
 
@@ -296,7 +304,9 @@ de code Java natif, je choisis `GraalVM CE` version `20.0.2` et je sélectionne
 
 Maintenant, c'est à votre tour. Pour l'installer, j'exécute la commande suivante :
 
-{% highlight zsh %} % sdk install java 20.0.2-graalce{% endhighlight %}
+{% highlight shell %}
+sdk install java 20.0.2-graalce
+{% endhighlight %}
 
 Cela lancera le processus d'installation, et la sortie sera :
 
@@ -323,9 +333,12 @@ nous avons installé cet outil, pour pouvoir installer plusieurs JDKs.
 
 Pour ma part, j'en installe deux autres :
 
-{% highlight zsh %}
-% sdk install java 21.fx-librca
-% sdk install java 23.r20-nik
+{% highlight shell %}
+sdk install java 21.fx-librca
+{% endhighlight %}
+
+{% highlight shell %}
+sdk install java 23.r20-nik
 {% endhighlight %}
 
 <hr class="hr-text" data-content="Choix du JDK">
@@ -339,14 +352,14 @@ Voyons à présent comment sélectionner une version spécifique de Java.
 
 Voyons ce que nous dit la commande `sdk` :
 
-{% highlight zsh %}
+{% highlight output %}
 % sdk current java
 Using java version 20.0.2-graalce
 {% endhighlight %}
 
 Et voyons ce que nous dit `java` :
 
-{% highlight zsh %}
+{% highlight output %}
 % java --version               
 openjdk 20.0.2 2023-07-18
 OpenJDK Runtime Environment GraalVM CE 20.0.2+9.1 (build 20.0.2+9-jvmci-23.0-b15)
@@ -356,21 +369,21 @@ OpenJDK 64-Bit Server VM GraalVM CE 20.0.2+9.1 (build 20.0.2+9-jvmci-23.0-b15, m
 
 ### Affichons les versions installées
 
-{% highlight output %}
-% sdk list java
+{% highlight shell %}
+sdk list java
 {% endhighlight %}
 
 ### Changeons de version
 
-{% highlight zsh %}
+{% highlight output %}
 % sdk use java 21.fx-librca
 
 Using java version 21.fx-librca in this shell.
 {% endhighlight %}
 
 Puis vérifions avec Java
 
-{% highlight zsh %}
+{% highlight output %}
 % java --version
 
 openjdk 21 2023-09-19 LTS