<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: andac</title>
    <description>The latest articles on DEV Community by andac (@andaccc).</description>
    <link>https://dev.to/andaccc</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1257018%2F0072328c-1a20-420a-b5bc-a7373d2769a0.jpeg</url>
      <title>DEV Community: andac</title>
      <link>https://dev.to/andaccc</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/andaccc"/>
    <language>en</language>
    <item>
      <title>Bridging Gazebo Harmonic and Ros Iron</title>
      <dc:creator>andac</dc:creator>
      <pubDate>Thu, 14 Mar 2024 01:08:15 +0000</pubDate>
      <link>https://dev.to/andaccc/bridging-gazebo-harmonic-and-ros-iron-41h7</link>
      <guid>https://dev.to/andaccc/bridging-gazebo-harmonic-and-ros-iron-41h7</guid>
      <description>&lt;h2&gt;
  
  
  Environment
&lt;/h2&gt;

&lt;p&gt;Gazebo Harmonic&lt;/p&gt;

&lt;p&gt;Ros Iron (ros2)&lt;/p&gt;

&lt;h3&gt;
  
  
  Install Gazebo
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://gazebosim.org/docs/harmonic/install_ubuntu" rel="noopener noreferrer"&gt;https://gazebosim.org/docs/harmonic/install_ubuntu&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;sudo &lt;/span&gt;apt-get update
&lt;span class="nb"&gt;sudo &lt;/span&gt;apt-get &lt;span class="nb"&gt;install &lt;/span&gt;lsb-release wget gnupg

&lt;span class="nb"&gt;sudo &lt;/span&gt;wget https://packages.osrfoundation.org/gazebo.gpg &lt;span class="nt"&gt;-O&lt;/span&gt; /usr/share/keyrings/pkgs-osrf-archive-keyring.gpg
&lt;span class="nb"&gt;echo&lt;/span&gt; &lt;span class="s2"&gt;"deb [arch=&lt;/span&gt;&lt;span class="si"&gt;$(&lt;/span&gt;dpkg &lt;span class="nt"&gt;--print-architecture&lt;/span&gt;&lt;span class="si"&gt;)&lt;/span&gt;&lt;span class="s2"&gt; signed-by=/usr/share/keyrings/pkgs-osrf-archive-keyring.gpg] http://packages.osrfoundation.org/gazebo/ubuntu-stable &lt;/span&gt;&lt;span class="si"&gt;$(&lt;/span&gt;lsb_release &lt;span class="nt"&gt;-cs&lt;/span&gt;&lt;span class="si"&gt;)&lt;/span&gt;&lt;span class="s2"&gt; main"&lt;/span&gt; | &lt;span class="nb"&gt;sudo tee&lt;/span&gt; /etc/apt/sources.list.d/gazebo-stable.list &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; /dev/null
&lt;span class="nb"&gt;sudo &lt;/span&gt;apt-get update
&lt;span class="nb"&gt;sudo &lt;/span&gt;apt-get &lt;span class="nb"&gt;install &lt;/span&gt;gz-harmonic
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Run Gazebo
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://gazebosim.org/docs" rel="noopener noreferrer"&gt;https://gazebosim.org/docs&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# Start gazebo sim&lt;/span&gt;
gz sim &lt;span class="nt"&gt;-v&lt;/span&gt; 4 &lt;span class="nt"&gt;-r&lt;/span&gt; visualize_lidar.sdf

&lt;span class="c"&gt;# Test control&lt;/span&gt;
gz topic &lt;span class="nt"&gt;-e&lt;/span&gt; &lt;span class="nt"&gt;-t&lt;/span&gt; /model/vehicle_blue/cmd_vel

gz topic &lt;span class="nt"&gt;-t&lt;/span&gt; /model/vehicle_blue/cmd_vel &lt;span class="nt"&gt;-m&lt;/span&gt; gz.msgs.Twist &lt;span class="nt"&gt;-p&lt;/span&gt; &lt;span class="s2"&gt;"linear: { x: 0.1 }”
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2F0cb81ed4-a6cf-45a1-af4e-d39f27bf0b26" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2F0cb81ed4-a6cf-45a1-af4e-d39f27bf0b26" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Install Ros gz bridge
&lt;/h3&gt;

