domi/forgejo-domi
1
0
Fork 0
forked from forgejo/forgejo
Code Pull requests Activity

Fix and restyle menu on code line (#15913)

Browse source 
* Fix and restyle menu on code line

* fix multiline and more tweaks

* move to separate files

* remove has-context-menu class

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind 2021-05-19 05:16:02 +02:00 • committed by GitHub
parent 0e56e9c9d9
commit 370cfde35e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 60 additions and 84 deletions
Download patch file Download diff file Expand all files Collapse all files

11
web_src/js/code/linebutton.js Normal file
View file

@ -0,0 +1,11 @@
import {svg} from '../svg.js';
export function showLineButton() {
if ($('.code-line-menu').length === 0) return;
$('.code-line-button').remove();
$('.code-view td.lines-code.active').closest('tr').find('td:eq(0)').first().prepend(
$(`<button class="code-line-button">${svg('octicon-kebab-horizontal')}</button>`)
);
$('.code-line-menu').appendTo($('.code-view'));
$('.code-line-button').popup({popup: $('.code-line-menu'), on: 'click'});
}

58
web_src/js/index.js
View file

@ -22,6 +22,7 @@ import {initMarkupAnchors} from './markup/anchors.js';
import {initNotificationsTable, initNotificationCount} from './features/notification.js';
import {initStopwatch} from './features/stopwatch.js';
import {renderMarkupContent} from './markup/content.js';
import {showLineButton} from './code/linebutton.js';
import {stripTags, mqBinarySearch} from './utils.js';
import {svg, svgs} from './svg.js';
@ -2213,49 +2214,6 @@ function searchRepositories() {
});
}
function showCodeViewMenu() {
if ($('.code-view-menu-list').length === 0) {
return;
}
// Get clicked tr
const $code_tr = $('.code-view td.lines-code.active').parent();
// Reset code line marker
$('.code-view-menu-list').appendTo($('.code-view'));
$('.code-line-marker').remove();
// Generate new one
const icon_wrap = $('<div>', {
class: 'code-line-marker'
}).prependTo($code_tr.find('td:eq(0)').get(0)).hide();
const a_wrap = $('<a>', {
class: 'code-line-link'
}).appendTo(icon_wrap);
$('<i>', {
class: 'dropdown icon',
style: 'margin: 0px;'
}).appendTo(a_wrap);
icon_wrap.css({
left: '-7px',
display: 'block',
});
$('.code-view-menu-list').css({
'min-width': '220px',
});
// Popup the menu
$('.code-line-link').popup({
popup: $('.code-view-menu-list'),
on: 'click',
lastResort: 'bottom left',
});
}
function initCodeView() {
if ($('.code-view .lines-num').length > 0) {
$(document).on('click', '.lines-num span', function (e) {
@ -2268,9 +2226,7 @@ function initCodeView() {
}
selectRange($list, $list.filter(`[rel=${$select.attr('id')}]`), (e.shiftKey ? $list.filter('.active').eq(0) : null));
deSelect();
// show code view menu marker
showCodeViewMenu();
showLineButton();
});
$(window).on('hashchange', () => {
@ -2285,10 +2241,7 @@ function initCodeView() {
if (m) {
$first = $list.filter(`[rel=${m[1]}]`);
selectRange($list, $first, $list.filter(`[rel=${m[2]}]`));
// show code view menu marker
showCodeViewMenu();
showLineButton();
$('html, body').scrollTop($first.offset().top - 200);
return;
}
@ -2296,10 +2249,7 @@ function initCodeView() {
if (m) {
$first = $list.filter(`[rel=L${m[2]}]`);
selectRange($list, $first);
// show code view menu marker
showCodeViewMenu();
showLineButton();
$('html, body').scrollTop($first.offset().top - 200);
}
}).trigger('hashchange');

2
web_src/js/svg.js
View file

@ -4,6 +4,7 @@ import octiconGitMerge from '../../public/img/svg/octicon-git-merge.svg';
import octiconGitPullRequest from '../../public/img/svg/octicon-git-pull-request.svg';
import octiconIssueClosed from '../../public/img/svg/octicon-issue-closed.svg';
import octiconIssueOpened from '../../public/img/svg/octicon-issue-opened.svg';
import octiconKebabHorizontal from '../../public/img/svg/octicon-kebab-horizontal.svg';
import octiconLink from '../../public/img/svg/octicon-link.svg';
import octiconLock from '../../public/img/svg/octicon-lock.svg';
import octiconMilestone from '../../public/img/svg/octicon-milestone.svg';
@ -20,6 +21,7 @@ export const svgs = {
'octicon-git-pull-request': octiconGitPullRequest,
'octicon-issue-closed': octiconIssueClosed,
'octicon-issue-opened': octiconIssueOpened,
'octicon-kebab-horizontal': octiconKebabHorizontal,
'octicon-link': octiconLink,
'octicon-lock': octiconLock,
'octicon-milestone': octiconMilestone,