Create a text modifier using django
Hey guys once again welcome to the Decoders blog, I hope you all are doing well and today I'm present with a text modifier(using django).
Here is an overview of how your website is going to work like!!!!
STEPS-1:First of all create your surver using django(you may refer to https://decoderzz.blogspot.com/ in case if you don't know how to create a server using django)
STEP-2:Create two new html files inside the folder and make changes in the views.py and urls.py folder as shown in the given video
NOTE:The hierarchy of the folders as shown in the above video must be exactly same otherwise it will give an error
STEP-3:using the command line run the sever and then do whatever you want :)
CODE FOR views.py:
from django.http import HttpResponse
from django.shortcuts import render
def index(request):
#params={'name':'sivam','place':'guwahati'}
return render(request,'index.html')
# return HttpResponse('''<a href="https://www.youtube.com/watch?v=AepgWsROO4k&list=
PLu0W_9lII9ah7DDtYtflgwMwpT3xmjXY9&index=7" >djnago course</a>''')
def solve(request):
req=request.POST.get('text','default')
op=request.POST.get('checkbox','off')
upper=request.POST.get('capitalize','off')
count=request.POST.get('countchar','off')
params=""
if op=="on":
punc=''',.></?'";:/{}]['''
for char in req:
if char not in punc:
params=params+char
text={'sol':params,'prop':'punctuation removed'}
return render(request,'solved.html',text)
elif upper=="on":
for char in req:
params=params+char.upper()
text={'sol':params,'prop':'converted to uppercase'}
return render(request,'solved.html',text)
elif count=="on":
text= {'sol':len(req),'prop':'the number of characters'}
return render(request,'solved.html',text)
else:
return render(request,'index.html')
CODE FOR urls.py:
from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [
path('admin/', admin.site.urls),
path('',views.index, name='index'),
path('solve',views.solve, name='solve'),
path('solved',views.solve, name='solved')
]
CODE FOR index.html;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>This is django</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.
css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn
8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
</head>
<style>
.container{
/* border: 1px solid red; */
background-image: url(nature5.jpg);
position:relative;
}
#text{
text-align: center;
position: relative;
}
#input{
text-align: center;
position: relative;
left: 41%;
}
.form-switch {
padding-left: 2.5em;
position: relative;
left: 341px;
display: inline-block;
top: 30px;
}
#submit{
position: relative;
display: inline-block;
top: 74px;
right: -226px;
}
</style>
<body>
<div class="container">
<div class="alert alert-primary" role="alert">
Text modifier:
</div>
<form action="solve" method="post" >{% csrf_token %}
<h1 id="text">Enter the text below</h1>
<input type="text" name="text" id="input"><br>
<!-- <input type="button" class="btn btn-outline"name="checkbox" >Remove
punctuations -->
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault"
name="checkbox" >
<label class="form-check-label" for="flexSwitchCheckDefault">Remove punctuations
</label>
</div>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault"
name="countchar" >
<label class="form-check-label" for="flexSwitchCheckDefault">Count the number of
characters
</label>
</div>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault"
name="capitalize" >
<label class="form-check-label" for="flexSwitchCheckDefault">Capitalize the text
</label>
</div>
<button id="submit" type="submit">Analyze text</button>
</form>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.min.js"
integrity="sha384-eMNCOe7tC1doHpGoWe/6oMVemdAVTMs2xqW4mwXrXsW0L84Iytr2wi5v2QjrP/xp"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.min.js"
integrity="sha384-cn7l7gDp0eyniUwwAZgrzD06kc/tftFf19TOAs2zVinnD/C7E91j9yyk5//jjpt/"
crossorigin="anonymous"></script>
</html>
CODE FOR solved.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>punctuations removed</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.
css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVX
n8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
</head>
<style>
</style>
<body>
<div class="alert alert-success">
TEXT HAS BEEN MODIFIED....
</div>
<p>{{sol}} [{{prop}}] </p>
<form action="" method="get">
<button value="Return home" type="submit" name="submit" class="btn btn-outline-
primary">Return home</button>
</form>
</body>
</html>
Comments
Post a Comment