<jupyter_start><jupyter_text>Installing Required Libraries<jupyter_code>!pip3 install gpt-2-simple
#!pip install tensorflow==1.15
%tensorflow_version 1.x
!pip install flask-ngrok
!pip install gpt-2-simple
!pip install language_tool_python
import os
from flask_ngrok import run_with_ngrok
from flask import Flask, request
import gpt_2_simple as gpt2_simple
import threading
import time
import tensorflow as tf
import requests # For Pastebin API
import language_tool_python
tool = language_tool_python.LanguageTool('en-US')
#!git clone https://github.com/openai/gpt-2.git && cd gpt-2
#cd gpt-2/
#!pip3 install -r requirements.txt
#!python download_model.py 124M<jupyter_output><empty_output><jupyter_text>Downloading GPT2's 124M Model<jupyter_code>gpt2_simple.download_gpt2(model_name='124M')
from google.colab import files
gpt2_simple.mount_gdrive()<jupyter_output>Drive already mounted at /content/drive; to attempt to forcibly remount, call drive.mount("/content/drive", force_remount=True).<jupyter_text>Finetuning the Downloaded Model on Scary.txt Corpus run1 = Model for Scary Storiesrun2 = Model for Funny Storiesrun3 = Model for Scifi Stories  Starting a new session<jupyter_code>sess = gpt2_simple.start_tf_sess()<jupyter_output><empty_output><jupyter_text>Finetuning the 124M Model on Scary Stories and Saving the Checkpoints to Google Drive for future use<jupyter_code># gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scary/scary.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='fresh')
# gpt2_simple.copy_checkpoint_to_gdrive(run_name='run1')<jupyter_output><empty_output><jupyter_text>Finetuning the 124M Model on Funny Stories and Saving the Checkpoints to Google Drive for future use<jupyter_code># gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Humour/humour.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='fresh', run_name='run2')
# gpt2_simple.copy_checkpoint_to_gdrive(run_name='run2')<jupyter_output><empty_output><jupyter_text>Finetuning the 124M Model on Scifi Stories and Saving the Checkpoints to Google Drive for future use<jupyter_code># gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi1.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='fresh', run_name='run3')
# gpt2_simple.copy_checkpoint_from_gdrive(run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi2.txt", steps=2000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi3.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi4.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi5.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi6.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi7.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi8.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi9.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi10.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi11.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.finetune(sess, dataset="/content/drive/MyDrive/Project_Granny/Scifi/Scifi12.txt", steps=1000, model_name='124M',
# sample_every=200, save_every=1000, print_every=10, restore_from='latest', run_name='run3')
# gpt2_simple.copy_checkpoint_to_gdrive(run_name='run3')<jupyter_output><empty_output><jupyter_text>Creating some CSS and JavaScript files for some Cosmetic Changes on the Main Flask WebApp<jupyter_code>%mkdir static/css -p
%mkdir static/js -p
%%writefile static/css/style.css
body {
  //background-image: url("https://i.pinimg.com/originals/02/8f/c0/028fc0f58b6d275812336e90c6ba4251.gif");
  //background-repeat: no-repeat;
  	background: linear-gradient(rgba(10,10,10,.6),rgba(0,0,0,.9)), repeating-linear-gradient(0, transparent, transparent 2px, black 3px, black 3px),
		url('https://image.freepik.com/free-photo/spooky-background-trees-foggy-night_1048-2901.jpg');
	background-size: cover;
	background-position: center;
  background-color: #222222;
  color: white;
  text-align: center;
  font-family:Verdana;
}
#form-container{
    width:70%;
    margin:auto;
}
div {
	margin:10px 0px;
}
button {
	padding:10px;
	background-color:#6a67ce;
	color: #FFFFFF;
	border: 0px;
	cursor:pointer;
	border-radius: 5px;
}

/* For Range Slider of Form
   Reference :- https://www.w3schools.com/howto/howto_js_rangeslider.asp */

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 15px;
  border-radius: 5px;  
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 50%; 
  background: #4CAF50;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
}

%%writefile static/css/text-glitch-style.css

/* ---------------------------------------------- 
       Glitchy Text Idea Borrowed From
       https://codepen.io/akadart/pen/VvmNYr
   ----------------------------------------------- */

#glitch-granny-text-container{
    height:70px;
}

.text, .glitch {
  -webkit-filter: url("#glitch");
  filter: url("#glitch");
}

.text {
  display: inline-block;
}

.glitch {
  font-size: 50px;
  position: absolute;
  width: 100%;
  height: 100%;
  width: 100px;
  font-family: sans-serif;
  margin: auto;
  display: inline-block;
}

@keyframes noise-anim {
  0% {
    clip: rect(6px, 999px, 87px, 0);
  }
  33.33333% {
    clip: rect(92px, 999px, 98px, 0);
  }
  66.66667% {
    clip: rect(101px, 999px, 182px, 0);
  }
  100% {
    clip: rect(137px, 999px, 72px, 0);
  }
}
.glitch:after {
  content: attr(data-text);
  position: absolute;
  left: 5px;
  text-shadow: -1px 0 red;
  top: 0;
  color: black;
  background: white;
  overflow: hidden;
  clip: rect(0, 300px, 0, 0);
  font-family: Bodoni, serif;
  animation: noise-anim 2s infinite linear alternate-reverse;
}

@keyframes noise-anim-2 {
  0% {
    clip: rect(1459px, 9999px, 542px, 0);
  }
  33.33333% {
    clip: rect(1953px, 9999px, 292px, 0);
  }
  66.66667% {
    clip: rect(1401px, 9999px, 237px, 0);
  }
  100% {
    clip: rect(1698px, 9999px, 1938px, 0);
  }
}
.glitch:before {
  content: attr(data-text);
  position: absolute;
  left: -5px;
  text-shadow: 1px 0 blue;
  top: 0;
  color: black;
  background: 0;
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  animation: noise-anim-2 3s infinite linear alternate-reverse;
}
%%writefile static/css/glitching-granny-image-style.css
/* ---------------------------------------------- 
       Glitchy Image Idea Borrowed From
       https://codepen.io/awinnett/pen/zEZyWK
   ----------------------------------------------- */

