acad28b623
- npm build does now also include building css files. - Source javascript and css are now defined in the source directories (eveai_app or eveai_chat_client), and automatically built for use with nginx - eveai.css is now split into several more manageable files (per control type)
91 lines
3.8 KiB
HTML
91 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}EveAI Chat{% endblock %}</title>
|
|
|
|
<link href="{{url_for('static', filename='dist/chat-client.css')}}" rel="stylesheet" />
|
|
|
|
<!-- Custom theme colors from tenant settings -->
|
|
<style>
|
|
:root {
|
|
--primary-color: {{ customisation.primary_color|default('#007bff') }};
|
|
--secondary-color: {{ customisation.secondary_color|default('#6c757d') }};
|
|
--background-color: {{ customisation.background_color|default('#ffffff') }};
|
|
--text-color: {{ customisation.text_color|default('#212529') }};
|
|
--sidebar-color: {{ customisation.sidebar_color|default('#f8f9fa') }};
|
|
--sidebar-background: {{ customisation.sidebar_background|default('#2c3e50') }};
|
|
--gradient-start-color: {{ customisation.gradient_start_color|default('#f5f7fa') }};
|
|
--gradient-end-color: {{ customisation.gradient_end_color|default('#c3cfe2') }};
|
|
--markdown-background-color: {{ customisation.markdown_background_color|default('transparent') }};
|
|
--markdown-text-color: {{ customisation.markdown_text_color|default('#ffffff') }};
|
|
}
|
|
</style>
|
|
|
|
{% block head %}{% endblock %}
|
|
</head>
|
|
<body>
|
|
<div id="app" class="app-container" data-vue-app="true">
|
|
<!-- Left sidebar - never changes -->
|
|
<div class="sidebar">
|
|
<div class="sidebar-logo">
|
|
<img src="{{ tenant_make.logo_url|default('') }}" alt="{{ tenant_make.name|default('Logo') }}">
|
|
</div>
|
|
<div class="sidebar-make-name">
|
|
{{ tenant_make.name|default('') }}
|
|
</div>
|
|
<div id="language-selector-container"></div>
|
|
<div class="sidebar-explanation" v-html="compiledExplanation"></div>
|
|
</div>
|
|
|
|
<!-- Right content area - contains the chat client -->
|
|
<div class="content-area">
|
|
<div class="chat-container">
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="{{url_for('static', filename='dist/chat-client.js')}}"></script>
|
|
<script>
|
|
// Maak ondersteunde talen beschikbaar voor de client
|
|
window.config = {
|
|
supportedLanguages: [
|
|
{% for lang_code in config.SUPPORTED_LANGUAGES %}
|
|
{
|
|
code: "{{ lang_code }}",
|
|
name: "{{ config.SUPPORTED_LANGUAGE_DETAILS[config.SUPPORTED_LANGUAGES_FULL[loop.index0]]['iso 639-1'] }}",
|
|
flag: "{{ config.SUPPORTED_LANGUAGE_DETAILS[config.SUPPORTED_LANGUAGES_FULL[loop.index0]]['flag'] }}"
|
|
}{% if not loop.last %},{% endif %}
|
|
{% endfor %}
|
|
]
|
|
};
|
|
|
|
// Create Vue app and make it available globally
|
|
window.__vueApp = Vue.createApp({
|
|
data() {
|
|
return {
|
|
explanation: `{{ customisation.sidebar_markdown|default('') }}`
|
|
}
|
|
},
|
|
computed: {
|
|
compiledExplanation: function() {
|
|
// Handle different versions of the marked library
|
|
if (typeof marked === 'function') {
|
|
return marked(this.explanation);
|
|
} else if (marked && typeof marked.parse === 'function') {
|
|
return marked.parse(this.explanation);
|
|
} else {
|
|
console.error('Marked library not properly loaded');
|
|
return this.explanation; // Fallback to raw text
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{% block scripts %}{% endblock %}
|
|
</body>
|
|
</html>
|