custom.js 4.8 KB

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