Add webassets support

Also updates AdminLTE to latest stable version.

Signed-off-by: Felix Kaechele <felix@kaechele.ca>
This commit is contained in:
Felix Kaechele 2018-06-10 15:16:28 +02:00
parent 396075efda
commit 1bf869f508
10 changed files with 112 additions and 93 deletions

3
.gitignore vendored
View File

@ -36,3 +36,6 @@ tmp/*
pdns.db
node_modules
.webassets-cache
app/static/generated

View File

@ -3,10 +3,14 @@ from flask import Flask, request, session, redirect, url_for
from flask_login import LoginManager
from flask_sqlalchemy import SQLAlchemy
from app.assets import assets
app = Flask(__name__)
app.config.from_object('config')
app.wsgi_app = ProxyFix(app.wsgi_app)
assets.init_app(app)
#### CONFIGURE LOGGER ####
from app.lib.log import logger
logging = logger('powerdns-admin', app.config['LOG_LEVEL'], app.config['LOG_FILE']).config()

67
app/assets.py Normal file
View File

@ -0,0 +1,67 @@
from flask_assets import Bundle, Environment, Filter
class ConcatFilter(Filter):
"""
Filter that merges files, placing a semicolon between them.
Fixes issues caused by missing semicolons at end of JS assets, for example
with last statement of jquery.pjax.js.
"""
def concat(self, out, hunks, **kw):
out.write(';'.join([h.data() for h, info in hunks]))
css_login = Bundle(
'node_modules/bootstrap/dist/css/bootstrap.css',
'node_modules/font-awesome/css/font-awesome.css',
'node_modules/ionicons/dist/css/ionicons.css',
'node_modules/icheck/skins/square/blue.css',
'node_modules/admin-lte/dist/css/AdminLTE.css',
filters=('cssmin','cssrewrite'),
output='generated/login.css'
)
js_login = Bundle(
'node_modules/jquery/dist/jquery.js',
'node_modules/bootstrap/dist/js/bootstrap.js',
'node_modules/icheck/icheck.js',
filters=(ConcatFilter, 'jsmin'),
output='generated/login.js'
)
css_main = Bundle(
'node_modules/bootstrap/dist/css/bootstrap.css',
'node_modules/font-awesome/css/font-awesome.css',
'node_modules/ionicons/dist/css/ionicons.css',
'node_modules/datatables.net-bs/css/dataTables.bootstrap.css',
'node_modules/icheck/skins/square/blue.css',
'node_modules/multiselect/css/multi-select.css',
'node_modules/admin-lte/dist/css/AdminLTE.css',
'node_modules/admin-lte/dist/css/skins/_all-skins.css',
'custom/css/custom.css',
filters=('cssmin','cssrewrite'),
output='generated/main.css'
)
js_main = Bundle(
'node_modules/jquery/dist/jquery.js',
'node_modules/jquery-ui-dist/jquery-ui.js',
'node_modules/bootstrap/dist/js/bootstrap.js',
'node_modules/datatables.net/js/jquery.dataTables.js',
'node_modules/datatables.net-bs/js/dataTables.bootstrap.js',
'node_modules/jquery-sparkline/jquery.sparkline.js',
'node_modules/jquery-slimscroll/jquery.slimscroll.js',
'node_modules/icheck/icheck.js',
'node_modules/fastclick/lib/fastclick.js',
'node_modules/moment/moment.js',
'node_modules/admin-lte/dist/js/adminlte.js',
'node_modules/multiselect/js/jquery.multi-select.js',
'custom/js/custom.js',
filters=(ConcatFilter, 'jsmin'),
output='generated/main.js'
)
assets = Environment()
assets.register('js_login', js_login)
assets.register('css_login', css_login)
assets.register('js_main', js_main)
assets.register('css_main', css_main)

View File

@ -6,30 +6,13 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
{% block title %}<title>DNS Control Panel</title>{% endblock %}
<!-- Get Google Fonts we like -->
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css"/>
<link href='//fonts.googleapis.com/css?family=Roboto+Mono:400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto+Mono:400,300,700">
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.6 -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/bootstrap/css/bootstrap.min.css') }}">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<!-- DataTables -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/plugins/datatables/dataTables.bootstrap.css') }}">
<!-- Theme style -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/dist/css/AdminLTE.min.css') }}">
<!-- AdminLTE Skins. Choose a skin from the css/skins
folder instead of downloading all of them to reduce the load. -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/dist/css/skins/_all-skins.min.css') }}">
<!-- iCheck -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/plugins/iCheck/all.css') }}">
<!-- multiselect -->
<link rel="stylesheet" href="{{ url_for('static', filename='multiselect/css/multi-select.css') }}">
<!-- custom CSS -->
<link rel="stylesheet" href="{{ url_for('static', filename='custom/css/custom.css') }}">
{% assets "css_main" -%}
<link rel="stylesheet" href="{{ ASSET_URL }}">
{%- endassets %}
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
@ -52,7 +35,7 @@
<!-- Header Navbar: style can be found in header.less -->
<nav class="navbar navbar-static-top">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
@ -120,7 +103,7 @@
</div>
</div>
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu">
<ul class="sidebar-menu" data-widget="tree">
<li class="header">USER ACTIONS</li>
<li><a href="{{ url_for('dashboard') }}"><i class="fa fa-dashboard"></i> <span>Dashboard</span></a></li>
{% if current_user.role.name == 'Administrator' %}
@ -165,37 +148,9 @@
$SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
</script>
{% block scripts %}
<!-- jQuery 2.2.0 -->
<script src="{{ url_for('static', filename='adminlte2/plugins/jQuery/jQuery-2.2.0.min.js') }}"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
$.widget.bridge('uibutton', $.ui.button);
</script>
<!-- Bootstrap 3.3.6 -->
<script src="{{ url_for('static', filename='adminlte2/bootstrap/js/bootstrap.min.js') }}"></script>
<!-- DataTables -->
<script src="{{ url_for('static', filename='adminlte2/plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ url_for('static', filename='adminlte2/plugins/datatables/dataTables.bootstrap.min.js') }}"></script>
<!-- DataTables Natural Sort -->
<script src="{{ url_for('static', filename='adminlte2/plugins/datatables/extensions/NaturalSort/natural.min.js') }}"></script>
<!-- Sparkline -->
<script src="{{ url_for('static', filename='adminlte2/plugins/sparkline/jquery.sparkline.min.js') }}"></script>
<!-- Slimscroll -->
<script src="{{ url_for('static', filename='adminlte2/plugins/slimScroll/jquery.slimscroll.min.js') }}"></script>
<!-- iCheck 1.0.1 -->
<script src="{{ url_for('static', filename='adminlte2/plugins/iCheck/icheck.min.js') }}"></script>
<!-- FastClick -->
<script src="{{ url_for('static', filename='adminlte2/plugins/fastclick/fastclick.js') }}"></script>
<!-- Moment.js -->
<script src="{{ url_for('static', filename='adminlte2/plugins/daterangepicker/moment.min.js') }}"></script>
<!-- AdminLTE App -->
<script src="{{ url_for('static', filename='adminlte2/dist/js/app.min.js') }}"></script>
<!-- Multiselect -->
<script src="{{ url_for('static', filename='multiselect/js/jquery.multi-select.js') }}"></script>
<!-- PowerDNS-Admin custom.js -->
<script src="{{ url_for('static', filename='custom/js/custom.js') }}"></script>
{% assets "js_main" -%}
<script type="text/javascript" src="{{ ASSET_URL }}"></script>
{%- endassets %}
{% endblock %}
{% block extrascripts %}
{% endblock %}

View File

@ -6,16 +6,9 @@
<title>DNS Control Panel - Log In</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.6 -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/bootstrap/css/bootstrap.min.css') }}">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/dist/css/AdminLTE.min.css') }}">
<!-- iCheck -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/plugins/iCheck/square/blue.css') }}">
{% assets "css_login" -%}
<link rel="stylesheet" href="{{ ASSET_URL }}">
{%- endassets %}
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
@ -121,12 +114,9 @@
</div>
<!-- /.login-box -->
<!-- jQuery 2.2.0 -->
<script src="{{ url_for('static', filename='adminlte2/plugins/jQuery/jQuery-2.2.0.min.js') }}"></script>
<!-- Bootstrap 3.3.6 -->
<script src="{{ url_for('static', filename='adminlte2/bootstrap/js/bootstrap.min.js') }}"></script>
<!-- iCheck -->
<script src="{{ url_for('static', filename='adminlte2/plugins/iCheck/icheck.min.js') }}"></script>
{% assets "js_login" -%}
<script type="text/javascript" src="{{ ASSET_URL }}"></script>
{%- endassets %}
<script>
$(function () {
$('input').iCheck({

View File

@ -6,16 +6,9 @@
<title>DNS Control Panel - Register</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.6 -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/bootstrap/css/bootstrap.min.css') }}">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/dist/css/AdminLTE.min.css') }}">
<!-- iCheck -->
<link rel="stylesheet" href="{{ url_for('static', filename='adminlte2/plugins/iCheck/square/blue.css') }}">
{% assets "css_login" -%}
<link rel="stylesheet" href="{{ ASSET_URL }}">
{%- endassets %}
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
@ -89,12 +82,9 @@
</div>
<!-- /.login-box -->
<!-- jQuery 2.2.0 -->
<script src="{{ url_for('static', filename='adminlte2/plugins/jQuery/jQuery-2.2.0.min.js') }}"></script>
<!-- Bootstrap 3.3.6 -->
<script src="{{ url_for('static', filename='adminlte2/bootstrap/js/bootstrap.min.js') }}"></script>
<!-- iCheck -->
<script src="{{ url_for('static', filename='adminlte2/plugins/iCheck/icheck.min.js') }}"></script>
{% assets "js_login" -%}
<script type="text/javascript" src="{{ ASSET_URL }}"></script>
{%- endassets %}
<script>
$(function () {
$('#button_back').click(function(){

View File

@ -29,10 +29,10 @@ if app.config['SAML_ENABLED']:
logging = logger.getLogger(__name__)
# FILTERS
jinja2.filters.FILTERS['display_record_name'] = utils.display_record_name
jinja2.filters.FILTERS['display_master_name'] = utils.display_master_name
jinja2.filters.FILTERS['display_second_to_time'] = utils.display_time
jinja2.filters.FILTERS['email_to_gravatar_url'] = utils.email_to_gravatar_url
app.jinja_env.filters['display_record_name'] = utils.display_record_name
app.jinja_env.filters['display_master_name'] = utils.display_master_name
app.jinja_env.filters['display_second_to_time'] = utils.display_time
app.jinja_env.filters['email_to_gravatar_url'] = utils.email_to_gravatar_url
# Flag for pdns v4.x.x
# TODO: Find another way to do this

View File

@ -26,7 +26,6 @@ RUN apt-get install -y libxml2-dev libxslt1-dev libxmlsec1-dev libffi-dev pkg-co
COPY ./requirements.txt /powerdns-admin/requirements.txt
RUN pip3 install -r requirements.txt
RUN yarn
ADD ./supervisord.conf /etc/supervisord.conf
ADD . /powerdns-admin/

View File

@ -1,3 +1,11 @@
#!/bin/sh
cd /powerdns-admin && ./create_db.py
export LC_ALL=C.UTF-8
export LANG=C.UTF-8
cd /powerdns-admin
./create_db.py
yarn install --pure-lockfile
FLASK_APP=app/__init__.py flask assets build
/usr/bin/supervisord -c /etc/supervisord.conf

View File

@ -1,4 +1,5 @@
Flask==0.12.2
Flask-Assets==0.12
Flask-WTF==0.14.2
Flask-Login==0.4.1
Flask-OAuthlib==0.9.4
@ -17,3 +18,5 @@ gunicorn==19.7.1
python3-saml
pyOpenSSL>=0.15
pytz>=2017.3
cssmin==0.2.0
jsmin==2.2.2