html{
    overflow: hidden;
}

.glitch-container {
  position: relative;
  font-size: 95px;
  font-style: italic;
  text-align: center;
  width: 170px;
  line-height: 60px;
}

.img-1 {
  position: relative;
  width: 100%;
  height: auto;
  margin: auto;
  animation: noise 4s linear infinite;
  overflow: default;
  z-index: 1;
}

.img-2 {
  width: 100%;
  height: auto;
  line-height: 60px;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  animation: noise-1 2s linear infinite;
  z-index: 1;
}

.img-3 {
  width: 100%;
  height: auto;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  animation: noise-2 1.4s linear infinite;
  z-index: 1;
}

.line {
  width: 100%;
  height: 200px;
  margin: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.7;
  overflow: hidden;
  z-index: 0;
}
.line img {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  filter: hue-rotate(120deg);
  z-index: -2;
  animation: noise-3 0.5s linear infinite;
}

@keyframes noise-1 {
  0%, 20%, 30%, 40%, 60%, 68%, 70%, 90% {
    opacity: 0;
  }
  10% {
    opacity: .1;
  }
  50% {
    opacity: .5;
    left: -6px;
  }
  80% {
    opacity: .3;
  }
  100% {
    opacity: .6;
    left: 2px;
  }
}
@keyframes noise-2 {
  0%, 20%, 30%, 40%, 60%, 65%, 70%, 90% {
    opacity: 0;
  }
  10% {
    opacity: .1;
  }
  50% {
    opacity: .5;
    left: 6px;
  }
  80% {
    opacity: .3;
  }
  100% {
    opacity: .6;
    left: -2px;
  }
}
@keyframes noise {
  0%, 3%, 5%, 42%, 44%, 100% {
    opacity: 1;
    transform: scaleY(1);
  }
  4.3% {
    opacity: 1;
    transform: scaleY(1.7);
  }
  43% {
    opacity: 1;
    transform: scaleX(1.5);
  }
}
@keyframes noise-3 {
  0%,3%,5%,42%,44%,100% {
    opacity: 1;
    transform: scaleY(1);
  }
  4.3% {
    opacity: 0.1;
    transform: scaleY(1);
  }
  43% {
    opacity: 1;
    transform: translateX(-15px);
  }
}
%%writefile static/css/textbox-notebook-effect.css

/* https://stackoverflow.com/questions/8304436/css-styling-text-areas-like-notebook-look */

textarea
{
    border: 1px solid #EEEEEE;
    box-shadow: 1px 1px 0 #DDDDDD;
    display: block;
    font-family: 'Dancing Script', cursive;
    color:#e80202; 
    font-size: 22px;
    line-height: 50px;
    margin: 2% auto;
    padding: 11px 20px 0 70px;
    resize: none;
    height: 500px;
    width: 75%;
    
    background-image: -moz-linear-gradient(top , transparent, transparent 49px,#E7EFF8 0px), -moz-radial-gradient(4% 50%, circle closest-corner, #f5f5f5, #f5f5f5 39%, transparent 0%), -moz-radial-gradient(3.9% 46% , circle closest-corner, #CCCCCC, #CCCCCC 43.5%, transparent 0%); 
    background-image: -webkit-linear-gradient(top , transparent, transparent 49px,#E7EFF8 0), -webkit-radial-gradient(4% 50%, circle closest-corner, #f5f5f5, #f5f5f5 39%, transparent 0%), -webkit-radial-gradient(3.9% 46%, circle closest-corner, #cccccc, #cccccc 43.5%, transparent 0%);
    
    -webkit-background-size:  100% 50px;
    background-size: 100% 50px;
    overflow: auto;
}

@keyframes typing {
  0% { width: 0; }
}
@keyframes blink {
  50% { border-color: transparent; }
}

.wrapper { display: inline-block; }

h1 {
  border-right: 4px solid #fff;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  animation: 
    typing 2s steps(24, end),
    blink 1s step-end infinite;
}

/* for sharing bttons */

#share-buttons img {
width: 35px;
padding: 5px;
border: 0;
box-shadow: 0;
display: inline;
}

%%writefile static/js/script.js
$("button").click(function(){
  $("#form-container").hide(1000);
  $("#suggest").hide(1000);
  $('#loader').show(1000);
});

var slider = document.getElementById("myRange");
var output = document.getElementById("demo");
output.innerHTML = slider.value; // Display the default slider value

// Update the current slider value (each time you drag the slider handle)
slider.oninput = function() {
  output.innerHTML = this.value;
}
%%writefile static/js/tts.js

/* Using HTML5 Text to Speech API For Implementing Text to Speech Functionality 
   Reference Article :- https://www.studytonight.com/post/javascript-text-to-speech-using-speechsynthesis-interface */

function textToAudio() {
    let msg = document.getElementById("text-to-speech").value;
                
    let speech = new SpeechSynthesisUtterance();
    speech.lang = "en-US";
                
    speech.text = msg;
    speech.volume = 1;
    speech.rate = 1;
    speech.pitch = 1;
                
    window.speechSynthesis.speak(speech);
}

$('#smoke-effect, #smoke-effect-canvas').SmokeEffect();
%%writefile static/css/humour_style.css
body {
  //background-image: url("https://i.pinimg.com/originals/02/8f/c0/028fc0f58b6d275812336e90c6ba4251.gif");
  //background-repeat: no-repeat;
  	background: linear-gradient(rgba(10,10,10,.6),rgba(0,0,0,.9)), repeating-linear-gradient(0, transparent, transparent 2px, black 3px, black 3px),
		url('https://t3.ftcdn.net/jpg/02/86/18/20/360_F_286182066_yY72dajL2Vv9pYZ0LWiDiYZrMEStz0Fo.jpg');
	background-size: cover;
	background-position: center;
  background-color: #222222;
  color: white;
  text-align: center;
  font-family:Verdana;
}
#form-container{
    width:70%;
    margin:auto;
}
div {
	margin:10px 0px;
}
button {
	padding:10px;
	background-color:#6a67ce;
	color: #FFFFFF;
	border: 0px;
	cursor:pointer;
	border-radius: 5px;
}

