app/views/layouts/base.html.erb
<%#-- copyright
OpenProject is an open source project management software.
Copyright (C) 2012-2024 the OpenProject GmbH
This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License version 3.
OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
Copyright (C) 2006-2013 Jean-Philippe Lang
Copyright (C) 2010-2013 the ChiliProject Team
This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
See COPYRIGHT and LICENSE files for more details.
++#%><!DOCTYPE html>
<% show_decoration = params["layout"].nil? %>
<html xmlns="http://www.w3.org/1999/xhtml"
lang="<%= I18n.locale.to_s %>"
xml:lang="<%= I18n.locale.to_s %>"
class="<%= 'in_modal' unless show_decoration %>">
<head>
<%= render partial: 'layouts/common_head' %>
<!-- project specific tags -->
<%= call_hook :view_layouts_base_html_head %>
<!-- page specific tags -->
<%= content_for(:header_tags) if content_for?(:header_tags) %>
<meta name="current_menu_item" content="<%= current_menu_item %>"/>
<%# Disable prefetching while we have data-turbo=false on body %>
<meta name="turbo-prefetch" content="false">
</head>
<body
class="<%= body_css_classes %> __overflowing_element_container __overflowing_body"
data-relative_url_root="<%= root_path %>"
data-overflowing-identifier=".__overflowing_body"
data-rendered-at="<%= Time.zone.now.iso8601 %>"
data-controller="application"
<%= user_theme_data_attributes %>
>
<%= render partial: 'warning_bar/warning_bar' %>
<noscript>
<div class="top-shelf">
<p>
<span>
<%= op_icon 'icon3 icon-warning' %>
<strong><%= t(:noscript_heading) %></strong>
</span>
<%= t(:noscript_description) %>
<a href="http://www.enable-javascript.com/" target="_blank"><%= t(:noscript_learn_more) %></a>
</p>
</div>
</noscript>
<op-toasts-container></op-toasts-container>
<op-modal-overlay></op-modal-overlay>
<spot-drop-modal-portal></spot-drop-modal-portal>
<% main_menu = render_main_menu(local_assigns.fetch(:menu_name, nil), @project) %>
<% side_displayed = content_for?(:sidebar) || content_for?(:main_menu) || !main_menu.blank? %>
<% initial_classes = initial_menu_classes(side_displayed, show_decoration) %>
<div id="wrapper" style="<%= initial_menu_styles(side_displayed) %>" class="<%= initial_classes %>">
<% if show_decoration %>
<header class="op-app-header<%= ' op-app-header_development' if OpenProject::Configuration.development_highlight_enabled? %>">
<div class="op-app-header--start">
<h1 class="hidden-for-sighted">
<%= t(:label_top_menu) %>
</h1>
<main-menu-toggle></main-menu-toggle>
<a href="" class="hidden-for-sighted skip-navigation-link"
id="skip-navigation--content"
aria-label="<%= I18n.t('js.work_packages.jump_marks.label_content') %>">
<%= I18n.t('js.work_packages.jump_marks.content') %>
</a>
<%= render_top_menu_left %>
</div>
<div class="op-app-header--center">
<%= render_top_menu_center %>
</div>
<div class="op-app-header--end">
<%= call_hook :view_layouts_base_top_menu %>
<%= render_top_menu_right %>
</div>
</header>
<% end %>
<div id="main"
class="<%= initial_classes %>">
<% if (side_displayed && show_decoration) %>
<div
id="main-menu"
class="main-menu"
data-controller="menus--main"
data-application-target="dynamic"
>
<h1 class="hidden-for-sighted"><%= t(:label_main_menu) %></h1>
<main-menu-resizer></main-menu-resizer>
<div id="menu-sidebar">
<%= main_menu %>
<%= content_for :main_menu %>
<%= call_hook :view_layouts_base_main_menu %>
<!-- Sidebar -->
<div id="sidebar" data-menus--main-target="sidebar">
<%= content_for :sidebar %>
<%= call_hook :view_layouts_base_sidebar %>
</div>
</div>
</div>
<% end %>
<div class="content-overlay"></div>
<main id="content-wrapper" class="<%= initial_classes %>">
<%= render_primer_banner_message %>
<% if show_decoration %>
<div id="breadcrumb" class="<%= initial_classes %><%= show_breadcrumb ? ' -show' : '' %>">
<%= you_are_here_info %>
<div id="full_breadcrumbs">
<%= full_breadcrumbs %>
</div>
<%= call_hook :view_layouts_base_breadcrumb %>
</div>
<% end %>
<%= render_flash_messages %>
<% if show_onboarding_modal? %>
<section data-augmented-model-wrapper
data-modal-initialize-now="true"
data-modal-class-name="onboarding-modal">
<%= render partial: '/onboarding/configuration_modal' %>
</section>
<% end %>
<%= content_tag :div,
id: 'content',
class: initial_classes,
data: stimulus_content_data do %>
<h1 class="hidden-for-sighted"><%= t(:label_content) %></h1>
<%= content_for :content_body %>
<% unless local_assigns[:no_layout_yield] %>
<%= yield %>
<% end %>
<%= call_hook :view_layouts_base_content %>
<% end %>
</main>
</div>
<div id="ajax-indicator" style="display:none;"><span><%= t(:label_loading) %></span></div>
</div>
<%# Properly decides main menu expanded state and width before its drawn. Fixes flickering side menu
where menu is first expanded, then being collapsed in angular. %>
<%= nonced_javascript_tag do %>
// execute these lines to prevent flickering when page loads:
(function($) {
var wrapper = $('#wrapper');
var savedMainMenuWidth = window.OpenProject.guardedLocalStorage("openProject-mainMenuWidth");
var mainMenuCollapsed = window.OpenProject.guardedLocalStorage("openProject-mainMenuCollapsed");
if (window.innerWidth < 1012) {
// force hide on load for small desktops
$('.can-hide-navigation').addClass('hidden-navigation');
}
if (mainMenuCollapsed === 'true') {
savedMainMenuWidth = 0;
}
if (savedMainMenuWidth || savedMainMenuWidth === 0) {
document.documentElement.style.setProperty("--main-menu-width", savedMainMenuWidth + 'px');
}
wrapper.show();
// Wrapper for page-specific JS from deprecated inline functions
// no longer available with CSP.
<%= content_for :additional_js_dom_ready %>
}(jQuery));
<% end %>
<div class="op-wide-autocomplete-wrapper"></div>
<%= call_hook :view_layouts_base_body_bottom %>
</body>
</html>