Skip to content

Commit

Permalink
[improvements] progress bar and display feature added
Browse files Browse the repository at this point in the history
  • Loading branch information
ombhojane committed Feb 14, 2024
1 parent 083f7e1 commit 404b8ed
Show file tree
Hide file tree
Showing 2 changed files with 217 additions and 60 deletions.
69 changes: 58 additions & 11 deletions app.py
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,13 @@ def format_response(response):
formatted_response = "<ul>" + "\n".join(formatted_lines) + "</ul>" if formatted_lines else response
return formatted_response.replace("<ul></ul>", "") # Remove empty list tags

def calculate_progress(sections):
completed_sections = [section for section in sections if section['content']]
total_sections = 4 # description, business_model, setup_process, budget
progress = int((len(completed_sections) / total_sections) * 100)
return progress


# adding visualiztions

# device = "cuda" if torch.cuda.is_available() else "cpu"
Expand Down Expand Up @@ -138,48 +145,88 @@ def pedict():
session.clear() # Clear session at the start
return render_template('predict.html')

@app.route('/download', methods=['POST'])
def download():
service_name = request.form['service_name']
approved_sections = session.get('approved_sections', {})
# You need to implement the logic to convert approved_sections into a downloadable format
# For example:
download_content = "Your Agrotourism Service Plan\n"
for section_name, section_content in approved_sections.items():
download_content += f"{section_name.title()}\n{section_content}\n\n"

# Create a response with the content
response = make_response(download_content)
response.headers["Content-Disposition"] = "attachment; filename=service_plan.txt"
response.headers["Content-Type"] = "text/plain"
return response

@app.route('/generate', methods=['GET', 'POST'])
def generate():
if request.method == 'POST':
service_name = session.get('service_name', request.form['service_name'])
session['service_name'] = service_name

sections = session.get('sections', [])
approved_sections = session.get('approved_sections', {})
current_section = request.form.get('section', 'description')

is_final_section = False # Flag to indicate if the current section is the final one
is_final_section = False

if 'accept' in request.form:
# Store the current approved section content
approved_sections[current_section] = sections[-1]['content']
session['approved_sections'] = approved_sections

next_section_map = {
'description': 'business_model',
'business_model': 'setup_process',
'setup_process': 'budget',
'budget': 'end' # Indicates the end of the sections
'budget': 'end'
}
next_section = next_section_map.get(current_section)

if next_section == 'end':
is_final_section = True # Set the flag when we reach the final section
elif next_section:
is_final_section = True
# Prepare for download, show download button
progress = 100 # Final section implies 100% progress
# Render the template with the final section and show the download button
return render_template('generate.html', sections=sections, service_name=service_name,
is_final_section=is_final_section, progress=progress,
approved_sections=approved_sections, show_download=True)
else:
# Append the new section if it's not the end
sections.append({'name': next_section, 'content': ''})
current_section = next_section
elif sections and sections[-1]['name'] == current_section:

elif 'regenerate' in request.form:
# If regenerate is clicked, simply re-display the current section with the old content
# There's no need to append a new section or generate new content
pass

else:
# New section is being started without any user approval action
sections.append({'name': current_section, 'content': ''})

# Generate content for the current section
prompt_parts = [f"Generate {current_section} for {service_name} in the context of agrotourism."]

response = generate_description(prompt_parts, get_generation_config(), get_safety_settings())
formatted_response = format_response(response) # Apply formatting to the response
formatted_response = format_response(response)
sections[-1]['content'] = formatted_response

session['sections'] = sections
progress = calculate_progress(sections)

return render_template('generate.html', sections=sections, service_name=service_name, is_final_section=is_final_section)
return render_template('generate.html', sections=sections, service_name=service_name,
is_final_section=is_final_section, progress=progress,
approved_sections=approved_sections, show_download=False)
else:
session.pop('sections', None) # Clear session for new start
return render_template('generate.html', sections=[], service_name=None, is_final_section=False)
# Clear the session for a new start
session.pop('sections', None)
session.pop('approved_sections', None)
return render_template('generate.html', sections=[], service_name=None,
is_final_section=False, progress=0, approved_sections={},
show_download=False)



if __name__ == '__main__':
Expand Down
208 changes: 159 additions & 49 deletions templates/generate.html
Original file line number Diff line number Diff line change
@@ -1,61 +1,171 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Agrotourism Service Generator</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="../static/styles.css">

</head>
<body class="bg-gray-50 text-gray-800">
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
/>
<link rel="stylesheet" href="../static/styles.css" />
</head>
<body class="bg-gray-50 text-gray-800">
<nav class="flex justify-between items-center py-6">
<a href="#" class="text-2xl font-bold text-gray-800">Chalo Kisaan</a>
<div class="menu-toggle" onclick="toggleMenu()">
<i class="fas fa-bars fa-2x"></i>
</div>
<div class="nav-links hidden md:flex">
<a href="/predict" class="text-gray-600 mx-2">Start Planning</a>
<a href="/generate" class="text-gray-600 mx-2">Generate</a>
<a href="#" class="text-blue-600 mx-2">How it works?</a>
</div>
</nav>
<a href="#" class="text-2xl font-bold text-gray-800">Chalo Kisaan</a>
<div class="menu-toggle" onclick="toggleMenu()">
<i class="fas fa-bars fa-2x"></i>
</div>
<div class="nav-links hidden md:flex">
<a href="/predict" class="text-gray-600 mx-2">Start Planning</a>
<a href="/generate" class="text-gray-600 mx-2">Generate</a>
<a href="#" class="text-blue-600 mx-2">How it works?</a>
</div>
</nav>

