templates/AtechNetCoreBundle/Default/page_layout.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block stylesheets %}
  4. {{ parent() }}
  5. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  6. <link rel="stylesheet" type="text/css" href="{{ asset('bundles/atechnetcore/css/main.css')|appendAssetCache }}">
  7. <style>
  8. .breadcrumb {
  9. margin-bottom: 6px;
  10. padding: 5px 15px;
  11. }
  12. .navbar {
  13. margin-bottom: 6px;
  14. }
  15. .dropdown-submenu {
  16. position: relative;
  17. }
  18. .dropdown-submenu .dropdown-menu {
  19. top: 0;
  20. left: 100%;
  21. margin-top: -1px;
  22. }
  23. .dropdown-inline-submenu {
  24. list-style: none;
  25. width: max-content;
  26. padding-left: 1em;
  27. }
  28. #notification-icon {
  29. cursor: pointer;
  30. }
  31. #notification-icon .label {
  32. font-size: 100%;
  33. font-weight: normal;
  34. padding-top: 0.3em;
  35. }
  36. #notification-panel {
  37. position: absolute;
  38. display: none;
  39. width: 380px;
  40. background-color: #fff;
  41. top: 40px;
  42. right: 5%;
  43. border: 1px solid #bbb;
  44. border-radius: 4px;
  45. }
  46. #notification-panel .notification-list {
  47. max-height: 312px;
  48. overflow-y: scroll;
  49. padding: 0 5px;
  50. }
  51. #notification-panel .show-all-notification {
  52. text-align:center;
  53. background-color: inherit;
  54. width: 100%;
  55. border-top: 1px solid #dedede;
  56. padding: 8px 0px;
  57. border-radius: 0 0 4px 4px;
  58. z-index: 99;
  59. position: absolute;
  60. }
  61. #notification-panel a {
  62. display: block;
  63. padding: 5px 10px;
  64. color: #222;
  65. max-height: 280px;
  66. }
  67. #notification-panel a:hover {
  68. background-color: #eef;
  69. text-decoration: none;
  70. }
  71. #notification-panel a.active {
  72. font-weight: bold;
  73. color: #000;
  74. }
  75. #notification-panel a small {
  76. color: #555;
  77. }
  78. #page-refresh-block {
  79. display: none;
  80. position:relative;
  81. float:right;
  82. top:-31px;
  83. right:15px;
  84. }
  85. #breadcrumb-and-page-refresh {
  86. height:36px;
  87. }
  88. .main-navbar-prod {
  89. border-bottom: 3px solid #00bb00;
  90. }
  91. .main-navbar-dev {
  92. border-bottom: 3px solid #d267ff;
  93. }
  94. </style>
  95. {% endblock %}
  96. {% block title %}
  97. {% apply spaceless %}
  98. {{- parent() -}}
  99. {% if page_title is defined %}
  100. {{- page_title -}}
  101. {% endif %}
  102. {% endapply %}
  103. {% endblock %}
  105. {% block body %}
  106. <nav class="navbar navbar-inverse navbar-static-top main-navbar main-navbar-{{ app.environment }}">
  107. <div class="container-fluid" style="height:36px;">
  108. <div class="navbar-header">
  109. {% if "now"|date('d.m') == '04.05' %}
  110. <a href="{{ path('atech_net_core_dashboard') }}" class="navbar-brand" style="padding-top:8px;"><img src="{{ asset('bundles/atechnetcore/images/darth-vader.png')|appendAssetCache }}" title="May the 4th be with you!" /></a>
  111. {% else %}
  112. <a href="{{ path('atech_net_core_dashboard') }}" class="navbar-brand"><i class="glyphicon glyphicon-home"></i></a>
  113. {% endif %}
  115. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
  116. <span class="sr-only">Toggle navigation</span>
  117. <span class="icon-bar"></span>
  118. <span class="icon-bar"></span>
  119. <span class="icon-bar"></span>
  120. </button>
  121. </div>
  123. <div id="navbar" class="collapse navbar-collapse" aria-expanded="false">
  124. {{ render(controller('App\\AtechNet\\CoreBundle\\Controller\\BaseController::getMenuAction')) }}
  126. <ul class="nav navbar-nav navbar-right">
  127. {% if "now"|date('md') == 214 %}<li><div class="heart" title="Boldog Valentint!"></div></li>{% endif %}
  129. <li>
  130. <div id="notification-icon" class="navbar-text">
  131. <div class="label label-default"><i class="glyphicon glyphicon-envelope"></i> <span id="notification-value">?</span></div>
  132. </div>
  134. <div id="notification-panel"></div>
  135. </li>
  137. <li class="dropdown">
  138. <a href="{{ path('account_edit') }}" class="dropdown-title">
  139. <span class="name">{% trans %}Hello{% endtrans %} <strong>{{ app.user.nickName }}</strong></span>
  141. <i class="fa fa-caret-down"></i>
  142. </a>
  144. <ul class="dropdown-menu">
  145. <li><a href="{{ path('account_edit') }}" data-teszt="profileAccountEditButton">{{ 'Profile' |trans }}</a></li>
  146. <li><a href="{{ path('atech_net_core_user_absence_list') }}" data-teszt="profileUserAbsenceButton">{{ 'User absence' |trans }}</a></li>
  147. <li><a href="{{ path('atech_net_core_user_product_notifications') }}" data-teszt="profileProductNotificationsButton">{{ 'Product notifications' |trans }}</a></li>
  148. <li><a href="{{ path('atech_net_core_signature_generator') }}" data-teszt="profileSignatureGeneratorButton">{{ 'Signature generator' |trans }}</a></li>
  149. <li class="divider"></li>
  150. <li><a href="{{ path('atech_net_core_logout') }}" id="log-out" data-teszt="logoutButton">{% trans %}admin.logout{% endtrans %}</a></li>
  151. </ul>
  152. </li>
  153. </ul>
  154. </div>
  155. </div>
  156. </nav>
  158. <div id="breadcrumb-and-page-refresh" class="container-fluid">
  159. {{ wo_render_breadcrumbs() }}
  161. <div id="page-refresh-block">
  162. <i class="glyphicon glyphicon-time"></i> <a href="#"><i class="glyphicon glyphicon-pause"></i></a> {% trans %}Page refresh is{% endtrans %} <strong><span id="page-refresh-in">0</span></strong>s
  163. </div>
  164. </div>
  166. <div id="content" class="container-fluid">
  167. {% block content %}
  168. <div id="sidebar">
  169. {% block sidebar %}
  170. <div id="navigation">
  171. {{ render(controller('AtechNetCoreBundle/Default/navigation', {'current_page': current_page})) }}
  172. </div>
  173. {% endblock %}
  174. </div>
  175. <div id="section-wrapper">
  176. {% block section_wrapper %}
  177. <div id="section-nav">
  178. {% block section_nav %}
  179. {% if section_title is defined %}<span
  180. class="title">{{ section_title|trans }}</span>{% endif %}
  181. <div class="section-nav-action">{% block section_nav_action %}{% endblock %}</div>
  182. {% endblock %}
  183. </div>
  184. <div id="sections">
  185. {% for flashMessage in app.session.flashbag.get('notice') %}
  186. <div class="flash-notice">{{ flashMessage|trans }}</div>
  187. {% endfor %}
  188. {% block sections %}
  189. {% endblock %}
  190. </div>
  191. {% endblock %}{#section_wrapper#}
  192. </div>
  193. {% endblock %}{#content#}
  194. </div>
  196. <div id="modal-page-refresh" class="modal fade" tabindex="-1" role="dialog">
  197. <div class="modal-dialog" role="document">
  198. <div class="modal-content">
  199. <div class="modal-body text-center text-danger" style="padding: 0;">
  200. <div class="alert alert-info" role="alert" style="margin: 0;"><strong>{{ 'The page will refresh automatically, please wait' |trans }}...</strong></div>
  201. </div>
  202. </div>
  203. </div>
  204. </div>
  206. {% include 'AtechNetCoreBundle/Common/progressBar.html.twig' %}
  207. {% endblock %}{#body#}
  209. {% block javascripts %}
  210. <script>
  211. var progressBarEndpoint = "{{ path('background_jobs-get-job') }}"
  212. var progressBarResetEndpoint = "{{ path('reset_wizard_job') }}"
  213. </script>
  214. <script src="{{ asset('bundles/atechnetcore/js/backgrounJob/progressBar.js')|appendAssetCache }}"></script>
  215. <script src="{{ asset('bundles/atechnetcore/js/ajax-native.js')|appendAssetCache }}"></script>
  216. <script src="{{ asset('bundles/atechnetcore/js/jquery-1.11.2.min.js')|appendAssetCache }}"></script>
  217. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  218. {% if app.environment == 'prod' %}
  219. <script src="https://cdn.ravenjs.com/3.14.2/raven.min.js" crossorigin="anonymous"></script>
  220. <script>Raven.config('https://0a0726bbeb7149c2bfb0c39431121d51@sentry.io/167350').install();</script>
  221. {% endif %}
  222. <script>
  223. $('#navbar > .nav > li.dropdown > a > .fa-caret-down').on('click', function(e) {
  224. if ( $(this).closest('.dropdown').hasClass('clicked') ) {
  225. $(this).closest('.dropdown').removeClass('clicked');
  226. } else {
  227. $(this).closest('.dropdown').addClass('clicked');
  228. }
  230. return false;
  231. });
  233. $('#navbar .dropdown-submenu .fa-caret-down').on('click', function(e) {
  234. if ( $(this).closest('.dropdown-submenu').hasClass('clicked') ) {
  235. $(this).closest('.dropdown-submenu').removeClass('clicked');
  236. } else {
  237. $(this).closest('.dropdown-submenu').addClass('clicked');
  238. }
  240. return false;
  241. });
  243. const addBreadcrumbsWikiPage = (link) => {
  244. let breadcrumbs = document.getElementById('wo-breadcrumbs');
  246. if ( breadcrumbs != null ) {
  247. let li = document.createElement('li');
  248. li.classList.add('item-help', 'pull-right');
  249. li.innerHTML = '<a href="' + link + '" target="_BLANK"><span class="glyphicon glyphicon-question-sign" aria-hidden="true"></span></a>';
  251. breadcrumbs.appendChild(li);
  252. }
  253. };
  255. var notificationUrl = '{{ path('atech_net_core_notification') }}';
  256. var notificationListUrl = '{{ path('atech_net_core_notification_list') }}';
  257. var notificationInactivateUrl = '{{ path('atech_net_core_notification_inactivate', {'id':0}) }}';
  258. var maxNotifications = 10;
  259. let notificationIndexLabel = '{{ "Show all" | trans }}'
  261. $(document).ready(function(){
  262. $('.dropdown-submenu a.dropdown-title').mouseenter( function(e){
  263. $(this).next('ul').show();
  264. }).parent().mouseleave(function(e) {
  265. $(this).children('ul').hide();
  266. });
  267. initNotifications();
  268. $('#notification-icon').click(function() {
  269. var top = $('#notification-icon').position().top + 40;
  270. $('#notification-panel').toggle().css("top", top + "px");
  271. return false;
  272. })
  273. });
  275. function initNotifications() {
  276. $.get(notificationListUrl).done(function(data){
  277. $('#notification-value').text(data.count > maxNotifications ? maxNotifications + '+' : data.count);
  278. if (data.count !== '' && data.count > 0) {
  279. $('#notification-icon > span.label').removeClass('label-default').addClass('label-info');
  280. }
  282. var html ='<div class="notification-list">';
  284. for(var i in data.result) {
  285. if (i >= maxNotifications) {
  286. break;
  287. }
  288. var d = data.result[i];
  289. html += '<a data-id="' + d.id + '" href="'+ d.url + '"'
  290. + (d.active == '1' ? ' class="active" onclick="inactivateNotification(this)"' : '')
  291. + '>' + d.text
  292. + '<br/><small><i class="glyphicon glyphicon-time"></i> '
  293. + d.created +'</small></a>';
  294. }
  296. html +='</div>';
  298. $('#notification-panel').html(html);
  299. $('#notification-panel').append('<a href="' + notificationUrl + '" class="show-all-notification"><b>' + notificationIndexLabel + '</b></a>');
  300. });
  301. }
  303. function inactivateNotification(element) {
  304. var e = $(element);
  305. var id = e.data('id');
  306. var url = notificationInactivateUrl.replace('0', id);
  307. $.get(url).done(function(data) {
  308. e.removeClass('active');
  309. e.removeAttr('onclick');
  310. var nv = $('#notification-value');
  311. if (nv.text() != (maxNotifications + '+')) {
  312. nv.text(nv.text() - 1);
  313. } else {
  314. initNotifications();
  315. }
  316. });
  317. }
  319. function areYouSure(){
  320. return confirm('{{ 'Are you sure?'|trans }}');
  321. }
  323. function copyUrlToClipboard(el) {
  324. var textArea = document.createElement("textarea");
  326. textArea.style.position = 'fixed';
  327. textArea.style.top = 0;
  328. textArea.style.left = 0;
  329. textArea.style.width = '2em';
  330. textArea.style.height = '2em';
  331. textArea.style.padding = 0;
  332. textArea.style.border = 'none';
  333. textArea.style.outline = 'none';
  334. textArea.style.boxShadow = 'none';
  335. textArea.style.background = 'transparent';
  336. textArea.value = el.getAttribute("href");
  338. document.body.appendChild(textArea);
  340. textArea.select();
  342. try {
  343. var successful = document.execCommand('copy');
  344. var msg = successful ? 'Copied' : 'Failed';
  345. el.innerHTML = msg;
  346. setTimeout(() => {
  347. el.innerHTML = '<i class="glyphicon glyphicon-copy"></i>';
  348. }, 5000);
  349. } catch (err) {
  350. alert('Oops, unable to copy');
  351. }
  353. document.body.removeChild(textArea);
  354. }
  356. // Set the name of the hidden property and the change event for visibility
  357. var hidden, visibilityChange;
  359. if ( typeof document.hidden !== "undefined" ) { // Opera 12.10 and Firefox 18 and later support
  360. hidden = "hidden";
  361. visibilityChange = "visibilitychange";
  362. } else if ( typeof document.msHidden !== "undefined" ) {
  363. hidden = "msHidden";
  364. visibilityChange = "msvisibilitychange";
  365. } else if ( typeof document.webkitHidden !== "undefined" ) {
  366. hidden = "webkitHidden";
  367. visibilityChange = "webkitvisibilitychange";
  368. }
  370. function handleVisibilityChange() {
  371. if ( document[hidden] ) {
  372. $('#page-refresh-block a').removeClass('online').addClass('offline');
  373. } else {
  374. $('#page-refresh-block a').removeClass('offline').addClass('online');
  375. }
  376. }
  378. var refreshInterval;
  379. var refreshTime = 0;
  380. var refreshElement = null;
  381. /**
  382. * Counts back from a given time in seconds, adds current value to a given container, than refreshes page
  383. * Timer is reset on mousemove and keypress
  384. * Usage:
  385. * $(document).ready(function(){ countAndRefresh(120); });
  386. *
  387. * @param time
  388. * @param textAreas one or mupltiple text areas, which if has value the timer does not tick
  389. */
  390. function countAndRefresh(time, textAreas) {
  391. let appEnvironment = '{{ app.environment }}';
  393. if (appEnvironment == 'dev' || window.location.href.includes(['web/document']) || window.location.href.includes(['web/billingo-document'])) {
  394. return;
  395. }
  397. //Zero the idle timer on mouse movement.
  398. $(this).mousemove(function (e) {
  399. refreshTime = time;
  401. $('#page-refresh-block a').removeClass('online').removeClass('offline');
  402. }).keypress(function (e) {
  403. refreshTime = time;
  405. $('#page-refresh-block a').removeClass('online').removeClass('offline');
  406. }).scroll(function (e) {
  407. refreshTime = time;
  409. $('#page-refresh-block a').removeClass('online').removeClass('offline');
  410. });
  412. var $refreshBlockControl = $('#page-refresh-block a');
  414. if(textAreas !== undefined){
  415. if(Array.isArray(textAreas)){
  416. textAreas.forEach(function (value, index, array) {
  417. $(value).bind('input propertychange', function() {
  418. if(this.value.trim() !== ""){
  419. $refreshBlockControl.addClass('paused');
  420. }else{
  421. $refreshBlockControl.removeClass('paused');
  422. }
  423. });
  424. })
  425. }else{
  426. $(textAreas).bind('input propertychange', function() {
  427. if(this.value.trim() !== ""){
  428. $refreshBlockControl.addClass('paused');
  429. }else{
  430. $refreshBlockControl.removeClass('paused');
  431. }
  432. });
  433. }
  434. }
  436. $('#page-refresh-block').show();
  437. refreshElement = $('#page-refresh-in');
  438. refreshTime = time;
  439. refreshIfIdle();
  440. }
  442. function refreshIfIdle() {
  443. if ( typeof document.addEventListener === "undefined" || hidden === undefined ) {
  444. console.log("This browser does not supports the Page Visibility API.");
  445. } else {
  446. // Handle page visibility change
  447. document.addEventListener(visibilityChange, handleVisibilityChange, false);
  448. }
  450. refreshElement.html(refreshTime);
  451. // if (!$('#page-refresh-block a').hasClass('paused')) {
  452. if (!$('#page-refresh-block a').hasClass('paused') && ($('#searchtext').length == 0 || $('#searchtext').val() == '')) {
  453. refreshTime--;
  454. }
  455. // }
  456. if (refreshTime > -1){
  457. setTimeout(function(){
  458. refreshIfIdle();
  459. }, 1000);
  460. } else {
  461. refreshInterval = setInterval(function() {
  462. if ( $('#page-refresh-block a').hasClass('online') ) {
  463. clearInterval(refreshInterval);
  465. setTimeout(function() {
  466. $('#modal-page-refresh').modal({
  467. backdrop: 'static',
  468. keyboard: false
  469. });
  471. window.location.href = window.location.href.replace('?print_label=1','').replace('print_billingo_invoice=1&','').replace('print_invoice=1&','').replace('?print-packeta-label=1','').replace(window.location.hash, '');
  472. }, 900);
  473. } else if ( !$('#page-refresh-block a').hasClass('offline') ) {
  474. clearInterval(refreshInterval);
  476. window.location.href = window.location.href.replace('?print_label=1','').replace('print_billingo_invoice=1&','').replace('print_invoice=1&','').replace('?print-packeta-label=1','').replace(window.location.hash, '');
  477. }
  478. }, 100);
  479. }
  480. }
  482. $('#page-refresh-block a').click(function(){
  483. if (!$(this).hasClass('paused')) {
  484. $(this).addClass('paused');
  485. $(this).find('i').removeClass('glyphicon-pause').addClass('glyphicon-play');
  486. } else {
  487. $(this).removeClass('paused');
  488. $(this).find('i').removeClass('glyphicon-play').addClass('glyphicon-pause');
  489. }
  491. return false;
  492. });
  494. {% if app.request.server.get("HTTP_HOST") == 'www.atechcomp.eu' %}
  495. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  496. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  497. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  498. })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
  500. ga('create', 'UA-26412246-8', {'siteSpeedSampleRate': 60});
  501. {% if app.user is not null %}
  502. ga('set', 'dimension1', '{{ app.user.nickName }}');
  503. ga('set', 'userId', '{{ app.user.id }}');
  504. {% endif %}
  505. ga('send', 'pageview');
  506. {% endif %}
  507. </script>
  508. {% endblock %}