Context menus for comments (#9043)
* Add quote replies Signed-off-by: jolheiser <john.olheiser@gmail.com>
This commit is contained in:
		
							parent
							
								
									af7f08bca8
								
							
						
					
					
						commit
						eb0359cad4
					
				
					 10 changed files with 110 additions and 63 deletions
				
			
		|  | @ -867,6 +867,10 @@ issues.closed_title = Closed | |||
| issues.num_comments = %d comments | ||||
| issues.commented_at = `commented <a href="#%s">%s</a>` | ||||
| issues.delete_comment_confirm = Are you sure you want to delete this comment? | ||||
| issues.context.copy_link = Copy Link | ||||
| issues.context.quote_reply = Quote Reply | ||||
| issues.context.edit = Edit | ||||
| issues.context.delete = Delete | ||||
| issues.no_content = There is no content yet. | ||||
| issues.close_issue = Close | ||||
| issues.close_comment_issue = Comment and Close | ||||
|  |  | |||
|  | @ -573,6 +573,7 @@ i.icon.centerlock{top:1.5em} | |||
| .repository.view.issue .comment-list .comment .tag{color:#767676;margin-top:3px;padding:2px 5px;font-size:12px;border:1px solid rgba(0,0,0,.1);border-radius:3px} | ||||
| .repository.view.issue .comment-list .comment .tag.pending{color:#000;background-color:#fffbb2;margin-left:5px} | ||||
| .repository.view.issue .comment-list .comment .actions .item{float:left} | ||||
| .repository.view.issue .comment-list .comment .actions .item.context{float:none} | ||||
| .repository.view.issue .comment-list .comment .actions .item.tag{margin-right:5px} | ||||
| .repository.view.issue .comment-list .comment .actions .item.action{margin-top:6px;margin-left:10px} | ||||
| .repository.view.issue .comment-list .comment .content{margin-left:4em} | ||||
|  |  | |||
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							|  | @ -21,12 +21,7 @@ | |||
| 				{{end}} | ||||
| 			{{end}} | ||||
| 			{{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/comments/%d/reactions" $.root.RepoLink .ID) }} | ||||
| 			{{if or $.root.Permission.IsAdmin (eq .Poster.ID $.root.SignedUserID)}} | ||||
| 				<div class="item action"> | ||||
| 					<a class="edit-content" href="#"><i class="octicon octicon-pencil"></i></a> | ||||
| 					<a class="delete-comment" href="#" data-comment-id={{.HashTag}} data-url="{{$.root.RepoLink}}/comments/{{.ID}}/delete" data-locale="{{$.root.i18n.Tr "repo.issues.delete_comment_confirm"}}"><i class="octicon octicon-x"></i></a> | ||||
| 				</div> | ||||
| 			{{end}} | ||||
| 			{{template "repo/issue/view_content/context_menu" Dict "ctx" $.root "item" . "delete" true "diff" true }} | ||||
| 			</div> | ||||
| 		</div> | ||||
| 		<div class="ui attached segment"> | ||||
|  | @ -37,7 +32,7 @@ | |||
| 				<span class="no-content">{{$.root.i18n.Tr "repo.issues.no_content"}}</span> | ||||
| 			{{end}} | ||||
| 			</div> | ||||
| 			<div class="raw-content hide">{{.Content}}</div> | ||||
| 			<div id="comment-{{.ID}}" class="raw-content hide">{{.Content}}</div> | ||||
| 			<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.root.RepoLink}}/comments/{{.ID}}" data-context="{{$.root.RepoLink}}"></div> | ||||
| 		</div> | ||||
| 		{{$reactions := .Reactions.GroupByType}} | ||||
|  |  | |||
|  | @ -29,11 +29,7 @@ | |||
| 						{{if not $.Repository.IsArchived}} | ||||
| 							<div class="ui right actions"> | ||||
| 								{{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index) }} | ||||
| 								{{if or .IsIssueWriter .IsIssuePoster}} | ||||
| 									<div class="item action"> | ||||
| 										<a class="edit-content" href="#"><i class="octicon octicon-pencil"></i></a> | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 								{{template "repo/issue/view_content/context_menu" Dict "ctx" $ "item" .Issue "delete" false "diff" false }} | ||||
| 							</div> | ||||
| 						{{end}} | ||||
| 					</div> | ||||
|  | @ -45,7 +41,7 @@ | |||
| 								<span class="no-content">{{.i18n.Tr "repo.issues.no_content"}}</span> | ||||
| 							{{end}} | ||||
| 						</div> | ||||
| 						<div class="raw-content hide">{{.Issue.Content}}</div> | ||||
| 						<div id="comment-{{.Issue.ID}}" class="raw-content hide">{{.Issue.Content}}</div> | ||||
| 						<div class="edit-content-zone hide" data-write="issue-{{.Issue.ID}}-write" data-preview="issue-{{.Issue.ID}}-preview" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/content" data-context="{{.RepoLink}}" data-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/attachments" data-view-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/view-attachments"></div> | ||||
| 					</div> | ||||
| 					{{$reactions := .Issue.Reactions.GroupByType}} | ||||
|  |  | |||
|  | @ -23,28 +23,23 @@ | |||
| 				{{else}} | ||||
| 					<span class="text grey"><a {{if gt .Poster.ID 0}}href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> {{$.i18n.Tr "repo.issues.commented_at" .HashTag $createdStr | Safe}}</span> | ||||
| 				{{end}} | ||||
|                     {{if not $.Repository.IsArchived}} | ||||
|                         <div class="ui right actions"> | ||||
|                             {{if gt .ShowTag 0}} | ||||
|                                 <div class="item tag"> | ||||
|                                     {{if eq .ShowTag 1}} | ||||
|                                         {{$.i18n.Tr "repo.issues.poster"}} | ||||
|                                     {{else if eq .ShowTag 2}} | ||||
|                                         {{$.i18n.Tr "repo.issues.collaborator"}} | ||||
|                                     {{else if eq .ShowTag 3}} | ||||
|                                         {{$.i18n.Tr "repo.issues.owner"}} | ||||
|                                     {{end}} | ||||
|                                 </div> | ||||
|                             {{end}} | ||||
|                             {{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/comments/%d/reactions" $.RepoLink .ID) }} | ||||
|                             {{if or $.Permission.IsAdmin (eq .Poster.ID $.SignedUserID)}} | ||||
|                                 <div class="item action"> | ||||
|                                     <a class="edit-content" href="#"><i class="octicon octicon-pencil"></i></a> | ||||
|                                     <a class="delete-comment" href="#" data-comment-id={{.HashTag}} data-url="{{$.RepoLink}}/comments/{{.ID}}/delete" data-locale="{{$.i18n.Tr "repo.issues.delete_comment_confirm"}}"><i class="octicon octicon-x"></i></a> | ||||
|                                 </div> | ||||
|                             {{end}} | ||||
|                         </div> | ||||
|                     {{end}} | ||||
| 					{{if not $.Repository.IsArchived}} | ||||
| 						<div class="ui right actions"> | ||||
| 							{{if gt .ShowTag 0}} | ||||
| 								<div class="item tag"> | ||||
| 									{{if eq .ShowTag 1}} | ||||
| 										{{$.i18n.Tr "repo.issues.poster"}} | ||||
| 									{{else if eq .ShowTag 2}} | ||||
| 										{{$.i18n.Tr "repo.issues.collaborator"}} | ||||
| 									{{else if eq .ShowTag 3}} | ||||
| 										{{$.i18n.Tr "repo.issues.owner"}} | ||||
| 									{{end}} | ||||
| 								</div> | ||||
| 							{{end}} | ||||
| 							{{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/comments/%d/reactions" $.RepoLink .ID) }} | ||||
| 							{{template "repo/issue/view_content/context_menu" Dict "ctx" $ "item" . "delete" true "diff" false }} | ||||
| 						</div> | ||||
| 					{{end}} | ||||
| 				</div> | ||||
| 				<div class="ui attached segment"> | ||||
| 					<div class="render-content markdown has-emoji"> | ||||
|  | @ -54,7 +49,7 @@ | |||
| 							<span class="no-content">{{$.i18n.Tr "repo.issues.no_content"}}</span> | ||||
| 						{{end}} | ||||
| 					</div> | ||||
| 					<div class="raw-content hide">{{.Content}}</div> | ||||
| 					<div id="comment-{{.ID}}" class="raw-content hide">{{.Content}}</div> | ||||
| 					<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div> | ||||
| 				</div> | ||||
| 				{{$reactions := .Reactions.GroupByType}} | ||||
|  | @ -277,29 +272,29 @@ | |||
| 			<span class="octicon octicon-primitive-dot"></span> | ||||
| 			<a class="ui avatar image" href="{{.Poster.HomeLink}}"> | ||||
| 				<img src="{{.Poster.RelAvatarLink}}"> | ||||
| 		 	</a> | ||||
| 		 	<span class="text grey"> | ||||
| 			 	{{$.i18n.Tr "repo.issues.dependency.added_dependency" .Poster.HomeLink (.Poster.GetDisplayName|Escape) $createdStr | Safe}} | ||||
| 		 	</span> | ||||
| 		 	<div class="detail"> | ||||
| 			</a> | ||||
| 			<span class="text grey"> | ||||
| 				{{$.i18n.Tr "repo.issues.dependency.added_dependency" .Poster.HomeLink (.Poster.GetDisplayName|Escape) $createdStr | Safe}} | ||||
| 			</span> | ||||
| 			<div class="detail"> | ||||
| 				<span class="octicon octicon-plus"></span> | ||||
| 			 	<span class="text grey"><a href="{{$.RepoLink}}/issues/{{.DependentIssue.Index}}">#{{.DependentIssue.Index}} {{.DependentIssue.Title}}</a></span> | ||||
| 		 	</div> | ||||
| 	 	</div> | ||||
| 				<span class="text grey"><a href="{{$.RepoLink}}/issues/{{.DependentIssue.Index}}">#{{.DependentIssue.Index}} {{.DependentIssue.Title}}</a></span> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	{{else if eq .Type 20}} | ||||
| 		<div class="event" id="{{.HashTag}}"> | ||||
| 		 	<span class="octicon octicon-primitive-dot"></span> | ||||
| 		 	<a class="ui avatar image" href="{{.Poster.HomeLink}}"> | ||||
| 			 	<img src="{{.Poster.RelAvatarLink}}"> | ||||
| 		 	</a> | ||||
| 		 	<span class="text grey"> | ||||
| 			 	{{$.i18n.Tr "repo.issues.dependency.removed_dependency" .Poster.HomeLink (.Poster.GetDisplayName|Escape) $createdStr | Safe}} | ||||
| 		 	</span> | ||||
| 		 	<div class="detail"> | ||||
| 			 	<span class="text grey octicon octicon-trashcan"></span> | ||||
| 			 	<span class="text grey"><a href="{{$.RepoLink}}/issues/{{.DependentIssue.Index}}">#{{.DependentIssue.Index}} {{.DependentIssue.Title}}</a></span> | ||||
| 		 	</div> | ||||
| 	 	</div> | ||||
| 			<span class="octicon octicon-primitive-dot"></span> | ||||
| 			<a class="ui avatar image" href="{{.Poster.HomeLink}}"> | ||||
| 				<img src="{{.Poster.RelAvatarLink}}"> | ||||
| 			</a> | ||||
| 			<span class="text grey"> | ||||
| 				{{$.i18n.Tr "repo.issues.dependency.removed_dependency" .Poster.HomeLink (.Poster.GetDisplayName|Escape) $createdStr | Safe}} | ||||
| 			</span> | ||||
| 			<div class="detail"> | ||||
| 				<span class="text grey octicon octicon-trashcan"></span> | ||||
| 				<span class="text grey"><a href="{{$.RepoLink}}/issues/{{.DependentIssue.Index}}">#{{.DependentIssue.Index}} {{.DependentIssue.Title}}</a></span> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	{{else if eq .Type 22}} | ||||
| 		<div class="event" id="{{.HashTag}}"> | ||||
| 			<span class="octicon octicon-{{.Review.Type.Icon}} issue-symbol"></span> | ||||
|  |  | |||
							
								
								
									
										22
									
								
								templates/repo/issue/view_content/context_menu.tmpl
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										22
									
								
								templates/repo/issue/view_content/context_menu.tmpl
									
									
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,22 @@ | |||
| {{if .ctx.IsSigned}} | ||||
| <div class="item action ui pointing top right custom dropdown context-dropdown"> | ||||
| 	<a class="context-menu"> | ||||
| 		<i class="fa fa-ellipsis-h"></i> | ||||
| 	</a> | ||||
| 	<div class="menu"> | ||||
| 		{{if .diff}} | ||||
| 			<div class="item context clipboard" data-clipboard-text="{{Printf "%s%s/pulls/%d/files#%s" AppUrl .ctx.Repository.FullName .ctx.Issue.Index .item.HashTag}}">{{.ctx.i18n.Tr "repo.issues.context.copy_link"}}</div> | ||||
| 		{{else}} | ||||
| 			<div class="item context clipboard" data-clipboard-text="{{Printf "%s%s/issues/%d#%s" AppUrl .ctx.Repository.FullName .ctx.Issue.Index .item.HashTag}}">{{.ctx.i18n.Tr "repo.issues.context.copy_link"}}</div> | ||||
| 		{{end}} | ||||
| 		<div class="item context quote-reply {{if .diff}}quote-reply-diff{{end}}" data-target="{{.item.ID}}">{{.ctx.i18n.Tr "repo.issues.context.quote_reply"}}</div> | ||||
| 		{{if or .ctx.Permission.IsAdmin (eq .item.Poster.ID .ctx.SignedUserID)}} | ||||
| 			<div class="divider"></div> | ||||
| 			<div class="item context edit-content">{{.ctx.i18n.Tr "repo.issues.context.edit"}}</div> | ||||
| 			{{if .delete}} | ||||
| 				<div class="item context delete-comment" data-comment-id={{.item.HashTag}} data-url="{{.ctx.RepoLink}}/comments/{{.item.ID}}/delete" data-locale="{{.ctx.i18n.Tr "repo.issues.delete_comment_confirm"}}">{{.ctx.i18n.Tr "repo.issues.context.delete"}}</div> | ||||
| 			{{end}} | ||||
| 		{{end}} | ||||
| 	</div> | ||||
| </div> | ||||
| {{end}} | ||||
|  | @ -732,10 +732,41 @@ function initRepository() { | |||
|       return false; | ||||
|     }); | ||||
| 
 | ||||
|     // Issue/PR Context Menus
 | ||||
|     $('.context-dropdown').dropdown({ | ||||
|       action: 'hide' | ||||
|     }); | ||||
| 
 | ||||
|     // Quote reply
 | ||||
|     $('.quote-reply').click(function (event) { | ||||
|       $(this).closest('.dropdown').find('.menu').toggle('visible'); | ||||
|       const target = $(this).data('target'); | ||||
| 
 | ||||
|       let $content; | ||||
|       if ($(this).hasClass('quote-reply-diff')) { | ||||
|         const $parent = $(this).closest('.comment-code-cloud'); | ||||
|         $parent.find('button.comment-form-reply').click(); | ||||
|         $content = $parent.find('[name="content"]'); | ||||
|       } else { | ||||
|         $content = $('#content'); | ||||
|       } | ||||
| 
 | ||||
|       const quote = $(`#comment-${target}`).text().replace(/\n/g, '\n> '); | ||||
|       const content = `> ${quote}\n\n`; | ||||
| 
 | ||||
|       if ($content.val() !== '') { | ||||
|         $content.val(`${$content.val()}\n\n${content}`); | ||||
|       } else { | ||||
|         $content.val(`${content}`); | ||||
|       } | ||||
|       $content.focus(); | ||||
|       event.preventDefault(); | ||||
|     }); | ||||
| 
 | ||||
|     // Edit issue or comment content
 | ||||
|     $('.edit-content').click(function () { | ||||
|       const $segment = $(this).parent().parent().parent() | ||||
|         .next(); | ||||
|     $('.edit-content').click(function (event) { | ||||
|       $(this).closest('.dropdown').find('.menu').toggle('visible'); | ||||
|       const $segment = $(this).closest('.header').next(); | ||||
|       const $editContentZone = $segment.find('.edit-content-zone'); | ||||
|       const $renderContent = $segment.find('.render-content'); | ||||
|       const $rawContent = $segment.find('.raw-content'); | ||||
|  | @ -881,7 +912,7 @@ function initRepository() { | |||
|         $textarea.val($rawContent.text()); | ||||
|       } | ||||
|       $textarea.focus(); | ||||
|       return false; | ||||
|       event.preventDefault(); | ||||
|     }); | ||||
| 
 | ||||
|     // Delete comment
 | ||||
|  | @ -931,7 +962,6 @@ function initRepository() { | |||
|       $(this).closest('.form').hide(); | ||||
|       $mergeButton.parent().show(); | ||||
|     }); | ||||
| 
 | ||||
|     initReactionSelector(); | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
|  | @ -748,6 +748,10 @@ | |||
|                     .item { | ||||
|                         float: left; | ||||
| 
 | ||||
|                         &.context { | ||||
|                             float: none; | ||||
|                         } | ||||
| 
 | ||||
|                         &.tag { | ||||
|                             margin-right: 5px; | ||||
|                         } | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue