Implement hiding by current user. (f31064ae) · Commits · extjs / jsduck

opt/comments-server-side/app.js

+4 −0

Original line number	Diff line number	Diff line
		@@ -198,6 +198,10 @@ app.get('/auth/:sdk/:version/comments_recent', util.getCommentReads, function(re
		filter._id = { $nin: req.commentMeta.reads };
		}

		if (req.query.hideCurrentUser && req.commentMeta.reads.length > 0) {
		filter.userId: { '$ne': req.session.user.userid }
		}

		Comment.find(filter).sort("createdAt", -1).run(function(err, comments) {
		var total_rows = comments.length;

template/app/controller/Comments.js

+52 −4

Original line number	Diff line number	Diff line
		@@ -121,8 +121,9 @@ Ext.define('Docs.controller.Comments', {
		[ '.fetchMoreComments', 'click', this.fetchMoreComments],
		[ '.voteCommentUp', 'click', this.voteUp],
		[ '.voteCommentDown', 'click', this.voteDown],
		[ '#hideRead', 'change', function() { this.fetchRecentComments(); }],
		[ '#sortByScore', 'change', function() { this.fetchRecentComments(); }]
		[ '#hideRead', 'change', this.hideRead],
		[ '#hideCurrentUser', 'change', this.hideCurrentUser],
		[ '#sortByScore', 'change', this.sortByScore]
		], function(delegate) {
		cmp.el.addListener(delegate[1], delegate[2], this, {
		preventDefault: true,
		@@ -279,18 +280,27 @@ Ext.define('Docs.controller.Comments', {
		limit: 100
		};

		if (this.isChecked('hideRead')) {
		if (Ext.util.Cookies.get('hideRead')) {
		params.hideRead = 1;
		}
		if (this.isChecked('sortByScore')) {

		if (Ext.util.Cookies.get('hideCurrentUser')) {
		params.hideCurrentUser = 1;
		}

		if (Ext.util.Cookies.get('sortByScore')) {
		params.sortByScore = 1;
		}

		this.maskComments();

		this.request("jsonp", {
		url: '/comments_recent',
		method: 'GET',
		params: params,
		success: function(response) {
		this.unmaskComments();

		this.renderComments(response, 'recentcomments', {
		hideCommentForm: true,
		append: !!offset,
		@@ -301,11 +311,34 @@ Ext.define('Docs.controller.Comments', {
		});
		},

		maskComments: function() {
		var container = Ext.get('recentcomments-container');
		if (container) {
		container.mask();
		}
		},

		unmaskComments: function() {
		var container = Ext.get('recentcomments-container');
		if (container) {
		container.unmask();
		}
		},

		isChecked: function(id) {
		var cb = Ext.get(id);
		return cb && cb.dom.checked;
		},

		setCookie: function(name) {
		var checked = this.isChecked(name);
		if (checked) {
		Ext.util.Cookies.set(name, true);
		} else {
		Ext.util.Cookies.clear(name);
		}
		},

		fetchMoreComments: function(cmp, el) {
		this.fetchRecentComments(Ext.get(el).getAttribute('rel'));
		},
		@@ -486,6 +519,21 @@ Ext.define('Docs.controller.Comments', {
		this.vote('down', el);
		},

		hideRead: function() {
		this.setCookie('hideRead');
		this.fetchRecentComments();
		},

		hideCurrentUser: function() {
		this.setCookie('hideCurrentUser');
		this.fetchRecentComments();
		},

		sortByScore: function() {
		this.setCookie('sortByScore');
		this.fetchRecentComments();
		},

		updateSubscription: function(cmp, el) {
		var commentEl = Ext.get(el).up('.comments-div'),
		labelEl = Ext.get(el).up('label'),

template/app/view/comments/Index.js

+50 −7

Original line number	Diff line number	Diff line
		@@ -6,27 +6,70 @@ Ext.define('Docs.view.comments.Index', {
		alias: 'widget.commentindex',
		mixins: ['Docs.view.Scrolling'],

		cls: 'comment-index iScroll',
		cls: 'comment-index',
		margin: '10 0 0 0',
		autoScroll: true,
		layout: 'fit',

		items: [
		dockedItems: [
		{
		xtype: 'component',
		dock: 'top',
		html: [
		'<h1>Recent Comments</h1>'
		].join(" ")
		},
		{
		xtype: 'container',
		dock: 'left',
		width: 200,
		html: [
		'<h1>Recent Comments</h1>',
		'<ul id="comment-index-controls">',
		'<li><label><input type="checkbox" name="hideRead" id="hideRead" /> Hide read</label></li>',
		'<li><label><input type="checkbox" name="hideCurrentUser" id="hideCurrentUser" /> Hide current User</label></li>',
		'<li><label><input type="checkbox" name="sortByScore" id="sortByScore" /> Sort by score</label></li>',
		'</ul>'
		].join(" ")
		},
		}
		],

		items: [
		{
		cls: 'iScroll',
		id: 'recentcomments-container',
		autoScroll: true,
		items: [
		{
		xtype: 'container',
		id: 'recentcomments'
		}
		]
		}
		],

		afterRender: function() {
		this.callParent(arguments);
		this.initCookies();

		Ext.get('recentcomments-container').mask();
		},

		/**
		* Loops through each of the filter values (manually set for now) and checked for a previous set cookie value.
		*/
		initCookies: function() {
		var checkboxes = ['hideRead', 'hideCurrentUser', 'sortByScore'],
		ln = checkboxes.length,
		i, el;

		for (i = 0; i < ln; i++) {
		name = checkboxes[i];
		el = Ext.get(name);
		if (el) {
		el.dom.checked = Boolean(Ext.util.Cookies.get(name));
		}
		}
		},

		/**
		* Returns tab config for comments page.
		* @return {Object}

template/resources/sass/_comments.scss

+7 −0

Original line number	Diff line number	Diff line
		@@ -304,3 +304,10 @@
		padding-top: 1em;
		li {
		list-style-type: none; } }

		#recentcomments-container .x-mask {
		opacity: 0.9;
		background: #fff;
		background-repeat: no-repeat;
		background-image: url('data:image/gif;base64,R0lGODlhEAAQAPIAAP///7Ozs+zs7MbGxrOzs8/Pz9nZ2d7e3iH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==');
		background-position: center; }