&lt;p&gt;ros topic: &lt;code&gt;/model/vehicle_blue/cmd_vel&lt;/code&gt;, Type &lt;code&gt;geometry_msgs/msg/Twist&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;to &lt;/p&gt;

&lt;p&gt;gz topic: &lt;code&gt;/model/vehicle_blue/cmd_vel&lt;/code&gt;, Type &lt;code&gt;gz.msgs.Twist&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;sudo &lt;/span&gt;apt &lt;span class="nb"&gt;install &lt;/span&gt;ros-iron-ros-gzharmonic-bridge

ros2 run ros_gz_bridge parameter_bridge /model/vehicle_blue/cmd_vel@geometry_msgs/msg/Twist]gz.msgs.Twist

&lt;span class="c"&gt;# Test&lt;/span&gt;
ros2 topic pub /model/vehicle_blue/cmd_vel geometry_msgs/Twist &lt;span class="s2"&gt;"linear: { x: 0.1 }”
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Install keyboard control
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;sudo &lt;/span&gt;apt &lt;span class="nb"&gt;install &lt;/span&gt;ros-iron-teleop-twist-keyboard

ros2 run teleop_twist_keyboard teleop_twist_keyboard &lt;span class="nt"&gt;--ros-args&lt;/span&gt; &lt;span class="nt"&gt;-r&lt;/span&gt; /cmd_vel:&lt;span class="o"&gt;=&lt;/span&gt;/model/vehicle_blue/cmd_vel
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Rviz
&lt;/h3&gt;

