* Modify diff page style.

This commit is contained in:
caoyanyi
2022-09-06 11:26:15 +08:00
parent 77081214f5
commit cb35891df1
5 changed files with 164 additions and 130 deletions
-48
View File
@@ -124,51 +124,3 @@ $(function()
});
}
})
/**
* Set pane height.
*
* @access public
* @return void
*/
function setHeight()
{
var paneHeight = $(window).height() - 120;
$('#fileTabs .tab-pane').css('height', paneHeight + 'px')
paneHeight += 45;
if($('.label-exchange').html()) paneHeight -= 50;
$('#filesTree').css('height', paneHeight + 'px')
}
setHeight();
$(document).on('click', '.repoFileName', function()
{
var path = encodeURIComponent($(this).data('path'));
var name = $(this).text();
var $tabs = $('#fileTabs').data('zui.tabs');
if(openedFiles.indexOf(path) == -1) openedFiles.push(path);
$tabs.open(createTab(name, path));
setHeight();
arrowTabs('fileTabs', -2);
});
/* Remove file path for opened files. */
$('#fileTabs').on('onClose', function(event, tab) {
var filepath = decodeURIComponent(Base64.decode(tab.id.replaceAll('-', '=')));
var index = openedFiles.indexOf(filepath);
if(index > -1)
{
openedFiles.splice(index, 1)
$('[data-path="' + filepath + '"]').closest('li').removeClass('selected');
}
if(index == openedFiles.length) arrowTabs('fileTabs', -2);
});
/* Append file path into the title. */
$('#fileTabs').on('onLoad', function(event, tab) {
var filepath = Base64.decode(tab.id.replaceAll('-', '='));
$('#tab-nav-item-' + tab.id).attr('title', decodeURIComponent(filepath));
});
+79 -11
View File
@@ -1,12 +1,45 @@
/**
* Change code encoding.
*
* @param string encoding
* @access public
* @return void
*/
function changeEncoding(encoding)
{
$('#encoding').val(encoding);
$('#encoding').parents('form').submit();
}
/**
* Html code decode.
*
* @param string str
* @access public
* @return string
*/
function htmlspecialchars_decode(str){
str = str.replace(/&/g, '&');
str = str.replace(/&lt;/g, '<');
str = str.replace(/&gt;/g, '>');
str = str.replace(/&quot;/g, "''");
str = str.replace(/&#039;/g, "'");
return str;
}
/**
* Get diffs by file name.
*
* @param string fileName
* @access public
* @return object
*/
function getDiffs(fileName)
{
var result = {'new': '', 'old': ''};
var result = {
'code': {'new': '', 'old': ''},
'line': {'new': [], 'old': []}
};
$.each(diffs, function(i, diff)
{
if(diff.fileName == fileName)
@@ -16,13 +49,16 @@ function getDiffs(fileName)
var lines = diff.contents[0].lines;
$.each(lines, function(l, code)
{
if(code.type == 'new')
if(code.type == 'all' || code.type == 'new')
{
result.new += code.line.substring(2) + "\n";
result.code.new += htmlspecialchars_decode(code.line.substring(2)) + "\n";
result.line.new.push(code.newlc);
}
else
if(code.type == 'all' || code.type == 'old')
{
result.old += code.line.substring(2) + "\n";
result.code.old += htmlspecialchars_decode(code.line.substring(2)) + "\n";
result.line.old.push(code.oldlc);
}
})
return result;
@@ -54,8 +90,14 @@ function createTab(filename, filepath)
$(document).ready(function()
{
$("#inline").click(function(){$('#arrange').val('inline');this.form.submit();});
$("#appose").click(function(){$('#arrange').val('appose');this.form.submit();});
var diffAppose = true;
$('#appose').hide();
if(browser == 'ie')
{
$("#inline").click(function(){$('#arrange').val('inline');this.form.submit();});
$("#appose").click(function(){$('#arrange').val('appose');this.form.submit();});
}
$(".label-exchange").click(function(){ $('#exchange').submit();});
$('.btn-left').click(function() {arrowTabs('fileTabs', 1);});
@@ -78,10 +120,9 @@ $(document).ready(function()
$(document).on('click', '.repoFileName', function()
{
var path = encodeURIComponent($(this).data('path'));
var path = $(this).data('path');
var name = $(this).text();
var $tabs = $('#fileTabs').data('zui.tabs');
if(openedFiles.indexOf(path) == -1) openedFiles.push(path);
$tabs.open(createTab(name, path));
setHeight();
@@ -103,8 +144,35 @@ $(document).ready(function()
/* Append file path into the title. */
$('#fileTabs').on('onLoad', function(event, tab) {
var filepath = Base64.decode(tab.id.replaceAll('-', '='));
$('#tab-nav-item-' + tab.id).attr('title', decodeURIComponent(filepath));
var filepath = decodeURIComponent(Base64.decode(tab.id.replaceAll('-', '=')));
$('#tab-nav-item-' + tab.id).attr('title', filepath);
document.getElementById('tab-iframe-' + tab.id).contentWindow.updateEditorInline(diffAppose);
if(openedFiles.indexOf(filepath) == -1) openedFiles.push(filepath);
});
$('#fileTabs').on('onOpen', function(event, tab) {
var filepath = decodeURIComponent(Base64.decode(tab.id.replaceAll('-', '=')));
var index = openedFiles.indexOf(filepath);
if(index > -1) document.getElementById('tab-iframe-' + tab.id).contentWindow.updateEditorInline(diffAppose);
});
$('.inline-appose').on('click', function()
{
$('.inline-appose').hide();
diffAppose = !diffAppose;
if(diffAppose)
{
$('#inline').show();
}
else
{
$('#appose').show();
}
var type = $(this).attr('id');
var tabID = $('.tab-nav-item.active').data('id');
document.getElementById('tab-iframe-' + tabID).contentWindow.updateEditorInline(diffAppose);
return;
});
});
+21 -21
View File
@@ -1,27 +1,27 @@
/**
* Create file tab.
*
* @param string filename
* @param string filepath
* @access public
* @return object
*/
function createTab(filename, filepath)
{
$('[data-path="' + decodeURIComponent(filepath) + '"]').closest('li').addClass('selected');
var tabID = Base64.encode(filepath).replaceAll('=', '-');
return {
title: filename,
id: tabID,
type: 'iframe',
url: createLink('repo', 'ajaxGetEditorContent', urlParams.replace('%s', Base64.encode(encodeURIComponent(filepath))))
};
}
$(function()
{
$('.btn-left').click(function() {arrowTabs('fileTabs', 1);});
$('.btn-right').click(function() {arrowTabs('fileTabs', -2);});
/**
* Create file tab.
*
* @param string filename
* @param string filepath
* @access public
* @return object
*/
function createTab(filename, filepath)
{
$('[data-path="' + decodeURIComponent(filepath) + '"]').closest('li').addClass('selected');
var tabID = Base64.encode(filepath).replaceAll('=', '-');
return {
title: filename,
id: tabID,
type: 'iframe',
url: createLink('repo', 'ajaxGetEditorContent', urlParams.replace('%s', Base64.encode(encodeURIComponent(filepath))))
};
}
$('#fileTabs').tabs({tabs: [createTab(file['basename'], entry)]});
/**
@@ -40,7 +40,7 @@ $(function()
$(document).on('click', '.repoFileName', function()
{
var path = encodeURIComponent($(this).data('path'));
var path = $(this).data('path');
var name = $(this).text();
var $tabs = $('#fileTabs').data('zui.tabs');
if(openedFiles.indexOf(path) == -1) openedFiles.push(path);
+61 -47
View File
@@ -80,6 +80,7 @@ js::import($jsRoot . 'monaco-editor/min/vs/loader.js');
</div>
<?php include '../../common/view/footer.lite.html.php';?>
<script>
var editor = null;
var globalCommit = '';
var codeHeight = $(window).innerHeight() - $('#mainHeader').height() - $('#appsBar').height() - $('#fileTabs .tabs-navbar').height();
if(codeHeight > 0) $.cookie('codeContainerHeight', codeHeight);
@@ -170,6 +171,17 @@ function setTab(titleObj)
};
}
/**
* Update diff editor inline style.
*
* @param bool display
* @access public
* @return void
*/
function updateEditorInline(display){
editor.updateOptions({renderSideBySide: display});
}
$(function()
{
$('.btn-left').click(function() {arrowTabs('relationTabs', 1);});
@@ -196,66 +208,68 @@ $(function()
if(pageType == 'diff')
{
var diffContent = parent.getDiffs(file.basename);
var editor = monaco.editor.createDiffEditor(document.getElementById('codeContainer'),
var diffContent = parent.getDiffs(file.dirname + '/' + file.basename);
editor = monaco.editor.createDiffEditor(document.getElementById('codeContainer'),
{
tabCompletion: 'on',
autoIndent: true,
language: lang,
contextmenu: true,
EditorMinimapOptions: {
enabled: false
},
readOnly: true,
automaticLayout: true
readOnly: true,
language: lang,
autoIndent: true,
inDiffEditor: true,
contextmenu: true,
automaticLayout: true,
renderSideBySide: true,
EditorMinimapOptions: {enabled: false},
lineNumbers: function(number)
{
var newlc = diffContent.line.new;
var oldlc = diffContent.line.old;
return newlc[number - 1];
}
});
editor.setModel({
original: monaco.editor.createModel(diffContent.old, lang),
modified: monaco.editor.createModel(diffContent.new, lang),
original: monaco.editor.createModel(diffContent.code.old.trim("\n"), lang),
modified: monaco.editor.createModel(diffContent.code.new.trim("\n"), lang),
});
}
else
{
var editor = monaco.editor.create(document.getElementById('codeContainer'),
editor = monaco.editor.create(document.getElementById('codeContainer'),
{
tabCompletion: 'on',
autoIndent: true,
value: codeContent.toString(),
language: lang,
contextmenu: true,
EditorMinimapOptions: {
enabled: false
},
readOnly: true,
automaticLayout: true
value: codeContent.toString(),
language: lang,
readOnly: true,
autoIndent: true,
contextmenu: true,
automaticLayout: true,
EditorMinimapOptions: {enabled: false}
});
}
editor.onMouseDown(function(obj)
{
var line = obj.target.position.lineNumber;
var blame = blames[line];
if(!blame) return;
var p_line = parseInt(line);
while(!blame.revision)
editor.onMouseDown(function(obj)
{
p_line--;
blame = blames[p_line];
}
if($('#log').data('line') == p_line) return;
var line = obj.target.position.lineNumber;
var time = blame.time != 'unknown' ? blame.time : '';
var user = blame.committer != 'unknown' ? blame.committer : '';
var version = blame.revision.toString().substring(0, 10);
var content = blameTmpl.replace('%time', time).replace('%name', user).replace('%version', version).replace('%comment', blame.message);
$('.history').text(content);
$('#log').data('line', p_line);
$('#log').css('display', 'flex');
getRelation(blame.revision);
})
var blame = blames[line];
if(!blame) return;
var p_line = parseInt(line);
while(!blame.revision)
{
p_line--;
blame = blames[p_line];
}
if($('#log').data('line') == p_line) return;
var time = blame.time != 'unknown' ? blame.time : '';
var user = blame.committer != 'unknown' ? blame.committer : '';
var version = blame.revision.toString().substring(0, 10);
var content = blameTmpl.replace('%time', time).replace('%name', user).replace('%version', version).replace('%comment', blame.message);
$('.history').text(content);
$('#log').data('line', p_line);
$('#log').css('display', 'flex');
getRelation(blame.revision);
})
}
});
}
+3 -3
View File
@@ -26,16 +26,16 @@ js::set('urlParams', "repoID=$repoID&objectID=$objectID&entry=%s&oldRevision=$ol
<div class='btn-toolbar'>
<?php if(!isonlybody()):?>
<div class="btn btn-left pull-left"><i class="icon icon-chevron-left"></i></div>
<?php if(common::hasPriv('repo', 'download')):?>
<div class="dropdown pull-right">
<button class="btn" type="button" data-toggle="context-dropdown"><i class="icon icon-ellipsis-v icon-rotate-90"></i></button>
<ul class="dropdown-menu">
<?php
echo '<li>' . html::a($this->repo->createLink('download', "repoID=$repoID&path=" . $this->repo->encodePath($entry) . "&fromRevison=$oldRevision&toRevision=$newRevision&type=path"), '<i class="icon icon-download"></i> ' . $lang->repo->downloadDiff, 'hiddenwin') . '</li>';
if(common::hasPriv('repo', 'download')) echo '<li>' . html::a($this->repo->createLink('download', "repoID=$repoID&path=" . $this->repo->encodePath($entry) . "&fromRevison=$oldRevision&toRevision=$newRevision&type=path"), '<i class="icon icon-download"></i> ' . $lang->repo->downloadDiff, 'hiddenwin') . '</li>';
echo '<li>' . html::a('javascript:;', '<i class="icon icon-download"></i> ' . $lang->repo->viewDiffList['inline'], '', "class='inline-appose' id='inline'") . '</li>';
echo '<li>' . html::a('javascript:;', '<i class="icon icon-download"></i> ' . $lang->repo->viewDiffList['appose'], '', "class='inline-appose' id='appose'") . '</li>';
?>
</ul>
</div>
<?php endif;?>
<div class="btn btn-right pull-right"><i class="icon icon-chevron-right"></i></div>
<?php endif;?>
<div class='panel-title'>