custom.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. function getClock() {
  2. var d = new Date();
  3. nhour = d.getHours();
  4. nmin = d.getMinutes();
  5. if (nhour <= 9) {
  6. nhour = '0' + nhour;
  7. }
  8. if (nmin <= 9) {
  9. nmin = '0' + nmin;
  10. }
  11. document.getElementById('clock').innerHTML = nhour + ':' + nmin + ' Uhr';
  12. setTimeout(getClock, 1000);
  13. }
  14. jQuery(document).ready(function ($) {
  15. var themeVersion = '2.8';
  16. // Check für JS-Installation entfernen
  17. $('#hdr').addClass('js-installed');
  18. // attr WEB hiddenroom input -> Ansicht anpassen
  19. if ($('#hdr .maininput').length == 0) {
  20. $('#hdr').hide();
  21. $('#content').css({top: '10px'});
  22. }
  23. // Add version to logo
  24. $('#logo').append(
  25. $('<span class="theme-version">' + themeVersion + '</span>')
  26. ).append(
  27. $('<span id="clock"></span>')
  28. );
  29. // Add clock
  30. window.addEventListener('load', getClock, false);
  31. // Clear spaces
  32. $('#content .devType, #menu .room a').each(function() {
  33. $(this).html($(this).html().replace(/&nbsp;/g, ''));
  34. });
  35. $('#content > br').remove();
  36. $('.makeSelect').parent().find('br').remove();
  37. // Add missing classes for elements
  38. $('.SVGplot').prevAll('a').addClass('plot-nav');
  39. // Icon selection
  40. $('button.dist').wrapAll('<div class="icons"/>');
  41. $('button.dist').css({width: '50px', height: '50px', margin: '5px', padding: '0'});
  42. $('button.dist > *').css({maxWidth: '40px', maxHeight: '40px', display: 'block', margin: '0px auto'});
  43. $('input[type=text][name=icon-filter]').keyup(function() {
  44. var val = $(this).val().toLowerCase();
  45. if (val.length === 0) {
  46. jQuery('button.dist').show();
  47. } else {
  48. jQuery('button.dist').hide().filter(function() {
  49. return $(this).attr('title').toLowerCase().indexOf(val) > -1;
  50. }).show();
  51. }
  52. });
  53. // Links in der Navigation hinzufügen
  54. var $navElement = jQuery('#menu .room').last().find('tbody');
  55. $navElement.append(
  56. $('<tr><td><div><a class="custom-menu-entry" href="https://github.com/klein0r/fhem-style-haus-automatisierung/issues/">Theme-Fehler melden (v' + themeVersion + ')</a></div></td></tr>')
  57. );
  58. // Automatische Breite für HDR Input
  59. $('#hdr input.maininput').css({width: $('#content').width() + 'px'});
  60. $(window).resize(function() {
  61. $('#hdr input.maininput').css({width: $('#content').width() + 'px'});
  62. });
  63. // Klick auf Error-Message blendet diese aus
  64. $('body').on('click', '#errmsg', function() {
  65. $(this).hide();
  66. });
  67. $('.roomoverview .col1, .makeTable .col1').each(function(index) {
  68. $(this).parent().addClass('first-table-column');
  69. });
  70. // hide elements by name
  71. if (document.URL.indexOf("showall") != -1) {
  72. //don't hide anything
  73. } else {
  74. $("div.devType:contains('-hidden')").parent('td').hide();
  75. }
  76. (function($, window, document, undefined) {
  77. 'use strict';
  78. var elSelector = '#hdr, #logo',
  79. elClassHidden = 'header--hidden',
  80. throttleTimeout = 50,
  81. $element = $(elSelector);
  82. if (!$element.length) return true;
  83. var $window = $(window),
  84. wHeight = 0,
  85. wScrollCurrent = 0,
  86. wScrollBefore = 0,
  87. wScrollDiff = 0,
  88. $document = $(document),
  89. dHeight = 0,
  90. throttle = function(delay, fn) {
  91. var last, deferTimer;
  92. return function() {
  93. var context = this, args = arguments, now = +new Date;
  94. if(last && now < last + delay) {
  95. clearTimeout(deferTimer);
  96. deferTimer = setTimeout(
  97. function() {
  98. last = now;
  99. fn.apply(context, args);
  100. },
  101. delay
  102. );
  103. } else {
  104. last = now;
  105. fn.apply(context, args);
  106. }
  107. };
  108. };
  109. $window.on('scroll', throttle(throttleTimeout, function() {
  110. dHeight = $document.height();
  111. wHeight = $window.height();
  112. wScrollCurrent = $window.scrollTop();
  113. wScrollDiff = wScrollBefore - wScrollCurrent;
  114. if (wScrollCurrent <= 50) {
  115. $element.removeClass(elClassHidden);
  116. } else if (wScrollDiff > 0 && $element.hasClass(elClassHidden)) {
  117. $element.removeClass(elClassHidden);
  118. } else if (wScrollDiff < 0) {
  119. if (wScrollCurrent + wHeight >= dHeight && $element.hasClass(elClassHidden)) {
  120. $element.removeClass(elClassHidden);
  121. } else {
  122. $element.addClass(elClassHidden);
  123. }
  124. }
  125. wScrollBefore = wScrollCurrent;
  126. }));
  127. })(jQuery, window, document);
  128. });