&lt;p&gt;Lidar Data&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;ros2 run ros_gz_bridge parameter_bridge /lidar2@sensor_msgs/msg/LaserScan[gz.msgs.LaserScan &lt;span class="nt"&gt;--ros-args&lt;/span&gt; &lt;span class="nt"&gt;-r&lt;/span&gt; /lidar2:&lt;span class="o"&gt;=&lt;/span&gt;/laser_scan
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;tf&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;ros2 run ros_gz_bridge parameter_bridge /model/vehicle_blue/tf@tf2_msgs/msg/TFMessage[gz.msgs.Pose_V &lt;span class="nt"&gt;--ros-args&lt;/span&gt; &lt;span class="nt"&gt;-r&lt;/span&gt; /model/vehicle_blue/tf:&lt;span class="o"&gt;=&lt;/span&gt;/tf
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Start rviz&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;rviz2
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;Global Options&lt;/code&gt; -&amp;gt; &lt;code&gt;Fixed Frame&lt;/code&gt; to &lt;code&gt;vehicle_blue/lidar_link/gpu_lidar&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2F8473ff28-2267-4793-ac8d-5cd6976650ee" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2F8473ff28-2267-4793-ac8d-5cd6976650ee" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2Fff96b40c-7adf-4e8f-93db-3e599f624837" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fandaccc%2Ftech-roadmap%2Fassets%2F8611553%2Fff96b40c-7adf-4e8f-93db-3e599f624837" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h1&gt;
  
  
  Reference
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://docs.ros.org/en/iron/Tutorials/Advanced/Simulators/Gazebo/Gazebo.html" rel="noopener noreferrer"&gt;https://docs.ros.org/en/iron/Tutorials/Advanced/Simulators/Gazebo/Gazebo.html&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Setting up OpenGL dev environment in Window</title>
      <dc:creator>andac</dc:creator>
      <pubDate>Sun, 03 Mar 2024 14:00:00 +0000</pubDate>
      <link>https://dev.to/andaccc/setting-up-opengl-dev-environment-in-window-3270</link>
      <guid>https://dev.to/andaccc/setting-up-opengl-dev-environment-in-window-3270</guid>
      <description>&lt;p&gt;Recently I have been interested in graphic programming. I read a few tutorials and have found opengl is where I should start.&lt;/p&gt;

&lt;p&gt;So I start setting up the opengl dev environment, but its not easy since I am using window (and vscode)...&lt;/p&gt;

&lt;h1&gt;
  
  
  Preparation
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;GLFW

&lt;ul&gt;
&lt;li&gt;Precompiled&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.glfw.org/download.html"&gt;https://www.glfw.org/download.html&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;GLAD

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://glad.dav1d.de/"&gt;https://glad.dav1d.de/&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;Vscode C++

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://code.visualstudio.com/docs/cpp/config-mingw#_prerequisites"&gt;https://code.visualstudio.com/docs/cpp/config-mingw#_prerequisites&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;Compiler: MinGW-w64 via MSYS2

&lt;ul&gt;
&lt;li&gt;&lt;code&gt;pacman -S --needed base-devel mingw-w64-ucrt-x86_64-toolchain&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;C/C++ Extension&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://medium.com/@vivekjha92/setup-opengl-with-vs-code-82852c653c43"&gt;&lt;/a&gt;&lt;a href="https://medium.com/@vivekjha92/setup-opengl-with-vs-code-82852c653c43"&gt;https://medium.com/@vivekjha92/setup-opengl-with-vs-code-82852c653c43&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Restart Vscode&lt;/strong&gt; if needed&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  Setting up
&lt;/h1&gt;

&lt;h3&gt;
  
  
  glfw lib
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://www.glfw.org/docs/latest/build_guide.html#build_link_mingw"&gt;https://www.glfw.org/docs/latest/build_guide.html#build_link_mingw&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Static (I am using this)

&lt;ul&gt;
&lt;li&gt;libglfw3.a&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;For DLL version

&lt;ul&gt;
&lt;li&gt;add &lt;code&gt;#define GLFW_DLL&lt;/code&gt; in the first line of code&lt;/li&gt;
&lt;li&gt;use the libglfw3dll.a one in lib&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  vscode task.json arg
&lt;/h3&gt;

&lt;p&gt;Make sure the flag order is correct&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="nl"&gt;"args"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-fdiagnostics-color=always"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-g"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"${file}"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-o"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"${fileDirname}&lt;/span&gt;&lt;span class="se"&gt;\\&lt;/span&gt;&lt;span class="s2"&gt;${fileBasenameNoExtension}.exe"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"src/glad.c"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-I./include"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-L./lib"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-lglfw3"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
        &lt;/span&gt;&lt;span class="s2"&gt;"-lgdi32"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="w"&gt;
      &lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  file structure
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgx56tt8dm2b2zsxfa0g9.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgx56tt8dm2b2zsxfa0g9.png" alt="Image description" width="249" height="412"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;p&gt;Now I think I can start learning opengl :)&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwpagjwovobrg6mlrlnoa.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwpagjwovobrg6mlrlnoa.png" alt="Image description" width="800" height="436"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Here some problems I encountered when figuring how to setup the environment&lt;/p&gt;

&lt;h3&gt;
  
  
  lglfw3 not found
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;make sure the file structure is correct&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  "undefined reference to `glfwTerminate'"
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;linker problem&lt;/li&gt;
&lt;li&gt;so make sure the compiler flag and order are correct&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  std::cout not working after adding glfw related functions
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;probably linker problem also&lt;/li&gt;
&lt;li&gt;check the compiler flag and file structure are all correct&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  Ref
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://learnopengl.com/"&gt;https://learnopengl.com/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://stackoverflow.com/questions/22623087/undefined-reference-errors-when-linking-glfw-on-mingw"&gt;https://stackoverflow.com/questions/22623087/undefined-reference-errors-when-linking-glfw-on-mingw&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Combo Memo WIP: Part 2 - Data Structure (Combo notation)</title>
      <dc:creator>andac</dc:creator>
      <pubDate>Sun, 28 Jan 2024 11:23:12 +0000</pubDate>
      <link>https://dev.to/andaccc/combo-memo-wip-part-2-data-structure-combo-notation-1g5b</link>
      <guid>https://dev.to/andaccc/combo-memo-wip-part-2-data-structure-combo-notation-1g5b</guid>
      <description>&lt;p&gt;After defining the scope of the project, the next step is to design the implementation and data structure.&lt;/p&gt;

&lt;h1&gt;
  
  
  Data Structure
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ft02aef8vy7vl7cgux62i.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ft02aef8vy7vl7cgux62i.png" alt="Image description" width="147" height="802"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mermaid.live/edit#pako:eNqtUl1PwjAU_SvNfR6kjNmxviEu6gNiEH0wS0xd62h07dJ1iTj23y0bhBmI8cH70vtx7jmnaWtINRdAQZgryTLD8kQhF9fTeYy228FgW6PZzXQ5na3iJaJozcoeoO7yXZTWSJUhxXLRNZvuOC4f2Bbzy0Wf6Yj4C127_Ruw1-SiTI0srNTqZJZqxeXPiVQWcZaz7Jzk3v188RT3zbf1_9tpeux75du7-8dVX7prnGq_VtZq9XLWgt0Uh8uBB7kwOZPcvX7LkoBdC7cE1KWcmfcEErXDscrqh41KgVpTCQ-qgjMr9v8F6Bv7KF23YOpZ6_wAciXQGj6BjqNoSAgOg8kkCkc4IKEHG6CjYeAHIz8Yh3iCfUz8xoOvlgAPowgTEl6Mw4C4Lew33-eLxnY"&gt;mermaid graph&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Game&lt;/strong&gt; &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;GGST, SF6, Tekken&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Character&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ram, Sol, Ky, May&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Combo&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;combos for each character&lt;/li&gt;
&lt;li&gt;&lt;code&gt;f.S &amp;gt; 214P &amp;gt; 214P &amp;gt; dc &amp;gt; 623P&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Move&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Chaining moves in a combo
&lt;code&gt;214 P&lt;/code&gt;, &lt;code&gt;236236 HS&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Input&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Individual input&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;2&lt;/code&gt;, &lt;code&gt;214&lt;/code&gt;, &lt;code&gt;P&lt;/code&gt;, &lt;code&gt;D&lt;/code&gt;, &lt;code&gt;RC&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;I define input types &lt;code&gt;directional&lt;/code&gt; and &lt;code&gt;action&lt;/code&gt; here&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  Combo Notation
&lt;/h1&gt;

&lt;p&gt;Combo notation is more complicated than I thought &lt;br&gt;
&lt;code&gt;c.S &amp;gt; 2H &amp;gt; 623P, c.S &amp;gt; jc, j.K &amp;gt; j.214S&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;You first have basic directional input and attack buttons&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Down, Front, Back, etc... which = to 123456789 &lt;/li&gt;
&lt;li&gt;Attacks, and special mechanics, depending on the games

&lt;ul&gt;
&lt;li&gt;P, K, HS, RC, ...&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And then you have moves like dragon punch, quarter circle...&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;216, 236, ...&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;referring to dustloop, it also has different onditions&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;far, close&lt;/li&gt;
&lt;li&gt;Charge&lt;/li&gt;
&lt;li&gt;Delay&lt;/li&gt;
&lt;li&gt;Cancel
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;gt; = Proceed from the previous move to the following move.
▷/land = Indicate that the player must land at that point in the sequence.
, = Link the previous move into the following move.
-&amp;gt;/~ = Cancel the previous special into a follow-up special.
dl./delay = Delay the following move.
whiff/(whiff) = The move must whiff (not hit).
c. = Close
f. = Far
j. = Jumping/Aerial
hj./sj. = High Jump/Super Jump
jc = Jump Cancel
hjc/sjc = High Jump Cancel/Super Jump Cancel
dc/adc = Dash Cancel/Air Dash Cancel
CH = Counter Hit
AA = Anti-Air
IAS = Instant Air Special
[X] = Hold input.
]X[ = Release input.
(move) = Move is optional.
[X] or [Y] = Perform sequence X or Y.
[sequence] xN = Repeat sequence N amount of times.
(N) = Hit N of a move or move must deal N amount of hits.
IAD = Instant Air Dash
BRC = Blue Roman Cancel
RRC = Red Roman Cancel
PRC = Purple Roman Cancel
YRC = Yellow Roman Cancel
YYXRC = Dash Input X Roman Cancel in Y direction i.e: 22PRC
XRC~Q = Cancel the X Roman Cancel into Q i.e: RRC~5K
WS = Wall Stick/Wall Splat
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h1&gt;
  
  
  Implementation
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbob08129jmozqp3v2sky.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbob08129jmozqp3v2sky.png" alt="Image description" width="748" height="775"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I decided to work on the combo string interpretation first and input class. &lt;/p&gt;

&lt;p&gt;&lt;code&gt;c.S &amp;gt; 2H &amp;gt; 623P, c.S &amp;gt; jc, j.K &amp;gt; j.214S&lt;/code&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Parse Steps
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Split the combo by &lt;code&gt;&amp;gt;&lt;/code&gt; &lt;/li&gt;
&lt;li&gt;Separate directional and moves input 

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;216P&lt;/code&gt; -&amp;gt; &lt;code&gt;216&lt;/code&gt; + &lt;code&gt;P&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;Map each Input and render the icon&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Difficulties
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;How to handle &lt;code&gt;216216HS&lt;/code&gt; -&amp;gt; &lt;code&gt;216&lt;/code&gt; + &lt;code&gt;216&lt;/code&gt; + &lt;code&gt;HS&lt;/code&gt;

&lt;ul&gt;
&lt;li&gt;As there are two directional Inputs&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;j.S&lt;/code&gt;, &lt;code&gt;c.S&lt;/code&gt;, &lt;code&gt;f.S&lt;/code&gt;

&lt;ul&gt;
&lt;li&gt;Input has conditions, jump, close, far&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  TODO:
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;Refine the Combo string translation function, supporting all notations&lt;/li&gt;
&lt;li&gt;Combo List add/ delete&lt;/li&gt;
&lt;li&gt;Support Multiple Games/ Character&lt;/li&gt;
&lt;li&gt;Combo List Save to cookie
&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  Repo
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://github.com/andaccc/combo-memo"&gt;https://github.com/andaccc/combo-memo&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I have set the repo to public and host it on aws&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Combo Memo - WIP : Part 1</title>
      <dc:creator>andac</dc:creator>
      <pubDate>Mon, 15 Jan 2024 10:59:21 +0000</pubDate>
      <link>https://dev.to/andaccc/combo-memo-wip-part-1-438a</link>
      <guid>https://dev.to/andaccc/combo-memo-wip-part-1-438a</guid>
      <description>&lt;p&gt;When I play fighting games, I find that I need some places to write down the combos I would use, but I cannot find a good place to do that.&lt;/p&gt;

&lt;p&gt;There are websites that list out all the combos, but &lt;br&gt;
1) the notation can be quite non-intuitive to understand.&lt;/p&gt;

&lt;p&gt;For example &lt;/p&gt;

&lt;p&gt;&lt;code&gt;c.S &amp;gt; 2H &amp;gt; 236K, 2S &amp;gt; 41236H~H &amp;gt; 66RRC &amp;gt; IAD &amp;gt; j.236K &amp;gt; c.S &amp;gt; 6H &amp;gt; 41236H~H&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;2) There isn't a good place to store the combo list. I have tried excel, draw.io, but still the notation limited the readability.&lt;/p&gt;