<div class="container mx-auto px-4 py-8">
<h2 class="text-xl font-bold text-green-600">Agrotourism Service Description Generator</h2>
<form method="post" class="mt-4">
<label for="service_name" class="block text-gray-700 text-sm font-bold mb-2">Enter the Agrotourism Service Name:</label>
<input type="text" id="service_name" name="service_name" required value="{{ service_name }}" class="shadow appearance-none border rounded py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline w-full">
<input type="submit" value="Start Generation" class="mt-4 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer">
<h2 class="text-xl font-bold text-green-600">
Agrotourism Service Description Generator
</h2>
<div class="my-4">
<div class="flex items-center mb-2">
<div class="text-sm font-medium text-green-500 leading-none mr-2">
Progress:
</div>
<div class="flex-1 h-2 bg-gray-200 rounded-full">
<div
class="h-2 bg-green-500 rounded-full"
style="width: {{ '%d%%' | format(progress) }}"
></div>
</div>
</div>
<div class="flex justify-between text-xs font-medium text-gray-600">
<div
class="{{ 'text-green-600' if progress >= 25 else 'text-gray-600' }}"
>
Description
</div>
<div
class="{{ 'text-green-600' if progress >= 50 else 'text-gray-600' }}"
>
Business Model
</div>
<div
class="{{ 'text-green-600' if progress >= 75 else 'text-gray-600' }}"
>
Setup Process
</div>
<div
class="{{ 'text-green-600' if progress == 100 else 'text-gray-600' }}"
>
Budget
</div>
</div>
</div>
<form method="post" class="mt-4">
<label
for="service_name"
class="block text-gray-700 text-sm font-bold mb-2"
>Enter the Agrotourism Service Name:</label
>
<input
type="text"
id="service_name"
name="service_name"
required
value="{{ service_name }}"
class="shadow appearance-none border rounded py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline w-full"
/>
<input
type="submit"
value="Start Generation"
class="mt-4 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer"
/>
</form>
{% if sections %}
<div class="mt-8">
{% for section in sections %}
<div class="mb-8 p-4 shadow-lg rounded-lg bg-white">
<h3 class="font-bold text-green-600">
Generated {{ section.name.replace('_', ' ').title() }} for {{
service_name }}:
</h3>
<div class="mt-2 text-gray-600">{{ section.content | safe }}</div>
</div>
{% endfor %} {% if not is_final_section %}
<form method="post" class="flex justify-between items-center mt-4">
<input type="hidden" name="service_name" value="{{ service_name }}" />
<input type="hidden" name="section" value="{{ sections[-1].name }}" />
<input
type="submit"
name="accept"
value="Yes, loved it!"
class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer"
/>
<input
type="submit"
name="regenerate"
value="Generate Again"
class="ml-2 bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer"
/>
</form>
{% if sections %}
<div class="mt-8">
{% for section in sections %}
<div class="mb-8 p-4 shadow-lg rounded-lg bg-white">
<h3 class="font-bold text-green-600">Generated {{ section.name.replace('_', ' ').title() }} for {{ service_name }}:</h3>
<div class="mt-2 text-gray-600">{{ section.content | safe }}</div>
</div>
{% endfor %}
{% if not is_final_section %}
<form method="post" class="flex justify-between items-center mt-4">
<input type="hidden" name="service_name" value="{{ service_name }}">
<input type="hidden" name="section" value="{{ sections[-1].name }}">
<input type="submit" name="accept" value="Yes, loved it!" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer">
<input type="submit" name="regenerate" value="Generate Again" class="ml-2 bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer">
</form>
{% else %}
<p class="mt-4 text-green-600">Thank you for using our service!</p>
{% endif %}
</div>
{% else %}
<p class="mt-4 text-green-600">Thank you for using our service!</p>
{% endif %}
</div>
{% endif %}

{% if is_final_section %}
<!-- Display Button -->
<div class="flex justify-end mt-4">
<button
id="displayButton"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer"
>
Display
</button>
</div>

<!-- Your Agrotourism Service Plan Section, hidden by default -->
<div id="approvedSections" class="mt-8 hidden">
<h3 class="text-xl font-bold text-green-600">
Your Agrotourism Service Plan:
</h3>
<!-- Approved Sections will be displayed here -->
{% for section_name, section_content in approved_sections.items() %}
<div class="mb-8 p-4 shadow-lg rounded-lg bg-white">
<h4 class="font-bold text-green-600">
{{ section_name.replace('_', ' ').title() }}:
</h4>
<div class="mt-2 text-gray-600">{{ section_content | safe }}</div>
</div>
{% endfor %}
</div>

<form method="POST" action="/download">
<input type="hidden" name="service_name" value="{{ service_name }}">
<button type="submit" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline cursor-pointer">
Download
</button>
</form>

{% endif %}
</div>
<script>
function toggleMenu() {
var navigation = document.querySelector('.nav-links');
navigation.classList.toggle('mobile-menu');
}
</script>
</body>
function toggleMenu() {
var navigation = document.querySelector(".nav-links");
navigation.classList.toggle("mobile-menu");
}

document.getElementById('displayButton').addEventListener('click', function() {
var approvedSections = document.getElementById('approvedSections');
approvedSections.classList.toggle('hidden');
});
</script>
</body>
</html>

0 comments on commit 404b8ed

Please sign in to comment.