[ABD] AJAX Comment on Posts

Jessica · Post by **Jessica** » Wed Jan 30, 2013 8:27 pm

Small little problem, not sure how it happened but I think it's some conflict with the ajax like mod (same issue for that mod, on the likes popup)

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 8:30 pm

Jessica wrote:Small little problem, not sure how it happened but I think it's some conflict with the ajax like mod (same issue for that mod, on the likes popup)

would you explain more maybe by link ?

mladiucitelj · Post by **mladiucitelj** » Wed Jan 30, 2013 9:57 pm

Installed it on my test forum. Great work!

Just a couple of things:

1. When I expand/load more comments would be nice that you can collapse them back

2. When comments are collapsed to see the number of comments before expanding them

3. See the number of Maximum characters per comments, when typing a comment

4. Possibillity to make comments equal to posts. 1 post is equal to 1 comment (for statistics)

5. I'm using RSS for my new posts. Will the comment be regonizable for rss protocol?

6. User can decide in UCP wether to by notify upon new comment

EDIT:

7. One empty line after users signature, then to show comments, otherwise comments are right after the signature and it's not looking good.

8. Before first comment there will write Comments or something like that, not just nothing after users signature or post

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 10:29 pm

Installed it on my test forum. Great work!

Thanks

1. When I expand/load more comments would be nice that you can collapse them back

I'm not sure about this. AJAX operations need resources and better to keep them for more vital features.

2. When comments are collapsed to see the number of comments before expanding them

If you mean to show number of comments, Yes I plan to add this.

3. See the number of Maximum characters per comments, when typing a comment

Nice one, I'll work on this.

4. Possibillity to make comments equal to posts. 1 post is equal to 1 comment (for statistics)

It's not possible because of "Resynchronise post counts" button. All comment counts will be ignored by this option.

5. I'm using RSS for my new posts. Will the comment be regonizable for rss protocol?

Not in near future.

6. User can decide in UCP wether to by notify upon new comment

There will be such an option.

7. One empty line after users signature, then to show comments, otherwise comments are right after the signature and it's not looking good.

Yes, This is a bug. Will be fixed in next version.

8. Before first comment there will write Comments or something like that, not just nothing after users signature or post

Sorry I couldn't understand this.

mladiucitelj · Post by **mladiucitelj** » Wed Jan 30, 2013 10:51 pm

Ali@php wrote:
8. Before first comment there will write Comments or something like that, not just nothing after users signature or post
Sorry I couldn't understand this.

To have some kind of title Comments and after that a first comment will show.

Jessica · Post by **Jessica** » Wed Jan 30, 2013 10:56 pm

Ali@php wrote:
Jessica wrote:Small little problem, not sure how it happened but I think it's some conflict with the ajax like mod (same issue for that mod, on the likes popup)

would you explain more maybe by link ?

installed on my test forum: http://area51.chenschool.elementfx.com/index.php

Test/test123

Jessica · Post by **Jessica** » Wed Jan 30, 2013 10:57 pm

mladiucitelj wrote:
Ali@php wrote:
8. Before first comment there will write Comments or something like that, not just nothing after users signature or post
Sorry I couldn't understand this.
To have some kind of title Comments and after that a first comment will show.

I added in <h3>Comments</h3> temporarily to do this

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 11:03 pm

mladiucitelj wrote:
Ali@php wrote:
8. Before first comment there will write Comments or something like that, not just nothing after users signature or post
Sorry I couldn't understand this.
To have some kind of title Comments and after that a first comment will show.

I will do this after adding number of comments in each post to MOD

mladiucitelj · Post by **mladiucitelj** » Wed Jan 30, 2013 11:07 pm

Jessica wrote:
mladiucitelj wrote:
Ali@php wrote:
8. Before first comment there will write Comments or something like that, not just nothing after users signature or post
Sorry I couldn't understand this.
To have some kind of title Comments and after that a first comment will show.
I added in <h3>Comments</h3> temporarily to do this

Thanks, Jessica, that's what I've meant

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 11:08 pm

Jessica wrote:
Ali@php wrote:
Jessica wrote:Small little problem, not sure how it happened but I think it's some conflict with the ajax like mod (same issue for that mod, on the likes popup)

would you explain more maybe by link ?
installed on my test forum: http://area51.chenschool.elementfx.com/index.php

Test/test123

It's because I use default stylesheet of jquery but emosbat uses another library. for editing (maybe deleting) black opacity go to this file : styles/prosilver/template/js/jquery-ui.js
Find :

Code: Select all

