First Commit

- Added code for the extension
- README updated
- cosmetic changes still required

Author: sirilcodes

.gitignore

@@ -0,0 +1,34 @@
+# Dependency directories
+node_modules/
+
+# Build output
+out/
+dist/
+
+# VS Code specific files
+.vscode-test/
+
+# macOS specific files
+.DS_Store
+
+# Extension packaged files
+*.vsix
+
+# Logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Exclude test.js files in src directory
+src/**/*.test.js
+
+# Include any other patterns you want to ignore

CHANGELOG.md

@@ -0,0 +1,22 @@
+# Change Log
+
+All notable changes to the "Code Visualizer" extension will be documented in this file.
+
+## [Unreleased]
+
+## [0.0.3] - YYYY-MM-DD
+### Added
+- Visualize command
+
+### Changed
+- Changed command name from Generate CodeFlow to Visualize
+- Improvement to existing feature
+
+
+### Moved repo
+- Moved repo to Ganjai-Labs
+
+
+## [0.0.2] - Previous release date
+- Generate CodeFlow command
+

README.md

@@ -0,0 +1,62 @@
+# Code Visualizer 🖥️🔍
+
+## Introduction 👨‍🏫
+
+Thanks for checking out Code Visualizer! 🎉 This extension helps developers visualize their code by generating flowcharts that represent the call hierarchy of functions and methods in your codebase. It transforms the often complex structure of code into an easy-to-understand visual format, making it simpler to navigate large projects. 🗺️
+
+## Features 🌟
+- **Flowchart Generation:** 📊 Right-click on any function or method, and select 'Generate Flowchart' to create a visual representation of its call hierarchy.
+- **Interactive Visuals:** 🖱️ Zoom in, zoom out, and interact with the flowchart to explore different parts of your code.
+- **Customizable Views:** 🎨 Tailor the flowchart to focus on specific function calls, and adjust the layout for better readability.
+- **Multi-Language Support:** 🌐 Currently supports C, C++, Python. 
+  * At least that's the goal of the project. Contributions are welcome! 🤝
+
+## How It Works 🛠️
+
+1. Select a function in your code ✅
+2. Run the "Visualize" command 🏃‍♂️
+3. Watch as CodeFlow creates an interactive diagram of function calls 🎭
+4. Click on nodes to explore deeper into the call hierarchy 🕵️‍♂️
+
+CodeFlow uses VS Code's built-in call hierarchy API, making it language-agnostic and powerful across various programming languages. 💪
+
+## Features 🚀
+
+- **Interactive node-based diagrams** 🕸️
+- **Direct navigation to function definitions** 🔗
+- **Multiple connection visualization for repeated function calls** 🔄
+
+## How to Contribute 🤝
+
+We're excited to welcome contributors to the CodeFlow project! Here's how you can get involved:
+
+1. Fork the repository 🍴
+2. Clone your fork: `https://github.com/Ganjai-Labs/code-visualizer.git` 📥
+3. Create a new branch: `git checkout -b your-feature-name` 🌿
+4. Make your changes ✏️
+5. Run tests: `npm test` 🧪
+6. Commit your changes: `git commit -m "Add some feature"` 💾
+7. Push to the branch: `git push origin your-feature-name` 🚀
+8. Submit a pull request 🙏
+
+Before contributing, please read our [Contributing Guidelines](CONTRIBUTING.md) and [Code of Conduct](CODE_OF_CONDUCT.md). 📚
+
+## Features to be Implemented 🔮
+
+We're always looking to improve CodeFlow. Here are some features we'd love to see:
+
+1. Detect cycles in the generated diagrams, and highlight them in red 🔴
+2. Conditional highlighting of nodes based on certain conditions 🎨
+3. Export diagrams as images or SVGs 📸
+4. Integration with version control to show changes in call hierarchy over time 🕰️
+5. Performance optimizations for large codebases ⚡
+6. Enhanced filtering options for complex diagrams 🔍
+
+Feel free to tackle any of these or propose your own ideas! 💡
+
+## Get Started 🚀
+
+Ready to dive in? Install CodeFlow from the VS Code Marketplace and start visualizing your code today! 🎊
+
+Join us in making code comprehension a joyful experience. Happy coding! 😊👨‍💻👩‍💻
+

package.json

@@ -0,0 +1,89 @@
+{
+  "name": "code-visualizer",
+  "displayName": "Code Visualizer",
+  "description": "Visualize code structure and call hierarchy",
+  "version": "0.0.3",
+  "publisher": "SirilGanjai",
+  "engines": {
+    "vscode": "^1.60.0"
+  },
+  "categories": [
+    "Visualization"
+  ],
+  "activationEvents": [
+    "onCommand:codeflow.generateCodeFlow"
+  ],
+  "main": "./out/extension.js",
+  "contributes": {
+    "commands": [
+      {
+        "command": "codeflow.generateCodeFlow",
+        "title": "Generate CodeFlow"
+      },
+      {
+        "command": "codeflow.visualize",
+        "title": "Visualize"
+      },
+      {
+        "command": "codeflow.goToDefinition",
+        "title": "Go to Definition"
+      }
+    ],
+    "menus": {
+      "editor/context": [
+        {
+          "when": "editorTextFocus",
+          "command": "codeflow.visualize",
+          "group": "navigation"
+        }
+      ],
+      "view/item/context": [
+        {
+          "command": "codeflow.visualize",
+          "when": "view == functionExplorer",
+          "group": "inline"
+        },
+        {
+          "command": "codeflow.goToDefinition",
+          "when": "view == functionExplorer",
+          "group": "inline"
+        }
+      ]
+    },
+    "views": {
+      "explorer": [
+        {
+          "id": "functionExplorer",
+          "name": "Function Explorer"
+        }
+      ]
+    }
+  },
+  "scripts": {
+    "vscode:prepublish": "npm run compile",
+    "compile": "tsc -p ./",
+    "watch": "tsc -watch -p ./",
+    "pretest": "npm run compile && npm run lint",
+    "lint": "eslint src --ext ts",
+    "test": "node ./out/test/runTest.js"
+  },
+  "devDependencies": {
+    "@types/mocha": "^10.0.8",
+    "@types/node": "^14.14.37",
+    "@types/vscode": "^1.60.0",
+    "@typescript-eslint/eslint-plugin": "^4.22.0",
+    "@typescript-eslint/parser": "^4.22.0",
+    "eslint": "^7.25.0",
+    "typescript": "^4.2.4"
+  },
+  "dependencies": {
+    "@braintree/sanitize-url": "^7.1.0",
+    "d3-color": "^3.1.0",
+    "dompurify": "^3.1.6",
+    "mermaid": "^11.3.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Ganjai-Labs/code-visualizer.git"
+  }
+}