&lt;p&gt;So I want to make my own combo building website. &lt;/p&gt;

&lt;h2&gt;
  
  
  Goal
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Make a simple website that can write and store fighting games' combos &lt;/li&gt;
&lt;li&gt;Visualize combos as buttons, make it easy to read&lt;/li&gt;
&lt;li&gt;Keep it small, get it done within 2~3 weeks (hopefully before Feb), no server-side features.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  TODO
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;UI Design&lt;/li&gt;
&lt;li&gt;Data Structure Design&lt;/li&gt;
&lt;li&gt;Cookies Storage&lt;/li&gt;
&lt;li&gt;Json export/ import&lt;/li&gt;
&lt;li&gt;Multi-games layout support&lt;/li&gt;
&lt;li&gt;Graphical buttons &amp;lt;-&amp;gt; notation string translation&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Problems
&lt;/h2&gt;

&lt;p&gt;Here are things I am still figuring out&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;How to support multiple games with game-specific input? (eg. GGST has RC), need to design a good data structure&lt;/li&gt;
&lt;li&gt;Figuring out an easy-to-use UI&lt;/li&gt;
&lt;li&gt;Combos can have shared elements instead of completely different from each other. More like a tree than a list. Any good way to visualize this?&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Here is the very early prototype, I will set the repo to public once it is done ~70％&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--zR-JuLU3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j451zfmb1pthkv736oj1.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--zR-JuLU3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j451zfmb1pthkv736oj1.png" alt="Image description" width="798" height="576"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Ref
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://www.dustloop.com/w/GGST/Sol_Badguy/Combos#Combo_List"&gt;https://www.dustloop.com/w/GGST/Sol_Badguy/Combos#Combo_List&lt;/a&gt;&lt;br&gt;
&lt;a href="https://dev.to/dgvall/fighting-game-notation-made-easy-472n"&gt;https://dev.to/dgvall/fighting-game-notation-made-easy-472n&lt;/a&gt;&lt;/p&gt;

</description>
      <category>programming</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