.ui-widget-overlay { background: #121212 url(images/ui-bg_flat_90_121212_40x100.png) 50% 50% repeat-x; opacity: .80;filter:Alpha(Opacity=80); }

Around line 286

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 11:11 pm

7. One empty line after users signature, then to show comments, otherwise comments are right after the signature and it's not looking good.

Fixed now.

Find and delete :

Code: Select all

		<!-- IF ENABLE_COMMENTS -->
		<!-- IF U_SEECOM -->
		<div id="scrollpoint{postrow.POST_ID}"></div>
		<!-- BEGIN comment -->
			<div id="c{comment.COMMENT_ID}" class="post <!-- IF postrow.S_ROW_COUNT is odd -->bg2<!-- ELSE -->bg1<!-- ENDIF -->" style="-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">
				<div class="inner"><span class="corners-top" style="background-image:none;"><span style="background-image:none;"></span></span>
				<div class="postbody" style="width:85%;">
					<ul class="profile-icons">
						<!-- IF comment.U_COMDEDIT  --><li class="edit-icon"><a href="javascript:void(0);" onclick="ajax_edit_form('{postrow.POST_ID}', '{postrow.POSTER_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_EDIT_POST}"><span>{L_EDIT_POST}</span></a></li><!-- ENDIF -->
						<!-- IF comment.U_COMDELETE --><li class="delete-icon"><a href="javascript:void(0);" onclick="ajax_delete_comment('{postrow.POST_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_DELETE_POST}"><span>{L_DELETE_POST}</span></a></li><!-- ENDIF -->
					</ul>
					{comment.COMMENT_DATE}
					<div class="commentcontent" style="padding-top:10px;">
						<div class="comtext" style="font-size:12px;">
						{comment.TEXT}
						</div>
					</div>
				</div>
			<dl class="postprofile" style="width:14%;">
				<dt>
					<a href="{comment.U_PROFILE}">{comment.AVATAR}</a><br>
					<a href="{comment.U_PROFILE}" style="color: #{comment.COLOUR};" class="username-coloured">{comment.USERNAME}</a>
					<dt>{comment.RANK_TITLE}</dt>
				</dt>
			</dl>
		
			<span class="corners-bottom" style="background-image:none;"><span style="background-image:none;"></span></span></div>
			</div>
		<!-- END comment -->
		<div id="commentscroll{postrow.POST_ID}"></div>
			<fieldset class="submit-buttons">
			<!-- IF F_SENDCOM --><a href="javascript:void(0);" onclick="ajax_send_form('{postrow.COMMENT_ACTION}', '{postrow.POSTER_ID}', '{postrow.POST_ID}', '{LIMIT}', '{COMMENT_PATH}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_SEND_COMMENT}</a><!-- ENDIF -->
			<a href="javascript:void(0);" onclick="ajax_pagination('{postrow.MORE_COMMENT}', '{postrow.POST_ID}', '{LIMIT}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_MORE_COMMENT}</a></fieldset>
		<!-- ENDIF -->
		<!-- ENDIF -->

Find :

Code: Select all

			<div class="content">{postrow.MESSAGE}</div>

After add :

Code: Select all

		<br /><br />
		<!-- IF ENABLE_COMMENTS -->
		<!-- IF U_SEECOM -->
		<div id="scrollpoint{postrow.POST_ID}"></div>
		<!-- BEGIN comment -->
			<div id="c{comment.COMMENT_ID}" class="post <!-- IF postrow.S_ROW_COUNT is odd -->bg2<!-- ELSE -->bg1<!-- ENDIF -->" style="-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">
				<div class="inner"><span class="corners-top" style="background-image:none;"><span style="background-image:none;"></span></span>
				<div class="postbody" style="width:85%;">
					<ul class="profile-icons">
						<!-- IF comment.U_COMDEDIT  --><li class="edit-icon"><a href="javascript:void(0);" onclick="ajax_edit_form('{postrow.POST_ID}', '{postrow.POSTER_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_EDIT_POST}"><span>{L_EDIT_POST}</span></a></li><!-- ENDIF -->
						<!-- IF comment.U_COMDELETE --><li class="delete-icon"><a href="javascript:void(0);" onclick="ajax_delete_comment('{postrow.POST_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_DELETE_POST}"><span>{L_DELETE_POST}</span></a></li><!-- ENDIF -->
					</ul>
					{comment.COMMENT_DATE}
					<div class="commentcontent" style="padding-top:10px;">
						<div class="comtext" style="font-size:12px;">
						{comment.TEXT}
						</div>
					</div>
				</div>
			<dl class="postprofile" style="width:14%;">
				<dt>
					<a href="{comment.U_PROFILE}">{comment.AVATAR}</a><br>
					<a href="{comment.U_PROFILE}" style="color: #{comment.COLOUR};" class="username-coloured">{comment.USERNAME}</a>
					<dt>{comment.RANK_TITLE}</dt>
				</dt>
			</dl>
		
			<span class="corners-bottom" style="background-image:none;"><span style="background-image:none;"></span></span></div>
			</div>
		<!-- END comment -->
		<div id="commentscroll{postrow.POST_ID}"></div>
			<fieldset class="submit-buttons">
			<!-- IF F_SENDCOM --><a href="javascript:void(0);" onclick="ajax_send_form('{postrow.COMMENT_ACTION}', '{postrow.POSTER_ID}', '{postrow.POST_ID}', '{LIMIT}', '{COMMENT_PATH}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_SEND_COMMENT}</a><!-- ENDIF -->
			<a href="javascript:void(0);" onclick="ajax_pagination('{postrow.MORE_COMMENT}', '{postrow.POST_ID}', '{LIMIT}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_MORE_COMMENT}</a></fieldset>
		<!-- ENDIF -->
		<!-- ENDIF -->

mladiucitelj · Post by **mladiucitelj** » Wed Jan 30, 2013 11:26 pm

I think it is better to add it after signature. I've done it like this:

Ali@php wrote:Find :

Code: Select all

			<!-- IF postrow.SIGNATURE --><div id="sig{postrow.POST_ID}" class="signature">{postrow.SIGNATURE}</div><!-- ENDIF -->

After add :

Code: Select all

		<br /><br />
		<!-- IF ENABLE_COMMENTS -->
		<!-- IF U_SEECOM -->
		<div id="scrollpoint{postrow.POST_ID}"></div>
		<!-- BEGIN comment -->
			<div id="c{comment.COMMENT_ID}" class="post <!-- IF postrow.S_ROW_COUNT is odd -->bg2<!-- ELSE -->bg1<!-- ENDIF -->" style="-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;">
				<div class="inner"><span class="corners-top" style="background-image:none;"><span style="background-image:none;"></span></span>
				<div class="postbody" style="width:85%;">
					<ul class="profile-icons">
						<!-- IF comment.U_COMDEDIT  --><li class="edit-icon"><a href="javascript:void(0);" onclick="ajax_edit_form('{postrow.POST_ID}', '{postrow.POSTER_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_EDIT_POST}"><span>{L_EDIT_POST}</span></a></li><!-- ENDIF -->
						<!-- IF comment.U_COMDELETE --><li class="delete-icon"><a href="javascript:void(0);" onclick="ajax_delete_comment('{postrow.POST_ID}', '{comment.COMMENT_ID}', '{LIMIT}', '{COMMENT_PATH}');" title="{L_DELETE_POST}"><span>{L_DELETE_POST}</span></a></li><!-- ENDIF -->
					</ul>
					{comment.COMMENT_DATE}
					<div class="commentcontent" style="padding-top:10px;">
						<div class="comtext" style="font-size:12px;">
						{comment.TEXT}
						</div>
					</div>
				</div>
			<dl class="postprofile" style="width:14%;">
				<dt>
					<a href="{comment.U_PROFILE}">{comment.AVATAR}</a><br>
					<a href="{comment.U_PROFILE}" style="color: #{comment.COLOUR};" class="username-coloured">{comment.USERNAME}</a>
					<dt>{comment.RANK_TITLE}</dt>
				</dt>
			</dl>
		
			<span class="corners-bottom" style="background-image:none;"><span style="background-image:none;"></span></span></div>
			</div>
		<!-- END comment -->
		<div id="commentscroll{postrow.POST_ID}"></div>
			<fieldset class="submit-buttons">
			<!-- IF F_SENDCOM --><a href="javascript:void(0);" onclick="ajax_send_form('{postrow.COMMENT_ACTION}', '{postrow.POSTER_ID}', '{postrow.POST_ID}', '{LIMIT}', '{COMMENT_PATH}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_SEND_COMMENT}</a><!-- ENDIF -->
			<a href="javascript:void(0);" onclick="ajax_pagination('{postrow.MORE_COMMENT}', '{postrow.POST_ID}', '{LIMIT}');" class="button2" style="padding-top:3px; padding-bottom:3px;">{L_MORE_COMMENT}</a></fieldset>
		<!-- ENDIF -->
		<!-- ENDIF -->

Jessica · Post by **Jessica** » Wed Jan 30, 2013 11:35 pm

Ali@php wrote:
Jessica wrote:
Ali@php wrote:
Jessica wrote:Small little problem, not sure how it happened but I think it's some conflict with the ajax like mod (same issue for that mod, on the likes popup)

would you explain more maybe by link ?
installed on my test forum: http://area51.chenschool.elementfx.com/index.php

Test/test123
It's because I use default stylesheet of jquery but emosbat uses another library. for editing (maybe deleting) black opacity go to this file : styles/prosilver/template/js/jquery-ui.js
Find :
Code: Select all
.ui-widget-overlay { background: #121212 url(images/ui-bg_flat_90_121212_40x100.png) 50% 50% repeat-x; opacity: .80;filter:Alpha(Opacity=80); }
Around line 286

That got rid of the black part but the x image is still out of the close button box...(as in the image)

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 11:51 pm

That got rid of the black part but the x image is still out of the close button box...(as in the image)

open same file.
Find:

Code: Select all

.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; }

Replace with :

Code: Select all

.ui-button-icon-only .ui-icon { left: -2%; margin-left: -8px; }

Find:

Code: Select all

.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; }

Replace with:

Code: Select all

.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: -5%; margin-top: -8px; }

However I'm not sure how these changes may effect ajax like MOD.

Ali@php · Post by **Ali@php** » Wed Jan 30, 2013 11:55 pm

I think it is better to add it after signature. I've done it like this

It's not just signatures, attachments, edit and bump notifications are also placed above that box.

advertisements