theme.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. // The purpose of this code is to fix the height of overflow: auto blocks, because some browsers can't figure it out for themselves.
  2. function smf_codeBoxFix(){
  3. var codeFix = document.getElementsByTagName('code'),
  4. i;
  5. for(i = codeFix.length - 1; i >= 0; i--){
  6. if(is_webkit && codeFix[i].offsetHeight < 20){
  7. codeFix[i].style.height = (codeFix[i].offsetHeight + 20) + 'px';
  8. }else if(is_ff && (codeFix[i].scrollWidth > codeFix[i].clientWidth || codeFix[i].clientWidth === 0)){
  9. codeFix[i].style.overflow = 'scroll';
  10. }else if('currentStyle' in codeFix[i] && codeFix[i].currentStyle.overflow == 'auto' && (codeFix[i].currentStyle.height === '' || codeFix[i].currentStyle.height == 'auto') && (codeFix[i].scrollWidth > codeFix[i].clientWidth || codeFix[i].clientWidth === 0) && (codeFix[i].offsetHeight !== 0)){
  11. codeFix[i].style.height = (codeFix[i].offsetHeight + 24) + 'px';
  12. }
  13. }
  14. }
  15. // Add a fix for code stuff?
  16. if((is_ie && !is_ie4) || is_webkit || is_ff){
  17. addLoadEvent(smf_codeBoxFix);
  18. }
  19. // Toggles the element height and width styles of an image.
  20. function smc_toggleImageDimensions(){
  21. var oImages = document.getElementsByTagName('IMG'),
  22. oImage,
  23. onclick = function(){
  24. this.style.width = this.style.height = this.style.width == 'auto' ? null : 'auto';
  25. };
  26. for(oImage in oImages){
  27. // Not a resized image? Skip it.
  28. if(oImages[oImage].className === undefined || oImages[oImage].className.indexOf('bbc_img resized') == -1){
  29. continue;
  30. }
  31. oImages[oImage].style.cursor = 'pointer';
  32. oImages[oImage].onclick = onclick;
  33. }
  34. }
  35. // Add a load event for the function above.
  36. addLoadEvent(smc_toggleImageDimensions);
  37. // Adds a button to a certain button strip.
  38. function smf_addButton(sButtonStripId, bUseImage, oOptions){
  39. var oButtonStrip = document.getElementById(sButtonStripId),
  40. aItems = oButtonStrip.getElementsByTagName('span'),
  41. oLastSpan,
  42. oButtonStripList,
  43. oNewButton;
  44. // Remove the 'last' class from the last item.
  45. if(aItems.length > 0){
  46. oLastSpan = aItems[aItems.length - 1];
  47. oLastSpan.className = oLastSpan.className.replace(/\s*last/, 'position_holder');
  48. }
  49. // Add the button.
  50. oButtonStripList = oButtonStrip.getElementsByTagName('ul')[0];
  51. oNewButton = document.createElement('li');
  52. setInnerHTML(oNewButton, '<a href="' + oOptions.sUrl + '" ' + ('sCustom' in oOptions ? oOptions.sCustom : '') + '><span class="last"' + ('sId' in oOptions ? ' id="' + oOptions.sId + '"': '') + '>' + oOptions.sText + '</span></a>');
  53. oButtonStripList.appendChild(oNewButton);
  54. }
  55. // Adds hover events to list items. Used for a versions of IE that don't support this by default.
  56. // Add hover events to list items if the browser requires it.
  57. if (is_ie7down && 'attachEvent' in window){
  58. window.attachEvent('onload',function(){
  59. var cssRule,
  60. newSelector,
  61. iStyleSheet,
  62. iRule,
  63. oListItems,
  64. oListItem,
  65. onmouseover = function(){
  66. this.className += ' iehover';
  67. },
  68. onmouseout = function(){
  69. this.className = this.className.replace(new RegExp(' iehover\\b'), '');
  70. };
  71. // Add a rule for the list item hover event to every stylesheet.
  72. for(iStyleSheet = 0; iStyleSheet < document.styleSheets.length; iStyleSheet ++){
  73. for(iRule = 0; iRule < document.styleSheets[iStyleSheet].rules.length; iRule ++){
  74. oCssRule = document.styleSheets[iStyleSheet].rules[iRule];
  75. if(oCssRule.selectorText.indexOf('LI:hover') != -1){
  76. sNewSelector = oCssRule.selectorText.replace(/LI:hover/gi, 'LI.iehover');
  77. document.styleSheets[iStyleSheet].addRule(sNewSelector, oCssRule.style.cssText);
  78. }
  79. }
  80. }
  81. // Now add handling for these hover events.
  82. oListItems = document.getElementsByTagName('LI');
  83. for(oListItem in oListItems){
  84. oListItems[oListItem].onmouseover = onmouseover;
  85. oListItems[oListItem].onmouseout = onmouseout;
  86. }
  87. });
  88. }
  89. // automatic responsive image resizing
  90. $(function(){
  91. if($('.poster').length > 0){ // inside of a normal topic
  92. var $sheet = $('<style>').appendTo('head');
  93. $(window).resize(function(){
  94. // 90% - 88px - 15em(of .poster)
  95. var w = parseFloat($(window).width())*0.9-88-(15*Number(getComputedStyle($('.poster')[0], "").fontSize.match(/(\d*(\.\d*)?)px/)[1]));
  96. $sheet.html('img.bbc_img{max-width:'+w+'px;}');
  97. }).resize();
  98. }
  99. if($('.dp_news').length > 0){ // front page news
  100. $sheet = $('<style>').appendTo('head');
  101. $(window).resize(function(){
  102. var w = parseFloat($(window).width())*0.9 - 500;
  103. $sheet.html('img.bbc_img{max-width:'+w+'px;}');
  104. }).resize();
  105. }
  106. });