Edit - Meta Stack Exchange

1. Home
2. Questions
3. Unanswered
4. Tags
6. Chat
7. Users
Stack Internal

Stack Overflow for Teams is now called Stack Internal. Bring the best of human thought and AI automation together at your work.
Try for free Learn more
Stack Internal
Bring the best of human thought and AI automation together at your work. Learn more

You are not logged in. Your edit will be placed in a queue until it is peer reviewed.

We welcome edits that make the post easier to understand and more valuable for readers. Because community members review edits, please try to make the post substantially better than how you found it, for example, by fixing grammar or adding additional resources and hyperlinks.

Required fields*

Rev

Required fields*

Hide a particular question locally

It's common that I read a question and say, "OK, I don't need to see it again."
Then I always think, "Hmm... maybe there is a 'hide' button on the question, so that I won't see it again in my favourite tag list so that I'll be able to focus on the remaining questions which are either new or known by me and interesting to me?" But, unfortunately, the button is never there.

Request: Let's implement that button! No need to clutter the database with it: It looks to me like a perfect candidate for HTML5 local storage. Purely client side.

The fun part is, it can be implemented separately from SO, as a bookmarklet or just an addon for PersonalizedWeb / GreaseMonkey. But I believe it would be indeed useful to have it there available for everyone.

Do you like the idea?

Answer*

This is a working prototype using LocalStorage. Good enough for my needs- maybe anyone would want to start from here and extend?

I'm using it under Chrome Personalized Web extension, but it should be easy to incorprate anywhere.

    <style>
    	.kos-hide-button {
    		color: #666;
    	}
        .kos-hide-button:hover {
    		color: red;
    		cursor: pointer;
    	}	
    	.kos-hide-button-hide {
    		display: block;
    		width: 2em;
    		float: right;
    		text-align: right;
    	}
    	.kos-hide-hidden-question {
    		display: none;
    	}
    	
    </style>
    <script>
    $(document).ready(function() {
    
    	var keyPrefix = "stackoverflow.hiddenquestion.";
    
    	function hideElem(elem) {
    		elem.addClass('kos-hide-hidden-question');
    	}
    	function clearHidden() {
    		
    		var toRemove = [];
    		for (var i=0; i<localStorage.length; ++i) {
    			var key = localStorage.key(i);
    			if (key.substr(0, keyPrefix.length) == keyPrefix) {
    				toRemove.push(key);
    			}
    		}
    		for (var i=0; i<toRemove.length; ++i) {
    			localStorage.removeItem(toRemove[i]);
    		}
    		$('.kos-hide-hidden-question').removeClass('kos-hide-hidden-question');
    	}
        
        if (!('localStorage' in window && window['localStorage'] !== null)) {
    		return;
    	}
        $('.question-summary').each(function() {
    
    		var that = $(this);
    		var id = keyPrefix + $(this).attr('id');
    
    		$('<span>(-)</span>')
    			.addClass('kos-hide-button')
    			.addClass('kos-hide-button-hide')
    			.attr('title','Hide this question')
    			.insertBefore($(this).find('h3'))
    			.click(function() {
    				hideElem(that);
    				var tab = $
    				localStorage[id] = 1;
    			})
    			;
    
    		var hidden = localStorage[id];			
    		if (hidden) {
    			hideElem($(this));
    		}
        });
    	
    	$('<div>Reset hidden questions</div>')
    		.addClass('kos-hide-button')
    		.appendTo($('#sidebar'))
    		.click(function() {
    			clearHidden();
    		})
    		;
    });
    </script>

Edit Summary*

Cancel

To use this, install the Personalized Web extension, go to the extension's options page, click "Add a new rule", and paste the above in the "Add HTML" box. You may also want to change the "Match URLs" regexp to only apply to Stack Exchange sites.

Richard Hansen
– Richard Hansen

2012-04-01 18:27:27 +00:00
Commented Apr 1, 2012 at 18:27

Add a comment |

Correct minor typos or mistakes
Clarify meaning without changing it
Add related resources or links
Always respect the author’s intent
Don’t use edits to reply to the author

create code fences with backticks ` or tildes ~
```
like so
```
add language identifier to highlight code
```python
def function(foo):
print(foo)
```
put returns between paragraphs
for linebreak add 2 spaces at end
_italic_ or **bold**
indent code by 4 spaces
backtick escapes `like _so_`
quote by placing > at start of line
to make links (use https whenever possible)

<https://example.com>

[example](https://example.com)

<a href="/api/flow.js?q=https%3A%2F%2Fexample.com">example</a>

formatting help »
answering help »