mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-11-03 20:36:07 +01:00 
			
		
		
		
	Fix issue comment form and quick-submit (#30623)
1. Rewrite initGlobalEnterQuickSubmit (by the way, remove jQuery) 2. Fix issue comment form layout
This commit is contained in:
		@@ -21,7 +21,7 @@
 | 
				
			|||||||
				<button name="btn">submit get</button>
 | 
									<button name="btn">submit get</button>
 | 
				
			||||||
			</form>
 | 
								</form>
 | 
				
			||||||
			<form method="post" action="fetch-action-test?k=1" class="form-fetch-action">
 | 
								<form method="post" action="fetch-action-test?k=1" class="form-fetch-action">
 | 
				
			||||||
				<div><textarea name="text" rows="3" class="js-quick-submit"></textarea></div>
 | 
									<div><textarea name="text" rows="3"></textarea></div>
 | 
				
			||||||
				<div><label><input name="check" type="checkbox"> check</label></div>
 | 
									<div><label><input name="check" type="checkbox"> check</label></div>
 | 
				
			||||||
				<div><button name="btn">submit post</button></div>
 | 
									<div><button name="btn">submit post</button></div>
 | 
				
			||||||
			</form>
 | 
								</form>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -85,7 +85,8 @@
 | 
				
			|||||||
						{{ctx.AvatarUtils.Avatar .SignedUser 40}}
 | 
											{{ctx.AvatarUtils.Avatar .SignedUser 40}}
 | 
				
			||||||
					</a>
 | 
										</a>
 | 
				
			||||||
					<div class="content">
 | 
										<div class="content">
 | 
				
			||||||
						<form class="ui segment form form-fetch-action" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">
 | 
											<div class="ui segment">
 | 
				
			||||||
 | 
												<form class="ui form form-fetch-action" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">
 | 
				
			||||||
								{{template "repo/issue/comment_tab" .}}
 | 
													{{template "repo/issue/comment_tab" .}}
 | 
				
			||||||
								{{.CsrfTokenHtml}}
 | 
													{{.CsrfTokenHtml}}
 | 
				
			||||||
								<div class="field footer">
 | 
													<div class="field footer">
 | 
				
			||||||
@@ -113,6 +114,7 @@
 | 
				
			|||||||
							</form>
 | 
												</form>
 | 
				
			||||||
						</div>
 | 
											</div>
 | 
				
			||||||
					</div>
 | 
										</div>
 | 
				
			||||||
 | 
									</div>
 | 
				
			||||||
				{{else if .Repository.IsArchived}}
 | 
									{{else if .Repository.IsArchived}}
 | 
				
			||||||
					<div class="ui warning message tw-text-center">
 | 
										<div class="ui warning message tw-text-center">
 | 
				
			||||||
						{{if .Issue.IsPull}}
 | 
											{{if .Issue.IsPull}}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -45,7 +45,7 @@ Template Attributes:
 | 
				
			|||||||
			</div>
 | 
								</div>
 | 
				
			||||||
		</markdown-toolbar>
 | 
							</markdown-toolbar>
 | 
				
			||||||
		<text-expander keys=": @" suffix="">
 | 
							<text-expander keys=": @" suffix="">
 | 
				
			||||||
			<textarea class="markdown-text-editor js-quick-submit"{{if .TextareaName}} name="{{.TextareaName}}"{{end}}{{if .TextareaPlaceholder}} placeholder="{{.TextareaPlaceholder}}"{{end}}{{if .TextareaAriaLabel}} aria-label="{{.TextareaAriaLabel}}"{{end}}{{if .DisableAutosize}} data-disable-autosize="{{.DisableAutosize}}"{{end}}>{{.TextareaContent}}</textarea>
 | 
								<textarea class="markdown-text-editor"{{if .TextareaName}} name="{{.TextareaName}}"{{end}}{{if .TextareaPlaceholder}} placeholder="{{.TextareaPlaceholder}}"{{end}}{{if .TextareaAriaLabel}} aria-label="{{.TextareaAriaLabel}}"{{end}}{{if .DisableAutosize}} data-disable-autosize="{{.DisableAutosize}}"{{end}}>{{.TextareaContent}}</textarea>
 | 
				
			||||||
		</text-expander>
 | 
							</text-expander>
 | 
				
			||||||
		<script>
 | 
							<script>
 | 
				
			||||||
			if (localStorage?.getItem('markdown-editor-monospace') === 'true') {
 | 
								if (localStorage?.getItem('markdown-editor-monospace') === 'true') {
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -16,7 +16,7 @@
 | 
				
			|||||||
			</div>
 | 
								</div>
 | 
				
			||||||
			<div class="field {{if .Err_Content}}error{{end}}">
 | 
								<div class="field {{if .Err_Content}}error{{end}}">
 | 
				
			||||||
				<label for="ssh-key-content">{{ctx.Locale.Tr "settings.key_content"}}</label>
 | 
									<label for="ssh-key-content">{{ctx.Locale.Tr "settings.key_content"}}</label>
 | 
				
			||||||
				<textarea id="ssh-key-content" name="content" class="js-quick-submit" placeholder="{{ctx.Locale.Tr "settings.key_content_ssh_placeholder"}}" required>{{.content}}</textarea>
 | 
									<textarea id="ssh-key-content" name="content" placeholder="{{ctx.Locale.Tr "settings.key_content_ssh_placeholder"}}" required>{{.content}}</textarea>
 | 
				
			||||||
			</div>
 | 
								</div>
 | 
				
			||||||
			<input name="type" type="hidden" value="ssh">
 | 
								<input name="type" type="hidden" value="ssh">
 | 
				
			||||||
			<button class="ui primary button">
 | 
								<button class="ui primary button">
 | 
				
			||||||
@@ -84,7 +84,7 @@
 | 
				
			|||||||
						</div>
 | 
											</div>
 | 
				
			||||||
						<div class="field">
 | 
											<div class="field">
 | 
				
			||||||
							<label for="signature">{{ctx.Locale.Tr "settings.ssh_token_signature"}}</label>
 | 
												<label for="signature">{{ctx.Locale.Tr "settings.ssh_token_signature"}}</label>
 | 
				
			||||||
							<textarea id="ssh-key-signature" name="signature" class="js-quick-submit" placeholder="{{ctx.Locale.Tr "settings.key_signature_ssh_placeholder"}}" required>{{$.signature}}</textarea>
 | 
												<textarea id="ssh-key-signature" name="signature" placeholder="{{ctx.Locale.Tr "settings.key_signature_ssh_placeholder"}}" required>{{$.signature}}</textarea>
 | 
				
			||||||
						</div>
 | 
											</div>
 | 
				
			||||||
						<input name="type" type="hidden" value="verify_ssh">
 | 
											<input name="type" type="hidden" value="verify_ssh">
 | 
				
			||||||
						<button class="ui primary button">
 | 
											<button class="ui primary button">
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1080,8 +1080,8 @@ td .commit-summary {
 | 
				
			|||||||
  clear: none;
 | 
					  clear: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.repository .comment.form .content .form::before,
 | 
					.repository .comment.form .content .segment::before,
 | 
				
			||||||
.repository .comment.form .content .form::after {
 | 
					.repository .comment.form .content .segment::after {
 | 
				
			||||||
  right: 100%;
 | 
					  right: 100%;
 | 
				
			||||||
  top: 20px;
 | 
					  top: 20px;
 | 
				
			||||||
  border: solid transparent;
 | 
					  border: solid transparent;
 | 
				
			||||||
@@ -1092,13 +1092,13 @@ td .commit-summary {
 | 
				
			|||||||
  pointer-events: none;
 | 
					  pointer-events: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.repository .comment.form .content .form::before {
 | 
					.repository .comment.form .content .segment::before {
 | 
				
			||||||
  border-right-color: var(--color-secondary);
 | 
					  border-right-color: var(--color-secondary);
 | 
				
			||||||
  border-width: 9px;
 | 
					  border-width: 9px;
 | 
				
			||||||
  margin-top: -9px;
 | 
					  margin-top: -9px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.repository .comment.form .content .form::after {
 | 
					.repository .comment.form .content .segment::after {
 | 
				
			||||||
  border-right-color: var(--color-box-body);
 | 
					  border-right-color: var(--color-box-body);
 | 
				
			||||||
  border-width: 8px;
 | 
					  border-width: 8px;
 | 
				
			||||||
  margin-top: -8px;
 | 
					  margin-top: -8px;
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -46,10 +46,11 @@ export function initFootLanguageMenu() {
 | 
				
			|||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export function initGlobalEnterQuickSubmit() {
 | 
					export function initGlobalEnterQuickSubmit() {
 | 
				
			||||||
  $(document).on('keydown', '.js-quick-submit', (e) => {
 | 
					  document.addEventListener('keydown', (e) => {
 | 
				
			||||||
    if (((e.ctrlKey && !e.altKey) || e.metaKey) && (e.key === 'Enter')) {
 | 
					    const isQuickSubmitEnter = ((e.ctrlKey && !e.altKey) || e.metaKey) && (e.key === 'Enter');
 | 
				
			||||||
 | 
					    if (isQuickSubmitEnter && e.target.matches('textarea')) {
 | 
				
			||||||
 | 
					      e.preventDefault();
 | 
				
			||||||
      handleGlobalEnterQuickSubmit(e.target);
 | 
					      handleGlobalEnterQuickSubmit(e.target);
 | 
				
			||||||
      return false;
 | 
					 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -9,9 +9,5 @@ export function handleGlobalEnterQuickSubmit(target) {
 | 
				
			|||||||
    // here use the event to trigger the submit event (instead of calling `submit()` method directly)
 | 
					    // here use the event to trigger the submit event (instead of calling `submit()` method directly)
 | 
				
			||||||
    // otherwise the `areYouSure` handler won't be executed, then there will be an annoying "confirm to leave" dialog
 | 
					    // otherwise the `areYouSure` handler won't be executed, then there will be an annoying "confirm to leave" dialog
 | 
				
			||||||
    form.dispatchEvent(new SubmitEvent('submit', {bubbles: true, cancelable: true}));
 | 
					    form.dispatchEvent(new SubmitEvent('submit', {bubbles: true, cancelable: true}));
 | 
				
			||||||
  } else {
 | 
					 | 
				
			||||||
    // if no form, then the editor is for an AJAX request, dispatch an event to the target, let the target's event handler to do the AJAX request.
 | 
					 | 
				
			||||||
    // the 'ce-' prefix means this is a CustomEvent
 | 
					 | 
				
			||||||
    target.dispatchEvent(new CustomEvent('ce-quick-submit', {bubbles: true}));
 | 
					 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user