app.py

__author__ = 'Taneem Jan, taneemishere.github.io'

import gradio as gr
import main_program


# our model's i/o method that take image from gradio interface's inputs.Image()
def model_interface(image):
    return main_model(image)


# main method that call the main_program where code is generated and then compiled
def main_model(input_image):
    result = main_program.main_method(input_image)
    return result


interface_title = "<br> <p style='margin: 0% 8% 0% 8%'>HTML Code Generation from Images with Deep Neural Networks</p>"
interface_description = """<p style='margin: 0% 8% 2% 8%; text-align: justify;text-justify: inter-word;'> Writing 
code in a programming language for a designed mockup or a graphical user interface created by designers and UI 
engineers, is done mostly by developers to build and develop custom websites and software. The development work is 
not approachable by those unfamiliar with programming, to drive these personas capable of designing and developing 
the code bases and website structures we come up with an automated system. In this work, we showed and proposed that 
methods of deep learning and computer vision can be grasped to train a model that will automatically generate HTML 
code from a single input mockup image and try to build an end-to-end automated system with around 88% of accuracy for 
developing the structures of web pages.</p> """

interface_article = """<div style='text-align: center;'> <br><br><a href='https://twitter.com/taneemishere' 
target='_blank'>Developed by Taneem Jan</a> </div> 
<div style='text-align: center;'> <a href='https://taneemishere.github.io/projects/project-one.html' 
target='_blank'>Paper</a> &ensp; &emsp; <a href='https://github.com/taneemishere/html-code-generation-from-images-with-deep-neural-networks' 
target='_blank'>Code</a> </div>
"""

# a gradio interface to convert a image to HTML Code
interface = gr.Interface(
    model_interface,
    inputs='image',
    outputs='text',
    allow_flagging="manual",
    title=interface_title,
    description=interface_description,
    article=interface_article
)

interface.launch(share=False)