/* For Range Slider of Form
   Reference :- https://www.w3schools.com/howto/howto_js_rangeslider.asp */

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 15px;
  border-radius: 5px;  
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 50%; 
  background: #4CAF50;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
}
%%writefile static/css/scifi_style.css
body {
  //background-image: url("https://i.pinimg.com/originals/02/8f/c0/028fc0f58b6d275812336e90c6ba4251.gif");
  //background-repeat: no-repeat;
  	background: linear-gradient(rgba(10,10,10,.6),rgba(0,0,0,.9)), repeating-linear-gradient(0, transparent, transparent 2px, black 3px, black 3px),
		url('https://eskipaper.com/images/blue-space-pictures-1.jpg');
	background-size: cover;
	background-position: center;
  background-color: #222222;
  color: white;
  text-align: center;
  font-family:Verdana;
}
#form-container{
    width:70%;
    margin:auto;
}
div {
	margin:10px 0px;
}
button {
	padding:10px;
	background-color:#6a67ce;
	color: #FFFFFF;
	border: 0px;
	cursor:pointer;
	border-radius: 5px;
}

/* For Range Slider of Form
   Reference :- https://www.w3schools.com/howto/howto_js_rangeslider.asp */

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 15px;
  border-radius: 5px;  
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 50%; 
  background: #4CAF50;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
}
%%writefile static/css/homepage.css
@import url(https://fonts.googleapis.com/css?family=Oxygen:400,300);
@import url(https://fonts.googleapis.com/css?family=Montserrat:700);

*{
  margin: 0;
  padding: 0;
}
.intro{
  margin: auto;
}
.black {
  width: 50%;
  float: left;
  background: #283644;
  height: 100vh;
}

.white{
  width: 50%;
  float: right;
  background: #4D727E;
  height: 100vh;
}

.box{
  height: 300px;
  width: 500px;
  background: #069A8E;
  position:absolute;
  top:150px;
  left:0;
  right:0;
  margin:auto;
  border-radius:20px;
}

.boxfather{
  width:100%;
  position:absolute;
}
.box h1{
  color: #E4E4E4;
  font-size: 5em;
  text-align: center;
  position: relative;
  top:70px;
  font-family: 'Montserrat', sans-serif;
}

.box button{
  left:40%;
  position:relative;
  top:120px;
  padding: 8px 20px;
  cursor:pointer;
  border:0;
  outline:none;
  color:#525252;
  background:#E4E4E4;
  transition:all .3s ease;
  font-size: 19px;
  font-family: montserrat;
  border-radius:5px;
}
.homepage{
  height: 100vh;
  position:relative;
  top:40px;
  
 
}
.homepage p{
  width: 80%;
  line-height: 1.5;
  margin:50px auto;
  font-family: oxygen;
  font-size: 18px;
  color: #585858;
}
.homepage h1{
  padding-top: 50px;
  width: 80%;
  margin:auto;
  font-family: montserrat;
  color: #525252;
  font-size: 40px;
}

%%writefile static/css/polaroid.css
@IMPORT <link href="https://fonts.googleapis.com/css?family=Poor+Story" rel="stylesheet">

* {
  box-sizing: border-box;
}

body {
  font-family: 'Poor Story', cursive;
  background: #bdffbd;
}

.wrapper {
  width: 100%;
  padding: 0 2rem;
  text-align: center;
}
.polaroid {
  background: #fff;
  padding: 1rem;
  box-shadow: 0 0.2rem 1.2rem rgba(0,0,0,0.2);
  
}
.polaroid > img{
  max-width: 100%;
  height: auto;
}
.caption {
  font-size: 1.8rem;
  text-align: center;
  line-height: 2em;
}
.item {
  width: 30%;
  display: inline-block;
  margin-top: 2rem;
  filter: grayscale(100%);
}
.item .polaroid:before {
  content: '';
  position: absolute;
  z-index: -1;
  transition: all 0.35s;
}
.item:nth-of-type(4n+1) {
  transform: scale(0.8, 0.8) rotate(5deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+1) .polaroid:before {
  transform: rotate(6deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  right: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.4);
}
.item:nth-of-type(4n+2) {
  transform: scale(0.8, 0.8) rotate(-5deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+2) .polaroid:before {
  transform: rotate(-6deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  left: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.4);
}
.item:nth-of-type(4n+4) {
  transform: scale(0.8, 0.8) rotate(3deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+4) .polaroid:before {
  transform: rotate(4deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  right: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.3);
}
.item:nth-of-type(4n+3) {
  transform: scale(0.8, 0.8) rotate(-3deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+3) .polaroid:before {
  transform: rotate(-4deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  left: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.3);
}
.item:hover {
  filter: none;
  transform: scale(1, 1) rotate(0deg) !important;
  transition: all 0.35s;
}
.item:hover .polaroid:before {
  content: '';
  position: absolute;
  z-index: -1;
  transform: rotate(0deg);
  height: 90%;
  width: 90%;
  bottom: 0%;
  right: 5%;
  box-shadow: 0 1rem 3rem rgba(0,0,0,0.2);
  transition: all 0.35s;
}
%%writefile static/js/homepage.js
$(function(){
  $('.homepage').hide();
  $('.box').delay(500).effect("bounce", { times: 8 }, 800);
  $('.box').hide().slideDown(500);
  
  
  $('button').click(function(){
    $('.intro').slideUp(400);
     $('.box').slideUp(200);
    $('.homepage').delay(500).slideDown(300);
  });
  
});
%%writefile static/js/save_as.js
function saveTextAsFile()
{
    var textToSave = document.getElementById("text-to-speech").value;
    var textToSaveAsBlob = new Blob([textToSave], {type:"text/plain"});
    var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
    var fileNameToSaveAs = "Story"
 
    var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    downloadLink.href = textToSaveAsURL;
    downloadLink.onclick = destroyClickedElement;
    downloadLink.style.display = "none";
    document.body.appendChild(downloadLink);
 
    downloadLink.click();
}
 
function destroyClickedElement(event)
{
    document.body.removeChild(event.target);
}
%%writefile static/js/copy_function.js
function copy_that() {
  /* Get the text field */
  var copyText = document.getElementById("url");

  /* Select the text field */
  copyText.select();
  copyText.setSelectionRange(0, 99999); /*For mobile devices*/

  /* Copy the text inside the text field */
  document.execCommand("copy");

  /* Alert the copied text */
  alert("Copied the text: " + copyText.value);
}
def pastebin_share(story_to_be_shared,genre):
    key = ''
    text = story_to_be_shared
    t_title = genre

    login_data = {
        'api_dev_key': key,
        'api_user_name': '',
        'api_user_password': ''
        }
    data = {
        'api_option': 'paste',
        'api_dev_key':key,
        'api_paste_code':text,
        'api_paste_name':t_title,
        'api_paste_expire_date': '10M',
        'api_user_key': None,
        'api_paste_format': 'python'
        }

    login = requests.post("https://pastebin.com/api/api_login.php", data=login_data)
    print("Login status: ", login.status_code if login.status_code != 200 else "OK/200")
    print("User token: ", login.text)
    data['api_user_key'] = login.text

    r = requests.post("https://pastebin.com/api/api_post.php", data=data)
    print("Paste send: ", r.status_code if r.status_code != 200 else "OK/200")
    return r.text
def listToString(li):  
    li2 = []
    for sublist in li:
        li2.extend(sublist)
    str1 = " " 

    return (str1.join(li2))  
def grammar_check(my_story):
    matches = tool.check(my_story)
    length = len(matches)
    res=[]
    for i in range(0,length):
        lst = list(matches)
        res.append(str(lst[i]).split("\n")[1:])
        resu = listToString(res)
        resu = resu.replace("^","")
        resu = resu.replace('Message:','<br/><br/><i class="far fa-hand-point-right"></i>&nbsp;&nbsp;')
    return resu<jupyter_output><empty_output><jupyter_text>Creating the Main Flask Web App<jupyter_code>app = Flask(__name__)
run_with_ngrok(app)   #starts ngrok when the app is run

scary_result=None
scary_start_with=None
scary_word_limit=None

humour_result=None
humour_start_with=None
humour_word_limit=None

scifi_result=None
scifi_start_with=None
scifi_word_limit=None

def scary_generate_story():
    global scary_result
    sess = gpt2_simple.start_tf_sess()
    gpt2_simple.copy_checkpoint_from_gdrive(run_name='run1')
    gpt2_simple.load_gpt2(sess)
    scary_result = str(gpt2_simple.generate(sess, run_name='run1', length=scary_word_limit, prefix=scary_start_with,return_as_list=True)[0]).replace("\n","")


def humour_generate_story():
    global humour_result
    tf.reset_default_graph()  
    sess = gpt2_simple.start_tf_sess()
    gpt2_simple.copy_checkpoint_from_gdrive(run_name='run2')
    gpt2_simple.load_gpt2(sess, run_name='run2')
    humour_result = str(gpt2_simple.generate(sess, run_name='run2', length=humour_word_limit, prefix=humour_start_with,return_as_list=True)[0]).replace("\n","")


def scifi_generate_story():
    global scifi_result
    tf.reset_default_graph()  
    sess = gpt2_simple.start_tf_sess()
    gpt2_simple.copy_checkpoint_from_gdrive(run_name='run3')
    gpt2_simple.load_gpt2(sess, run_name='run3')
    scifi_result = str(gpt2_simple.generate(sess, run_name='run3', length=scifi_word_limit, prefix=scifi_start_with ,return_as_list=True)[0]).replace("\n","")

########################################################################################################################
#                                                      HOME PAGE
########################################################################################################################

@app.route('/',methods=["GET","POST"])
def home_page():
    return '''
<html>
<head>
<title>GRANNY</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="/static/css/homepage.css/">
<link rel="stylesheet" href="/static/css/polaroid.css/">
</head>
<body>
<div class="intro">
  <div class="black"></div>  
  <div class="white"></div>
  <div class="boxfather">
    <div class="box">
      <h1>GRANNY</h1>
      <button><i class="fab fa-get-pocket"></i> Start</button>
    </div>
  </div>
  
</div>


<div class="homepage">
  <h1> Tell <u>GRANNY</u> a Genre for your Story </h1>

<div class="wrapper">

  <div class="item">
  <a href="/scary">
    <div class="polaroid"><img src="https://cdn.pixabay.com/photo/2016/06/28/00/13/castle-1483681_960_720.jpg">
      <div class="caption">Scary</div>
    </div>
  </a>
  </div>

  <div class="item">
  <a href="/funny">
    <div class="polaroid"><img src="https://filmdaily.co/wp-content/uploads/2020/07/dirty-lede-1300x731.jpg">
      <div class="caption">Funny</div>
    </div>
  </a>
  </div>

  <div class="item">
  <a href="/scifi">
    <div class="polaroid"><img src="https://cdn.pixabay.com/photo/2020/05/12/20/01/spaceship-5164780_960_720.jpg">
      <div class="caption">Scifi </div>
    </div>
  </a>
  </div>


</div>


</div>

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
<script src="/static/js/homepage.js/"></script>
</body>
</html>
'''.format()

################################################################################
#                                 SCARY STORIES
################################################################################

@app.route('/scary', methods=["GET", "POST"])
def adder_page_scary():
    global scary_result
    global scary_start_with
    global scary_word_limit
    errors = ""
    if request.method == "POST":
        try:
            scary_start_with = (request.form["start_of_story_post_request"])
        except:
            errors = "Something Unusual"
        try:
            scary_word_limit = int(request.form["word_limit"])
        except:
            errors = "Something Unusual"
        try:
            thread = threading.Thread(target=scary_generate_story)
            thread.start()
            thread.join()
            share = pastebin_share(scary_result,"Scary")
            grammatical_errors = grammar_check(scary_result)
        except:
            result="N/A"
        return '''

<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>GRANNY</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
  <link rel="stylesheet" href="/static/css/style.css/">
  <link rel="stylesheet" href="/static/css/textbox-notebook-effect.css/">
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet">
  <script src="/static/js/tts.js/"></script>

</head>
<body>

<div class="wrapper">
  <h1><h1><i class="fas fa-book-dead"></i>   Granny got you a Scary story</h1></h1>
</div>

    
	<textarea id="text-to-speech">
    {scary_result}
    </textarea>

        <div><button type="button" onclick="textToAudio()"><i class="fas fa-volume-up"></i>   Narrate</button>
        <button onclick="saveTextAsFile()"><i class="fas fa-download"></i>   Download The Story</button>
        <!-- Button trigger modal -->
        <button type="button" data-toggle="modal" data-target="#exampleModalCenter"><i class="fas fa-share-alt"></i>    Share</button>
        <button type="button" data-toggle="modal" data-target="#exampleModalLong"><i class="fas fa-exclamation-circle"></i>    Grammatical Errors</button>
        <button type="button" data-toggle="modal" data-target=".bd-example-modal-lg"><i class="fas fa-project-diagram"></i>    Add To Wall</button>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <iframe frameborder="0" style="height:500px;width:99%;border:none;" src='https://forms.zohopublic.in/maliciousyunk/form/Clientreview/formperma/rSA2h2eUY9ktKDEIlqXnvPUPMlE5uGuWe_EZ0bTfjDM'></iframe>
    </div>
  </div>
</div>


<!-- Modal for sharing -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
      <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data={share}"><br/></br>
       <input type="text" value="{share}" id="url" size="30" readonly>
        <div id="share-buttons">
        <!-- Email -->
    <a href="mailto:?Subject=Simple Share Buttons&amp;Body=AI%20Generated%20SScary%20Story%20 {share}">
        <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" />
    </a>

        <!-- Facebook -->
    <a href="http://www.facebook.com/sharer.php?u={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" />
    </a>

        <!-- LinkedIn -->
    <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" />
    </a>

        <!-- Print -->
    <a href="javascript:;" onclick="window.print()">
        <img src="https://simplesharebuttons.com/images/somacro/print.png" alt="Print" />
    </a>

        <!-- Reddit -->
    <a href="http://reddit.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" />
    </a>

        <!-- StumbleUpon-->
    <a href="http://www.stumbleupon.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" />
    </a>
    
    <!-- Tumblr-->
    <a href="http://www.tumblr.com/share/link?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/tumblr.png" alt="Tumblr" />
    </a>
     
    <!-- Twitter -->
    <a href="https://twitter.com/share?url={share};text=AI%20Generated%20Story&amp;hashtags=granny" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" />
    </a>


        </div>
        
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="copy_that()">Copy</button>
      </div>
    </div>
  </div>
</div>
</div>


<!-- Modal for grammar check-->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
      <font color="black">
        <h5 class="modal-title" id="exampleModalLongTitle">Possible Grammatical Errors</h5>
    </font>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <font color="black">


        {grammatical_errors}


        </font>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>


<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
<script src="/static/js/save_as.js/"></script>
<script src="/static/js/copy_function.js/"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>

</body>
</html>

            '''.format(scary_result=scary_result,share=share,grammatical_errors=grammatical_errors)
    return '''
<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Granny</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <link rel="stylesheet" href="/static/css/style.css/">
    <link rel="stylesheet" href="/static/css/text-glitch-style.css/">
    <link rel="stylesheet" href="/static/css/glitching-granny-image-style.css">
</head>
<body>
    {errors}


        <div id="glitch-granny-text-container">
        <div class="glitch" data-text="G">GRANNY</div>
        <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
            <defs>
            <filter id="glitch" x="0" y="0">
                <feColorMatrix in="SourceGraphic" mode="matrix" values="1 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0" result="r" />
                    
                <feOffset in="r" result="r" dx="-5">
                <animate attributeName="dx" attributeType="XML" values="0; -2; 0; -18; -2; -4; 0 ;-1; 0" dur="1s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 1 0 0 0  0 0 0 0 0  0 0 0 1 0" result="g"/>
                <feOffset in="g" result="g" dx="-5" dy="1">
                <animate attributeName="dx" attributeType="XML" values="0; 0; 0; -3; 0; 8; 0 ;-1; 0" dur="2s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 1 0 0  0 0 0 1 0" result="b"/>
                <feOffset in="b" result="b" dx="5" dy="2">
                <animate attributeName="dx" attributeType="XML" values="0; 3; -1; 4; 0; 2; 0 ;18; 0" dur="4s" repeatCount="indefinite"/>
                </feOffset>
                <feBlend in="r" in2="g" mode="screen" result="blend" />
                <feBlend in="blend" in2="b" mode="screen" result="blend" />
            </filter>
            </defs>
        </svg>
        </div>

    <h1 id="suggest">SUGGEST GRANNY A LINE TO START A STORY WITH</h1><br/>
    <form class="form" method="post" action="/scary">
    <div id="form-container">
        <div class="form-group">
            <!--<textarea name="number1" placeholder="Starting of story" rows="4" cols="50"></textarea>-->
            <textarea name="start_of_story_post_request" placeholder="Starting of story" class="form-control" id="formGroupExampleInput"></textarea></br>
            <div class="slidecontainer">
                <p>Word Limit (<span id="demo"></span> Words)</p><br>
                <input type="range" min="50" max="400" value="225" class="slider" id="myRange" name="word_limit" value="225">  
            </div>
        </div>
        <button type="submit" class="btn btn-primary">Tell me a story</button>
    </div>
    </form>


    <div id="loader" style="display:none">
    <img src="https://webstockreview.net/images/clipart-ghost-sticker-13.gif" height="150" width="150"/>
    <p><i class="fas fa-pencil-alt"></i>  Granny is Writing a Horror Story... </p>
    </div>

    <center>
    <div class="glitch-container">
	<img src="https://static.wikia.nocookie.net/granny/images/2/2c/GrannyRender00000PhotoshopEndo300.png" alt="" class="img-1">
	<img src="https://static.wikia.nocookie.net/granny/images/2/2c/GrannyRender00000PhotoshopEndo300.png" alt="" class="img-2">
	<img src="https://static.wikia.nocookie.net/granny/images/2/2c/GrannyRender00000PhotoshopEndo300.png" alt="" class="img-3">
	
	<div class="line">
		<img src="https://static.wikia.nocookie.net/granny/images/2/2c/GrannyRender00000PhotoshopEndo300.png" alt="" class="img-4">
	</div>
    </center>
		
</div>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
</body>
</html>

    '''.format(errors=errors)


################################################################################
#                                    FUNNY STORIES
################################################################################



@app.route('/funny', methods=["GET", "POST"])
def adder_page_humour():
    global humour_result
    global humour_start_with
    global humour_word_limit
    errors = ""
    if request.method == "POST":
        try:
            humour_start_with = (request.form["start_of_story_post_request"])
        except:
            errors = "Something Unusual"
        try:
            humour_word_limit = int(request.form["word_limit"])
        except:
            errors = "Something Unusual"
        try:
            thread = threading.Thread(target=humour_generate_story)
            thread.start()
            thread.join()
            share = pastebin_share(humour_result,"Funny")
            grammatical_errors = grammar_check(humour_result)
        except:
            result="N/A"
        return '''

<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>GRANNY</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
  <link rel="stylesheet" href="/static/css/humour_style.css/">
  <link rel="stylesheet" href="/static/css/textbox-notebook-effect.css/">
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet">
  <script src="/static/js/tts.js/"></script>

</head>
<body>

<div class="wrapper">
  <h1><h1><i class="fas fa-book-dead"></i>   Granny got you a Funny story</h1></h1>
</div>

    
	<textarea id="text-to-speech">
    {humour_result}
    </textarea>

        <div><button type="button" onclick="textToAudio()"><i class="fas fa-volume-up"></i>   Narrate</button>
        <button onclick="saveTextAsFile()"><i class="fas fa-download"></i>   Download The Story</button>
        <!-- Button trigger modal -->
        <button type="button" data-toggle="modal" data-target="#exampleModalCenter"><i class="fas fa-share-alt"></i>    Share</button>
         <button type="button" data-toggle="modal" data-target="#exampleModalLong"><i class="fas fa-exclamation-circle"></i>    Grammatical Errors</button>
        <button type="button" data-toggle="modal" data-target=".bd-example-modal-lg"><i class="fas fa-project-diagram"></i>    Add To Wall</button>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <iframe frameborder="0" style="height:500px;width:99%;border:none;" src='https://forms.zohopublic.in/maliciousyunk/form/Clientreview/formperma/rSA2h2eUY9ktKDEIlqXnvPUPMlE5uGuWe_EZ0bTfjDM'></iframe>
    </div>
  </div>
</div>

<!-- Modal -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
      <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data={share}"><br/></br>
       <input type="text" value="{share}" id="url" size="30" readonly>
        <div id="share-buttons">
        <!-- Email -->
    <a href="mailto:?Subject=Simple Share Buttons&amp;Body=AI%20Generated%20SScary%20Story%20 {share}">
        <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" />
    </a>

        <!-- Facebook -->
    <a href="http://www.facebook.com/sharer.php?u={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" />
    </a>

        <!-- LinkedIn -->
    <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" />
    </a>

        <!-- Print -->
    <a href="javascript:;" onclick="window.print()">
        <img src="https://simplesharebuttons.com/images/somacro/print.png" alt="Print" />
    </a>

        <!-- Reddit -->
    <a href="http://reddit.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" />
    </a>

        <!-- StumbleUpon-->
    <a href="http://www.stumbleupon.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" />
    </a>
    
    <!-- Tumblr-->
    <a href="http://www.tumblr.com/share/link?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/tumblr.png" alt="Tumblr" />
    </a>
     
    <!-- Twitter -->
    <a href="https://twitter.com/share?url={share};text=AI%20Generated%20Story&amp;hashtags=granny" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" />
    </a>


        </div>
        
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="copy_that()">Copy</button>
      </div>
    </div>
  </div>
</div>
</div>

        
        </div>

        <!-- Modal for grammar check-->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
      <font color="black">
        <h5 class="modal-title" id="exampleModalLongTitle">Possible Grammatical Errors</h5>
    </font>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <font color="black">


        {grammatical_errors}


        </font>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
<script src="/static/js/save_as.js/"></script>
</body>
</html>

            '''.format(humour_result=humour_result,share=share,grammatical_errors=grammatical_errors)
    return '''
<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Granny</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <link rel="stylesheet" href="/static/css/humour_style.css/">
    <link rel="stylesheet" href="/static/css/text-glitch-style.css/">
    <link rel="stylesheet" href="/static/css/glitching-granny-image-style.css">
</head>
<body>
    {errors}


        <div id="glitch-granny-text-container">
        <div class="glitch" data-text="G">GRANNY</div>
        <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
            <defs>
            <filter id="glitch" x="0" y="0">
                <feColorMatrix in="SourceGraphic" mode="matrix" values="1 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0" result="r" />
                    
                <feOffset in="r" result="r" dx="-5">
                <animate attributeName="dx" attributeType="XML" values="0; -2; 0; -18; -2; -4; 0 ;-1; 0" dur="1s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 1 0 0 0  0 0 0 0 0  0 0 0 1 0" result="g"/>
                <feOffset in="g" result="g" dx="-5" dy="1">
                <animate attributeName="dx" attributeType="XML" values="0; 0; 0; -3; 0; 8; 0 ;-1; 0" dur="2s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 1 0 0  0 0 0 1 0" result="b"/>
                <feOffset in="b" result="b" dx="5" dy="2">
                <animate attributeName="dx" attributeType="XML" values="0; 3; -1; 4; 0; 2; 0 ;18; 0" dur="4s" repeatCount="indefinite"/>
                </feOffset>
                <feBlend in="r" in2="g" mode="screen" result="blend" />
                <feBlend in="blend" in2="b" mode="screen" result="blend" />
            </filter>
            </defs>
        </svg>
        </div>


    <h1 id="suggest">SUGGEST GRANNY A LINE TO START A STORY WITH</h1><br/>
    <form class="form" method="post" action="/funny">
    <div id="form-container">
        <div class="form-group">
            <!--<textarea name="number1" placeholder="Starting of story" rows="4" cols="50"></textarea>-->
            <textarea name="start_of_story_post_request" placeholder="Starting of story" class="form-control" id="formGroupExampleInput"></textarea></br>
            <div class="slidecontainer">
                <p>Word Limit (<span id="demo"></span> Words)</p><br>
                <input type="range" min="50" max="400" value="225" class="slider" id="myRange" name="word_limit" value="225">  
            </div>
        </div>
        <button type="submit" class="btn btn-primary">Tell me a story</button>
    </div>
    </form>


    <div id="loader" style="display:none">
    <img src="https://media1.giphy.com/media/1YcLOSW6JCNdsfSr5E/200w.gif" height="200" width="200"/>
    <p><i class="fas fa-pencil-alt"></i>  Granny is Writing a Funny Story... </p>
    </div>


<img src="https://1.bp.blogspot.com/-6amFcLT2Y7g/X8-PQW8rMoI/AAAAAAAABus/y9veH5l82csDkITho7RLFwd0P_9GiCxDwCLcBGAsYHQ/s320/angry_granny.gif"/>


    <center>
<img src=""/>
</center>

<!-- partial -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
</body>
</html>

    '''.format(errors=errors)

################################################################################
#                              SCIFI STORIES
################################################################################

@app.route('/scifi', methods=["GET", "POST"])
def adder_page_scifi():
    global scifi_result
    global scifi_start_with
    global scifi_word_limit
    errors = ""
    if request.method == "POST":
        try:
            scifi_start_with = (request.form["start_of_story_post_request"])
        except:
            errors = "Something Unusual"
        try:
            scifi_word_limit = int(request.form["word_limit"])
        except:
            errors = "Something Unusual"
        try:
            thread = threading.Thread(target=scifi_generate_story)
            thread.start()
            thread.join()
            share = pastebin_share(scifi_result,"Scifi")
            grammatical_errors = grammar_check(scifi_result)
        except:
            result="N/A"
        return '''

<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>GRANNY</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
  <link rel="stylesheet" href="/static/css/scifi_style.css/">
  <link rel="stylesheet" href="/static/css/textbox-notebook-effect.css/">
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet">
  <script src="/static/js/tts.js/"></script>

</head>
<body>

<div class="wrapper">
  <h1><h1><i class="fas fa-book-dead"></i>   Granny got you a Scifi story</h1></h1>
</div>

    
	<textarea id="text-to-speech">
    {scifi_result}
    </textarea>

        <div><button type="button" onclick="textToAudio()"><i class="fas fa-volume-up"></i>   Narrate</button>
        <button onclick="saveTextAsFile()"><i class="fas fa-download"></i>   Download The Story</button>
        <!-- Button trigger modal -->
        <button type="button" data-toggle="modal" data-target="#exampleModalCenter"><i class="fas fa-share-alt"></i>    Share</button>
        <button type="button" data-toggle="modal" data-target="#exampleModalLong"><i class="fas fa-exclamation-circle"></i>    Grammatical Errors</button>
        <button type="button" data-toggle="modal" data-target=".bd-example-modal-lg"><i class="fas fa-project-diagram"></i>    Add To Wall</button>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <iframe frameborder="0" style="height:500px;width:99%;border:none;" src='https://forms.zohopublic.in/maliciousyunk/form/Clientreview/formperma/rSA2h2eUY9ktKDEIlqXnvPUPMlE5uGuWe_EZ0bTfjDM'></iframe>
    </div>
  </div>
</div>

<!-- Modal -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
      <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data={share}"><br/></br>
       <input type="text" value="{share}" id="url" size="30" readonly>
        <div id="share-buttons">
        <!-- Email -->
    <a href="mailto:?Subject=Simple Share Buttons&amp;Body=AI%20Generated%20SScary%20Story%20 {share}">
        <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" />
    </a>

        <!-- Facebook -->
    <a href="http://www.facebook.com/sharer.php?u={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" />
    </a>

        <!-- LinkedIn -->
    <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url={share}" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" />
    </a>

        <!-- Print -->
    <a href="javascript:;" onclick="window.print()">
        <img src="https://simplesharebuttons.com/images/somacro/print.png" alt="Print" />
    </a>

        <!-- Reddit -->
    <a href="http://reddit.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" />
    </a>

        <!-- StumbleUpon-->
    <a href="http://www.stumbleupon.com/submit?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" />
    </a>
    
    <!-- Tumblr-->
    <a href="http://www.tumblr.com/share/link?url={share};title=GRANNY" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/tumblr.png" alt="Tumblr" />
    </a>
     
    <!-- Twitter -->
    <a href="https://twitter.com/share?url={share};text=AI%20Generated%20Story&amp;hashtags=granny" target="_blank">
        <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" />
    </a>


        </div>
        
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="copy_that()">Copy</button>
      </div>
    </div>
  </div>
</div>
</div>

        
        </div>

<!-- Modal for grammar check-->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
      <font color="black">
        <h5 class="modal-title" id="exampleModalLongTitle">Possible Grammatical Errors</h5>
    </font>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <font color="black">


        {grammatical_errors}


        </font>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
<script src="/static/js/save_as.js/"></script>
<script src="/static/js/copy_function.js/"></script>
</body>
</html>

            '''.format(scifi_result=scifi_result,share=share,grammatical_errors=grammatical_errors)
    return '''
<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Granny</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <link rel="stylesheet" href="/static/css/scifi_style.css/">
    <link rel="stylesheet" href="/static/css/text-glitch-style.css/">
    <link rel="stylesheet" href="/static/css/glitching-granny-image-style.css">
</head>
<body>
    {errors}


        <div id="glitch-granny-text-container">
        <div class="glitch" data-text="G">GRANNY</div>
        <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
            <defs>
            <filter id="glitch" x="0" y="0">
                <feColorMatrix in="SourceGraphic" mode="matrix" values="1 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0" result="r" />
                    
                <feOffset in="r" result="r" dx="-5">
                <animate attributeName="dx" attributeType="XML" values="0; -2; 0; -18; -2; -4; 0 ;-1; 0" dur="1s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 1 0 0 0  0 0 0 0 0  0 0 0 1 0" result="g"/>
                <feOffset in="g" result="g" dx="-5" dy="1">
                <animate attributeName="dx" attributeType="XML" values="0; 0; 0; -3; 0; 8; 0 ;-1; 0" dur="2s" repeatCount="indefinite"/>
                </feOffset>
                <feColorMatrix in="SourceGraphic" mode="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 1 0 0  0 0 0 1 0" result="b"/>
                <feOffset in="b" result="b" dx="5" dy="2">
                <animate attributeName="dx" attributeType="XML" values="0; 3; -1; 4; 0; 2; 0 ;18; 0" dur="4s" repeatCount="indefinite"/>
                </feOffset>
                <feBlend in="r" in2="g" mode="screen" result="blend" />
                <feBlend in="blend" in2="b" mode="screen" result="blend" />
            </filter>
            </defs>
        </svg>
        </div>

    <h1 id="suggest">SUGGEST GRANNY A LINE TO START A STORY WITH</h1><br/>
    <form class="form" method="post" action="/scifi">
    <div id="form-container">
        <div class="form-group">
            <!--<textarea name="number1" placeholder="Starting of story" rows="4" cols="50"></textarea>-->
            <textarea name="start_of_story_post_request" placeholder="Starting of story" class="form-control" id="formGroupExampleInput"></textarea></br>
            <div class="slidecontainer">
                <p>Word Limit (<span id="demo"></span> Words)</p><br>
                <input type="range" min="50" max="400" value="225" class="slider" id="myRange" name="word_limit" value="225">  
            </div>
        </div>
        <button type="submit" class="btn btn-primary">Tell me a story</button>
    </div>
    </form>


    <div id="loader" style="display:none">
    <img src="https://1.bp.blogspot.com/-mZ8iF5zav0w/X8-PTwg3EyI/AAAAAAAABu0/GW1KVkmX9nQf9NQW_FTF8qbA6--iicw_gCLcBGAsYHQ/s320/flying_granny.gif" height="200" width="250"/>
    <p><i class="fas fa-pencil-alt"></i>  Granny is Writing a Scifi Story... </p>
    </div>





  <img src="https://1.bp.blogspot.com/-2mPPg1BI9RM/X8dCSj0AbLI/AAAAAAAABuI/IwtAbLi62MIElNlZqTdVBKVcRYSu_gqqACLcBGAsYHQ/s320/oie_282223EToXDaF.gif"/>
		
</div> <!-- /.glitch-container -->

<!-- partial -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/5de545e21a.js" crossorigin="anonymous"></script>
<script src="/static/js/script.js/"></script>
</body>
</html>

    '''.format(errors=errors)


if __name__ == '__main__':
    app.run()<jupyter_output><empty_output>
{'fraction_non_alphanumeric': 0.19020079277405938, 'fraction_numerical': 0.03798167522256157, 'mean_word_length': 3.5412762818148287, 'pattern_counts': {'":': 3, '<': 888, '<?xml version=': 0, '>': 889, 'https://': 115, 'lorem ipsum': 0, 'www.': 19, 'xml': 3}, 'pii_count': 0, 'substrings_counts': 3, 'word_list_counts': {'cursed_substrings.json': 30, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'chain_length': '8', 'dir': 'jupyter-structured-clean-dedup', 'id': '653062', 'license': 'MIT', 'n_tokens_mistral': 23649, 'n_tokens_neox': 21724, 'n_words': 3841, 'path': 'GRANNY.ipynb', 'repo_name': 'ekagrashukla/GRANNY-GPT2-Based-Multiple_Genre-Story-Generator-Web-Application', 'size': '63140'}