""" Dash Server """

import dash
import dash_bootstrap_components as dbc
from dash import dcc
from dash import html
from flask.app import Flask

from map_handler import DASH_LOG_LEVEL
from map_handler import cache
from map_handler import PATHNAME
from map_handler import HOSTNAME

from router import *

import logging
logging.basicConfig(level=DASH_LOG_LEVEL)


fontawesome = 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css'
leaflet = "https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.2.0/leaflet.css"
html2canvas = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"
jQuery = 'https://code.jquery.com/jquery-3.6.0.slim.min.js'

srv = Flask(__name__)
app = dash.Dash(__name__,
                external_scripts=[jQuery, html2canvas],
                external_stylesheets=[dbc.themes.BOOTSTRAP,
                                      dbc.themes.GRID,
                                      fontawesome,
                                      leaflet,
                                     ],
                url_base_pathname=PATHNAME,
                server=srv,
                prevent_initial_callbacks=True
                )
app.css.config.serve_locally = True
app.scripts.config.serve_locally = True
app.config.suppress_callback_exceptions = True
server = app.server

cache.init_app(server)
# cache.app = app

try:
    cache.clear()
except Exception as e:
    logging.error('CACHE CLEAR ERROR:', str(e))
    pass

app.index_string = """
<!DOCTYPE html>
<html>
    <head>
        <script>
            L_PREFER_CANVAS=true;
            L_DISABLE_3D=true;
            L_SCROLL_WHEEL_ZOOM=false;

            HTMLCanvasElement.prototype.getContext = function(origFn) {
            return function(type, attribs) {
            attribs = attribs || {};
            attribs.preserveDrawingBuffer = true;
            return origFn.call(this, type, attribs);
             };
            }(HTMLCanvasElement.prototype.getContext);
        </script>
        <!-- Global site tag (gtag.js) - Google Analytics -->
        <!--
        <script async src="https://www.googletagmanager.com/gtag/js?id=G-5V3R8V4021"></script>
        <script>
          window.dataLayer = window.dataLayer || [];
          function gtag(){dataLayer.push(arguments);}
          gtag('js', new Date());

          gtag('config', 'G-5V3R8V4021');
        </script>
        -->
        {%metas%}
        <title>{%title%}</title>
        {%favicon%}
        {%css%}
    </head>
    <body>
        {%app_entry%}
        <footer>
            {%config%}
            {%scripts%}
            {%renderer%}
        </footer>
    </body>
</html>
"""
logging.debug('SERVER: start creating app layout')

#SET APP LAYOUT TO BE POPULATED
app.layout = html.Div([dcc.Location(id="url", refresh=False)], id="content")
    
logging.debug('SERVER: stop creating app layout')

from tabs.forecast_callbacks import *
from tabs.evaluation_callbacks import *
from tabs.observations_callbacks import *
from tabs.generic_callbacks import *

if __name__ == '__main__':
    app.run_server(debug=True, host=HOSTNAME, port=7778)
