Add LaunchMap Logo and Name in Bottom Left

[SakshayMahna]

Description:

Display a small logo + "LaunchMap" text in the bottom-left corner of the screen, like a watermark or subtle branding.

Design Suggestions

• Position: bottom left corner of zoom layer (or fixed container)
• Logo: assets/launchmap-logo.png (already present)
• Text: LaunchMap in subtle gray

Tasks

1. Add a container in src/getWebviewHtml.ts HTML.
2. Use position: fixed or relative to #zoom-layer
3. Include image and styled text side by side
4. Add media query to ensure it is not intrusive on small screens

[TahaMjp]

Clarification: File src/getWebviewHtml.ts Not Found

Hi, I was going through the issue and noticed that the file path mentioned — src/getWebviewHtml.ts — doesn't seem to exist in the project structure.

However, I did find a file located at src/panel/getWebviewHtml.ts.
Just to confirm, did you mean this file instead? Should I proceed with making the changes in src/panel/getWebviewHtml.ts?

Let me know so I can make sure I'm working in the right place. Thanks!

[SakshayMahna]

Hi @TahaMjp
Thank you for raising this.
Yes, this is the file to make changes to. It has the HTML code which you can edit.

[SakshayMahna]

Please take these 2 images for reference.
The text "LaunchMap" is written in font "League Spartan", created in Canva.

[TahaMjp]

🛠️ Can't Get Output From the Extension (Need Help)

Hi team 👋

I'm a front-end developer and I'm really curious and excited to contribute to this amazing project! 🙌
This is actually my first time working on a VS Code extension, and I’ve been diving deep into the codebase trying to understand how everything is structured.

However, I’ve hit a blocker.
I’ve been trying for a while now — using several different methods and setups — to get the output or result from the extension, just to test and debug my changes. But unfortunately, I haven’t been able to get it working successfully.

I’ve explored the docs, reviewed related parts of the code, and attempted debugging strategies, but still couldn’t figure out how to generate or view the output.

---

What I Need Help With:

• How can I run the extension locally and see the output for testing/debugging?
• Is there a specific command, terminal step, or setting I might be missing?

Any guidance or steps would be hugely appreciated, even if they seem basic — since this is all new territory for me. I'm really eager to learn and contribute properly 🙏

Thanks in advance for your support! 😊
Looking forward to getting more involved in this project.

– TahaMjp

[SakshayMahna]

Thanks a lot for diving in and showing interest!

You are right, the steps to run the extension locally are not clearly documented. I will make sure to add them to the docs soon so new contributors don't run into the same issue. Thank you for raising it!

Here is how you can get the extension running and see the output:

1. Compile the code

npm run compile

This converts the TypeScript code into JavaScript so VS Code can run it.

2. Start the extension in a debug VS Code window

Open the file src/extension.ts.

Press F5 (or go to Run and Debug → Launch Extension).

This launches a new VS Code window with the extension loaded in "dev mode" so you can test your changes live.

3. Open a sample launch file

In the new debug VS Code window, navigate to:
parser/tests/real_cases/launch_files/

Open any .launch.py file (these are real world test cases).

4. Run the LaunchMap visualizer

Press Cmd + Shift + P (or Ctrl + Shift + P on Windows/Linux).

Search for LaunchMap: Open Launch Visualizer and run it.

You should now see the visualization output.

If face any issues, feel free to put screenshots or error logs here, we will troubleshoot it together.

[TahaMjp]

🎉 Job Finished!

Hey @SakshayMahna
The job is all done ✅

If there's anything you’d like changed — if you didn’t love the design, or want something added, removed, or tweaked — just let me know. I’d be more than happy to fix it!

---

🙏 Special Thanks

Huge thanks to you for helping me out during the process. Your support really made things smoother!

---

🚀 Excited to Contribute

I'm truly excited to keep contributing and help out more in the future. Just let me know where I can jump in next!

---

📦 Pull Request

I've submitted a pull request with the finished changes — feel free to check it out!

Thanks again! 😊

---

🖼️ Preview

[SakshayMahna]

Thank you! But can you make it more subtle and larger, like how Unreal Blueprint Editor does:

[SakshayMahna]

And, could you please run the tests as well. The tests run as follows:

npm run compile

# Parser Tests
npm run test:parser

# Visualization Test
npm run test:webview

# Extension Test
npm run test:src

# All Tests
npm run test:all

I'll be adding automated tests to the repository as well.

[TahaMjp]

Thank you for providing the examples! 🙏
I'll go ahead and implement them, then run the necessary tests to make sure everything works smoothly ✅

Appreciate the help!

[TahaMjp]

Made Changes to Blueprint Style Watermark

Hey! 👋
I implemented the requested changes — made it more subtle and slightly larger, inspired by how Unreal's Blueprint Editor handles watermark-style elements.

I’ve attached two screenshots for comparison:

• ✅ One with the logo

• ❌ One without the logo

Please let me know:

• Which version you prefer?
• Any final tweaks you'd like?

Once I have your feedback, I’ll:

• Make the final pull request
• Run the tests
• And if necessary, share the test logs

Thanks!

[SakshayMahna]

Can you try these things:

• Make logo + text ~1.5× larger.
• Use bold text with slight letter spacing.
• Add small gap between icon and text, vertically center both.
• Lower background opacity.
• Responsive on resize.

Also try alternatively to create the same on Canva, get a transparent background and overlay it.

The Unreal Editor Blueprint still seems quite prominent compared to the current version that we have.

Consider the text here:

Please take these 2 images for reference. The text "LaunchMap" is written in font "League Spartan", created in Canva.

[SakshayMahna]

Before continuing your work, please pull the recent changes from main branch.
I have updated GitHub workflows for test and lint checks.

Additionally added the CONTRIBUTING.md file. You can refer to it for running the tests and lint checks.

[TahaMjp]

Hi @SakshayMahna ,

I’ve implemented the requested changes:

• Increased logo and text size by ~1.5×.
• Set text to bold with slight letter spacing.
• Added gap between icon and text and ensured vertical alignment.
• Reduced background opacity.
• Made the design responsive on window resize.
• Used the League Spartan font as in the reference images.

I think the background could be made a little more transparent (slightly lower opacity) — let me know if you’d like me to adjust that before finalizing.

Also, please assign me to this issue so I can manage it through to completion.
This will help me track feedback, apply any final tweaks, and ensure everything is consistent before submitting the PR.

If this looks good (or after any final tweaks you want), I’ll run the tests, verify everything works as expected, and then open a pull request.

---

📸 Screenshots (Preview)

Before:

After: