PowerDNS-Admin/powerdnsadmin/templates/base.html
Andrew Nimmo 680e4cf431
Avoid Safari telephone number detection
Using PowerDNS-Admin on an iPad with Safari can cause incorrect identification of some record data as a telephone number. When submitted, the record with the incorrectly identified data causes an error because of the additional markup present on the submitted data. This was noted in particular with the SOA record. 

The proposed change is to add the Safari meta tag to disable format detection:
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW5
2020-10-14 17:21:59 +02:00

369 lines
14 KiB
HTML

<!DOCTYPE html>
<html>
<head>
{% block head %}
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="icon" href="{{ url_for('static', filename='img/favicon.png') }}">
{% block title %}<title>{{ SITE_NAME }}</title>{% endblock %}
<!-- Get Google Fonts we like -->
{% if OFFLINE_MODE %}
<link rel="stylesheet" href="{{ url_for('static', filename='assets/css/source_sans_pro.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='assets/css/roboto_mono.css') }}">
{% else %}
<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">
{% endif %}
<!-- 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">
<!-- Tell Safari to not recognise telephone numbers -->
<meta name="format-detection" content="telephone=no">
{% 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]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
{% endblock %}
</head>
<body class="hold-transition skin-blue sidebar-mini {% if not SETTING.get('fullscreen_layout') %}layout-boxed{% endif %}">
{% if OFFLINE_MODE %}
{% set gravatar_url = url_for('static', filename='img/gravatar.png') %}
{% elif current_user.email is defined %}
{% set gravatar_url = current_user.email|email_to_gravatar_url(size=80) %}
{% endif %}
<div class="wrapper">
{% block pageheader %}
<header class="main-header">
<!-- Logo -->
<a href="{{ url_for('index.index') }}" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>PD</b>A</span>
<!-- logo for regular state and mobile devices -->
<span class="logo-lg"><b>PowerDNS</b>-Admin</span>
</a>
<!-- 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="push-menu" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<div class="navbar-custom-menu">
{% if current_user.id is defined %}
<ul class="nav navbar-nav">
<!-- User Account: style can be found in dropdown.less -->
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="{{ gravatar_url }}" class="user-image {{ 'offline' if OFFLINE_MODE }}" alt="User Image"/>
<span class="hidden-xs">
{{ current_user.firstname }}
</span>
</a>
<ul class="dropdown-menu">
<li class="user-header">
<img src="{{ gravatar_url }}" class="img-circle {{ 'offline' if OFFLINE_MODE }}" alt="User Image"/>
<p>
{{ current_user.firstname }} {{ current_user.lastname }}
<small>{{ current_user.role.name }}</small>
</p>
</li>
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
<a href="{{ url_for('user.profile') }}" class="btn btn-flat btn-primary">My Profile</a>
</div>
<div class="pull-right">
<a href="{{ url_for('index.logout') }}" class="btn btn-flat btn-warning">Log out</a>
</div>
</li>
</ul>
</li>
</ul>
{% endif %}
</div>
</nav>
</header>
{% endblock %}
<!-- Left side column. contains the logo and sidebar -->
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
{% if current_user.id is defined %}
<div class="user-panel">
<div class="pull-left image">
<img src="{{ gravatar_url }}" class="img-circle" alt="User Image"/>
</div>
<div class="pull-left info">
<p>{{ current_user.firstname }} {{ current_user.lastname }}</p>
<a href="#"><i class="fa fa-circle text-success"></i> Logged In</a>
</div>
</div>
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu" data-widget="tree">
<li class="header">USER ACTIONS</li>
<li class="{{ 'active' if active_page == 'dashboard' else '' }}">
<a href="{{ url_for('dashboard.dashboard') }}"><i class="fa fa-dashboard"></i> <span>Dashboard</span></a>
</li>
{% if SETTING.get('allow_user_create_domain') or current_user.role.name in ['Administrator', 'Operator'] %}
<li class="{{ 'active' if active_page == 'new_domain' else '' }}">
<a href="{{ url_for('domain.add') }}"><i class="fa fa-plus"></i> <span>New Domain</span></a>
</li>
{% endif %}
{% if current_user.role.name in ['Administrator', 'Operator'] %}
<li class="header">ADMINISTRATION</li>
<li class="{{ 'active' if active_page == 'admin_console' else '' }}">
<a href="{{ url_for('admin.pdns_stats') }}"><i class="fa fa-info-circle"></i> <span>PDNS</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_global_search' else '' }}">
<a href="{{ url_for('admin.global_search') }}"><i class="fa fa-search"></i> <span>Global Search</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_history' else '' }}">
<a href="{{ url_for('admin.history') }}"><i class="fa fa-calendar"></i> <span>History</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_domain_template' else '' }}">
<a href="{{ url_for('admin.templates') }}"><i class="fa fa-clone"></i> <span>Domain Templates</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_accounts' else '' }}">
<a href="{{ url_for('admin.manage_account') }}"><i class="fa fa-industry"></i> <span>Accounts</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_users' else '' }}">
<a href="{{ url_for('admin.manage_user') }}"><i class="fa fa-users"></i> <span>Users</span></a>
</li>
<li class="{{ 'active' if active_page == 'admin_keys' else '' }}">
<a href="{{ url_for('admin.manage_keys') }}"><i class="fa fa-key"></i> <span>API Keys</span></a>
</li>
<li class="{{ 'treeview active' if active_page == 'admin_settings' else 'treeview' }}">
<a href="#">
<i class="fa fa-cog"></i> <span>Settings</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu" {% if active_page == 'admin_settings' %}style="display: block;"{% endif %}>
<li><a href="{{ url_for('admin.setting_basic') }}"><i class="fa fa-circle-o"></i></i> <span>Basic</span></a></li>
<li><a href="{{ url_for('admin.setting_records') }}"><i class="fa fa-circle-o"></i> <span>Records</span></a></li>
{% if current_user.role.name == 'Administrator' %}
<li><a href="{{ url_for('admin.setting_pdns') }}"><i class="fa fa-circle-o"></i> <span>PDNS</a></li>
<li><a href="{{ url_for('admin.setting_authentication') }}"><i class="fa fa-circle-o"></i> <span>Authentication</span></a></li>
{% endif %}
</ul>
</li>
{% endif %}
</ul>
{% endif %}
</section>
<!-- /.sidebar -->
</aside>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
{% block dashboard_stat %}
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Dashboard
<small>Control panel</small>
</h1>
<ol class="breadcrumb">
<li><a href="{{ url_for('dashboard.dashboard') }}"><i class="fa fa-dashboard"></i> Home</a></li>
<li class="active">Dashboard</li>
</ol>
</section>
{% endblock %}
{% block content %}
{% endblock %}
</div>
<!-- /.content-wrapper -->
<footer class="main-footer">
<strong><a href="https://github.com/ngoduykhanh/PowerDNS-Admin">PowerDNS-Admin</a></strong> - A PowerDNS web interface with advanced features.
</footer>
</div>
<!-- ./wrapper -->
<script type="text/javascript">
$SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
</script>
<script type="text/javascript">
var PDNS_VERSION = '{{ pdns_version }}'
</script>
{% block scripts %}
{% assets "js_main" -%}
<script type="text/javascript" src="{{ ASSET_URL }}"></script>
{% if SETTING.get('warn_session_timeout') and current_user.is_authenticated %}
<script>
// close the session warning popup when receive
// a boradcast message
var bc = new BroadcastChannel('powerdnsadmin');
bc.addEventListener('message', function (e) {
if (e.data == 'close_session_timeout_modal'){
$("#modal_session_warning").modal('hide');
}
});
// Stay Signed In button click event
$(document.body).on("click", ".button_stay_signed_in", function (e) {
$.get({
url: $.jTimeout().options.extendUrl,
cache: false,
success: function(){
$.jTimeout().resetExpiration();
}
});
$.jTimeout().options.onClickExtend();
});
// Sign Out button click event
$(document.body).on("click", ".button_sign_out", function (e) {
window.location.replace("{{ url_for('index.logout') }}");
});
// Things happen when session warning popup shown
$(document).on('show.bs.modal','#modal_session_warning', function () {
var secondsLeft = jTimeout.getSecondsTillExpiration();
var t = timer($('#modal-time'), secondsLeft);
$(this).on('hidden.bs.modal', function () {
clearInterval(t);
$('#modal-time').text("");
$(this).off('hidden.bs.modal');
});
});
// jTimeout definition
$(function(){
$.jTimeout({
flashTitle: true,
flashTitleSpeed: 500,
flashingTitleText: '**WARNING**',
originalTitle: document.title,
timeoutAfter: {{ SETTING.get('session_timeout')|int * 60 }},
secondsPrior: 60,
heartbeat: 1,
extendOnMouseMove: true,
mouseDebounce: 30,
extendUrl: '{{ url_for("index.ping") }}',
logoutUrl: '{{ url_for("index.logout") }}',
loginUrl: '{{ url_for("index.login") }}',
onClickExtend: function(){
// broadcast a message to tell other tabes
// close the session warning popup
var bc = new BroadcastChannel('powerdnsadmin');
bc.postMessage('close_session_timeout_modal');
},
onMouseMove: function(){
// if the mouse is moving while popup is present, we
// don't extend the session.
if (!$('#modal_session_warning').hasClass('in')) {
$.get({
url: $.jTimeout().options.extendUrl,
cache: false,
success: function () {
$.jTimeout().resetExpiration();
}
});
}
},
onTimeout: function(jTimeout){
window.location.replace("{{ url_for('index.logout') }}");
},
onPriorCallback: function(jTimeout){
$("#modal_session_warning").modal('show');;
},
onSessionExtended:function(jTimeout){
$("#modal_session_warning").modal('hide');
}
});
});
</script>
{% endif %}
{%- endassets %}
{% endblock %}
{% block extrascripts %}
{% endblock %}
{% block defaultmodals %}
<div class="modal fade modal-danger" id="modal_error">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Error</h4>
</div>
<div class="modal-body">
<p></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-flat btn-default pull-right"
data-dismiss="modal">Close</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<div class="modal fade modal-success" id="modal_success">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Success</h4>
</div>
<div class="modal-body">
<p></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-flat btn-default pull-right"
data-dismiss="modal">Close</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<!-- /.session-warning-modal -->
<div class="modal fade modal-warning" data-backdrop="static" id="modal_session_warning">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Session timeout warning</h4>
</div>
<div class="modal-body">
<p>Your session is about to expire. You will be automatically signed out in</p>
<h3><span id="modal-time"></span></h3>
<p>To coninue your ssession, select <strong>Stay Signed In</strong></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-flat btn-danger pull-left button_stay_signed_in"
data-dismiss="modal">Stay Signed In</button>
<button type="button" class="btn btn-flat btn-default pull-right button_sign_out"
data-dismiss="modal">Sign Out</button>
</div>
</div>
<!-- /.session-warning-modal-content -->
</div>
<!-- /.session-warning-modal-dialog -->
</div>
<!-- /.session-warning-modal -->
{% endblock %}
{% block modals %}
{% endblock %}
</body>
</html>