☰

Inoreader Masonry Extended View

Changes The Extended View to a nice card view which is nice

当前为 2015-05-10 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Inoreader Masonry Extended View
  3. // @description Changes The Extended View to a nice card view which is nice
  4. // @namespace	http://www.inoreader.com/
  5. // @version		0.6
  6. // @copyright	Zoltan Wacha
  7. // @include		http://*.inoreader.com/*
  8. // @include		https://*.inoreader.com/*
  9. // @require		http://code.jquery.com/jquery-latest.js
  10. // @grant		GM_addStyle
  11. // ==/UserScript==
  12.  
  13.  
  14. GM_addStyle ( "\
  15.   .reader_pane_view_style_1 .article_card {\
  16. 	float: left; \
  17. 	}\
  18.   .reader_pane_view_style_1 .article_card .article_footer_buttons{\
  19. 	font-size: 0; \
  20. 	}\
  21. " );
  22.  
  23. document.getElementById('reader_pane').addEventListener('DOMNodeInserted', gmAddedChecker, false);
  24. document.getElementById('reader_pane').addEventListener('scroll', gmMain, false);
  25.  
  26. function gmAddedChecker() {
  27. 	if($('#reader_pane').hasClass('reader_pane_view_style_1'))
  28. 	{
  29. 		if(!$('#reader_pane #z_m_lastoid').length > 0)
  30. 		{
  31. 			$('<div id="z_m_lastoid" style="display:none;">0</div>').prependTo('#reader_pane');
  32. 		}
  33. 		var lastoid = $('#z_m_lastoid').text();
  34. 		
  35. 		$lastelem = $('#reader_pane .article_card:last');
  36. 		if($lastelem.data('oid') != lastoid)
  37. 		{	
  38. 			//console.log('run added');
  39. 			lastoid = $lastelem.data('oid');
  40. 			$('#z_m_lastoid').text(lastoid);
  41. 			
  42. 			gmMain();
  43. 		}
  44. 	}
  45. }
  46.  
  47. function gmMain() {
  48. 	
  49. 	if($('#reader_pane').hasClass('reader_pane_view_style_1'))
  50. 	{
  51. 		if(!$('#reader_pane #z_m_originaltop').length > 0)
  52. 		{
  53. 			$('<div id="z_m_originaltop" style="display:none;">'+$('#reader_pane .article_card:first').position().top+'</div>').prependTo('#reader_pane');
  54. 		}
  55. 		var originaltop = parseInt($('#z_m_originaltop').text());
  56. 		
  57. 		if(!$('#reader_pane #z_m_articlesheightsum').length > 0)
  58. 		{
  59. 			$('<div id="z_m_articlesheightsum" style="display:none;">-1</div>').prependTo('#reader_pane');
  60. 		}
  61. 		var articlesheightsum_prev = parseInt($('#z_m_articlesheightsum').text());
  62. 		var articlesheight_current = 0;
  63. 		
  64. 		{			
  65. 			$('#reader_pane .article_card').each( function(index) {
  66. 				articlesheight_current = articlesheight_current + $(this).outerHeight();
  67. 			});
  68. 			
  69. 			if(articlesheightsum_prev != articlesheight_current && !$('#z_m_articlesheightsum').hasClass('running'))
  70. 			{
  71. 				//console.log('run change');
  72. 				$('#z_m_articlesheightsum').text(articlesheight_current);
  73. 				$('#z_m_articlesheightsum').addClass('running');
  74. 				
  75.                 if($('div#sinner_container').length > 0)
  76.                 {
  77.                     $sideadwidth = $('div#sinner_container').outerWidth();
  78.                 }
  79.                 else
  80.                 {
  81.                     $sideadwidth = 0;
  82.                 }
  83.                 
  84. 				column1top = originaltop;
  85. 				column2top = originaltop;
  86. 				
  87. 				$('#reader_pane .article_card').each( function(index) {
  88. 					if(column1top <= column2top)
  89. 					{
  90. 						$(this).css('left', 0);
  91. 						$(this).css('top',column1top);
  92.                         $(this).css('width','calc(50% - ' + (35 + ($sideadwidth / 2)) + 'px)');
  93. 						column1top = column1top + $(this).outerHeight() + 12;
  94.                         $(this).children('.article_full_contents').children('.article_content').children('div').css('width', '');
  95. 					}
  96. 					else
  97. 					{
  98. 						$(this).css('left', 'calc(50% - ' + (0 + ($sideadwidth / 2)) + 'px)');
  99. 						$(this).css('top',column2top);
  100.                         $(this).css('width','calc(50% - ' + (35 + ($sideadwidth / 2)) + 'px)');
  101. 						column2top = column2top + $(this).outerHeight() + 12;
  102.                         $(this).children('.article_full_contents').children('.article_content').children('div').css('width', '');
  103. 					}
  104. 					$(this).css('position','absolute');
  105. 				});
  106. 				
  107. 				$('#no_more_div').css('top',Math.max(column1top,column2top));
  108. 				$('#no_more_div').css('position','absolute');
  109. 				$('#no_more_div').css('width','100%');
  110. 				
  111. 				$('#z_m_articlesheightsum').removeClass('running');
  112. 			}
  113. 		}
  114. 	}
  115. }