by It’s Fred
Goal Visualizer
import logging
from gunicorn.app.base import BaseApplication
from app_init import create_initialized_flask_app
from flask import render_template, request, jsonify
from abilities import llm_prompt
# Flask app creation should be done by create_initialized_flask_app to avoid circular dependency problems.
app = create_initialized_flask_app()
# Setup logging
logging.basicConfig(level=logging.INFO)
logger = logging.getLogger(__name__)
@app.route('/')
def home():
return render_template('home.html')
@app.route('/generate_visualization', methods=['POST'])
def generate_visualization():
goal = request.json['goal']
prompt = f"""Create a detailed Mermaid diagram to visualize the following goal: {goal}.
Use a flowchart structure with 'graph BT' (Bottom to Top) if the main goal should be displayed at the top, or 'graph TD' (Top to Down) if the main goal should be at the bottom.
Include various tracks or paths to achieve the goal, with intermediate steps and sub-goals. Limit the number of parallel tracks to a maximum of 5.
Use different node shapes for main goals, sub-goals, and tasks.
Created: | Last Updated:
Introduction to the Goal Visualizer Template
The Goal Visualizer template is designed to help users input their main goals and visualize them using a web application. This template leverages Flask for the backend, Mermaid for generating visualizations, and Tailwind CSS for styling. By following this guide, you will be able to set up and run the Goal Visualizer application.
Getting Started
To get started with the Goal Visualizer template, click Start with this Template.
Test
After starting with the template, press the Test button. This will begin the deployment of the app and launch the Lazy CLI. The Lazy platform will handle all the necessary setup and deployment steps.
Entering Input
Once the app is deployed, you will be prompted to provide user input through the Lazy CLI. Follow these steps:
- Enter Your Goal:
- Navigate to the deployed app's URL.
- You will see a text area labeled "Enter Your Goal".
-
Input your main goal in the text area.
-
Generate Visualization:
- Click the "Generate Visualization" button.
- The app will process your input and generate a visualization of your goal using Mermaid.
Using the App
The Goal Visualizer app provides a simple interface for entering goals and viewing visualizations. Here's how to use it:
- Home Page:
- The home page includes instructions on how to use the Goal Visualizer.
-
Follow the instructions to enter your goal and generate a visualization.
-
Visualization:
- After clicking the "Generate Visualization" button, the visualization will appear below the input area.
- The visualization will be displayed as a Mermaid diagram, showing the main goal and its sub-goals.
Integrating the App
If you need to integrate the Goal Visualizer app with other tools or services, follow these steps:
- API Integration:
- The app provides an endpoint
/generate_visualization
for generating visualizations. - You can send a POST request to this endpoint with the goal as JSON data.
Sample Request
bash
curl -X POST http://<your-app-url>/generate_visualization \
-H "Content-Type: application/json" \
-d '{"goal": "Your goal here"}'
Sample Response
json
{
"mermaid_code": "graph BT\nB[Visualization will appear here] --> A[Enter your goal]"
}
- Embedding Visualizations:
- You can embed the generated Mermaid diagrams in other web pages or applications.
- Use the Mermaid code provided in the response to render the diagrams.
Conclusion
The Goal Visualizer template provides a straightforward way to visualize your goals. By following the steps outlined in this guide, you can easily set up, test, and use the app. If you need to integrate the app with other tools, use the provided API endpoint and sample code. Enjoy visualizing your goals with the Goal Visualizer!