Make line highlighting and 'Goto'-Feature available on all modes

This commit is contained in:
Tobias Hößl 2016-11-20 21:55:03 +01:00
parent 577d0bf3cc
commit c888419527
7 changed files with 40 additions and 32 deletions

View File

@ -198,7 +198,7 @@ angular.module('OpenSlidesApp.motions', [
return lineNumberingService.insertLineNumbers(html, lineLength, highlight, callback); return lineNumberingService.insertLineNumbers(html, lineLength, highlight, callback);
}, },
getTextBetweenChangeRecommendations: function (versionId, change1, change2) { getTextBetweenChangeRecommendations: function (versionId, change1, change2, highlight) {
var line_from = (change1 ? change1.line_to : 1), var line_from = (change1 ? change1.line_to : 1),
line_to = (change2 ? change2.line_from : null); line_to = (change2 ? change2.line_from : null);
@ -216,11 +216,11 @@ angular.module('OpenSlidesApp.motions', [
html = data.outerContextStart + data.innerContextStart + data.html + html = data.outerContextStart + data.innerContextStart + data.html +
data.innerContextEnd + data.outerContextEnd; data.innerContextEnd + data.outerContextEnd;
html = lineNumberingService.insertLineNumbers(html, lineLength, null, null, line_from); html = lineNumberingService.insertLineNumbers(html, lineLength, highlight, null, line_from);
return html; return html;
}, },
getTextRemainderAfterLastChangeRecommendation: function(versionId, changes) { getTextRemainderAfterLastChangeRecommendation: function(versionId, changes, highlight) {
var maxLine = 0; var maxLine = 0;
for (var i = 0; i < changes.length; i++) { for (var i = 0; i < changes.length; i++) {
if (changes[i].line_to > maxLine) { if (changes[i].line_to > maxLine) {
@ -235,11 +235,11 @@ angular.module('OpenSlidesApp.motions', [
html = data.outerContextStart + data.innerContextStart + html = data.outerContextStart + data.innerContextStart +
data.html + data.html +
data.innerContextEnd + data.outerContextEnd; data.innerContextEnd + data.outerContextEnd;
html = lineNumberingService.insertLineNumbers(html, lineLength, null, null, maxLine); html = lineNumberingService.insertLineNumbers(html, lineLength, highlight, null, maxLine);
return html; return html;
}, },
_getTextWithChangeRecommendations: function (versionId, statusCompareCb) { _getTextWithChangeRecommendations: function (versionId, highlight, statusCompareCb) {
var lineLength = Config.get('motions_line_length').value, var lineLength = Config.get('motions_line_length').value,
html = this.getVersion(versionId).text, html = this.getVersion(versionId).text,
changes = this.getChangeRecommendations(versionId, 'DESC'); changes = this.getChangeRecommendations(versionId, 'DESC');
@ -252,42 +252,43 @@ angular.module('OpenSlidesApp.motions', [
} }
} }
return lineNumberingService.insertLineNumbers(html, lineLength); return lineNumberingService.insertLineNumbers(html, lineLength, highlight);
}, },
getTextWithAllChangeRecommendations: function (versionId) { getTextWithAllChangeRecommendations: function (versionId, highlight) {
return this._getTextWithChangeRecommendations(versionId, function() { return this._getTextWithChangeRecommendations(versionId, highlight, function() {
return true; return true;
}); });
}, },
getTextWithoutRejectedChangeRecommendations: function (versionId) { getTextWithoutRejectedChangeRecommendations: function (versionId, highlight) {
return this._getTextWithChangeRecommendations(versionId, function(rejected) { return this._getTextWithChangeRecommendations(versionId, highlight, function(rejected) {
return !rejected; return !rejected;
}); });
}, },
getTextByMode: function(mode, versionId) { getTextByMode: function(mode, versionId, highlight) {
/* /*
* @param mode ['original', 'diff', 'changed', 'agreed'] * @param mode ['original', 'diff', 'changed', 'agreed']
* @param versionId [if undefined, active_version will be used] * @param versionId [if undefined, active_version will be used]
* @param highlight [the line number to highlight]
*/ */
var text; var text;
switch (mode) { switch (mode) {
case 'original': case 'original':
text = this.getTextWithLineBreaks(versionId); text = this.getTextWithLineBreaks(versionId, highlight);
break; break;
case 'diff': case 'diff':
var changes = this.getChangeRecommendations(versionId, 'ASC'); var changes = this.getChangeRecommendations(versionId, 'ASC');
text = ''; text = '';
for (var i = 0; i < changes.length; i++) { for (var i = 0; i < changes.length; i++) {
text += this.getTextBetweenChangeRecommendations(versionId, (i === 0 ? null : changes[i - 1]), changes[i]); text += this.getTextBetweenChangeRecommendations(versionId, (i === 0 ? null : changes[i - 1]), changes[i], highlight);
text += changes[i].format(this, versionId); text += changes[i].format(this, versionId, highlight);
} }
text += this.getTextRemainderAfterLastChangeRecommendation(versionId, changes); text += this.getTextRemainderAfterLastChangeRecommendation(versionId, changes);
break; break;
case 'changed': case 'changed':
text = this.getTextWithAllChangeRecommendations(versionId); text = this.getTextWithAllChangeRecommendations(versionId, highlight);
break; break;
case 'agreed': case 'agreed':
text = this.getTextWithoutRejectedChangeRecommendations(versionId); text = this.getTextWithoutRejectedChangeRecommendations(versionId, highlight);
break; break;
} }
return text; return text;
@ -583,14 +584,14 @@ angular.module('OpenSlidesApp.motions', [
saveStatus: function() { saveStatus: function() {
this.DSSave(); this.DSSave();
}, },
format: function(motion, version) { format: function(motion, version, highlight) {
var lineLength = Config.get('motions_line_length').value, var lineLength = Config.get('motions_line_length').value,
html = lineNumberingService.insertLineNumbers(motion.getVersion(version).text, lineLength); html = lineNumberingService.insertLineNumbers(motion.getVersion(version).text, lineLength);
var data = diffService.extractRangeByLineNumbers(html, this.line_from, this.line_to), var data = diffService.extractRangeByLineNumbers(html, this.line_from, this.line_to),
oldText = data.outerContextStart + data.innerContextStart + oldText = data.outerContextStart + data.innerContextStart +
data.html + data.innerContextEnd + data.outerContextEnd, data.html + data.innerContextEnd + data.outerContextEnd,
oldTextWithBreaks = lineNumberingService.insertLineNumbersNode(oldText, lineLength, null, this.line_from), oldTextWithBreaks = lineNumberingService.insertLineNumbersNode(oldText, lineLength, highlight, this.line_from),
newTextWithBreaks = lineNumberingService.insertLineNumbersNode(this.text, lineLength, null, this.line_from); newTextWithBreaks = lineNumberingService.insertLineNumbersNode(this.text, lineLength, null, this.line_from);
for (var i = 0; i < oldTextWithBreaks.childNodes.length; i++) { for (var i = 0; i < oldTextWithBreaks.childNodes.length; i++) {

View File

@ -76,7 +76,6 @@ angular.module('OpenSlidesApp.motions.lineNumbering', [])
this._currentLineNumber++; this._currentLineNumber++;
node.setAttribute('class', 'os-line-number line-number-' + lineNumber); node.setAttribute('class', 'os-line-number line-number-' + lineNumber);
node.setAttribute('data-line-number', lineNumber + ''); node.setAttribute('data-line-number', lineNumber + '');
node.setAttribute('name', 'L' + lineNumber);
node.setAttribute('contenteditable', 'false'); node.setAttribute('contenteditable', 'false');
node.innerHTML = '&nbsp;'; // Prevent tinymce from stripping out empty span's node.innerHTML = '&nbsp;'; // Prevent tinymce from stripping out empty span's
return node; return node;

View File

@ -1075,11 +1075,20 @@ angular.module('OpenSlidesApp.motions.site', [
}; };
$scope.scrollToAndHighlight = function (line) { $scope.scrollToAndHighlight = function (line) {
$scope.highlight = line; $scope.highlight = line;
var lineElement = document.getElementsByName('L' + line);
if (lineElement[0]) { // The same line number can occur twice in diff view; we scroll to the first one in this case
// Scroll local var scrollTop = null;
$(".line-number-" + line).each(function() {
var top = $(this).offset().top;
if (top > 0 && (scrollTop === null || top < scrollTop)) {
scrollTop = top;
}
});
if (scrollTop) {
// Scroll local; 50 pixel above the line, so it's not completely squeezed to the screen border
$('html, body').animate({ $('html, body').animate({
scrollTop: lineElement[0].getBoundingClientRect().top 'scrollTop': scrollTop - 50
}, 1000); }, 1000);
} }
// set highlight and scroll on Projector // set highlight and scroll on Projector

View File

@ -345,7 +345,7 @@
<!-- Changed View --> <!-- Changed View -->
<div ng-if="viewChangeRecommendations.mode == 'changed'"> <div ng-if="viewChangeRecommendations.mode == 'changed'">
<div ng-bind-html="motion.getTextByMode('changed', version) | trusted" <div ng-bind-html="motion.getTextByMode('changed', version, highlight) | trusted"
class="motion-text motion-text-changed line-numbers-{{ lineNumberMode }}"></div> class="motion-text motion-text-changed line-numbers-{{ lineNumberMode }}"></div>
<div style="text-align: right;" ng-if="motion.state.versioning && (change_recommendations | filter:{motion_version_id:version}:true).length > 0"> <div style="text-align: right;" ng-if="motion.state.versioning && (change_recommendations | filter:{motion_version_id:version}:true).length > 0">
@ -360,7 +360,7 @@
<!-- Agreed View --> <!-- Agreed View -->
<div ng-if="viewChangeRecommendations.mode == 'agreed'"> <div ng-if="viewChangeRecommendations.mode == 'agreed'">
<div ng-bind-html="motion.getTextByMode('agreed', version) | trusted" <div ng-bind-html="motion.getTextByMode('agreed', version, highlight) | trusted"
class="motion-text motion-text-changed line-numbers-{{ lineNumberMode }}"></div> class="motion-text motion-text-changed line-numbers-{{ lineNumberMode }}"></div>
<div style="text-align: right;" ng-if="motion.state.versioning && (change_recommendations | filter:{motion_version_id:version}:true).length > 0"> <div style="text-align: right;" ng-if="motion.state.versioning && (change_recommendations | filter:{motion_version_id:version}:true).length > 0">

View File

@ -49,8 +49,7 @@
<!-- go to line number --> <!-- go to line number -->
<div class="goto-line-number"> <div class="goto-line-number">
<form class="input-group" ng-if="viewChangeRecommendations.mode == 'original' && lineNumberMode != 'none'" <form class="input-group" ng-if="lineNumberMode != 'none'" ng-submit="scrollToAndHighlight(gotoLinenumber)">
ng-submit="scrollToAndHighlight(gotoLinenumber)">
<input type="number" class="form-control input-sm" ng-model="gotoLinenumber" <input type="number" class="form-control input-sm" ng-model="gotoLinenumber"
placeholder="{{ 'Line' | translate }}"/> placeholder="{{ 'Line' | translate }}"/>
<div class="input-group-btn"> <div class="input-group-btn">

View File

@ -5,7 +5,7 @@
<div class="motion-text-with-diffs line-numbers-{{ lineNumberMode }}"> <div class="motion-text-with-diffs line-numbers-{{ lineNumberMode }}">
<div ng-repeat="change in (changes = (change_recommendations | filter:{motion_version_id:version}:true | orderBy: 'line_from')) "> <div ng-repeat="change in (changes = (change_recommendations | filter:{motion_version_id:version}:true | orderBy: 'line_from')) ">
<div class="motion-text original-text line-numbers-{{ lineNumberMode }}" <div class="motion-text original-text line-numbers-{{ lineNumberMode }}"
ng-bind-html="motion.getTextBetweenChangeRecommendations(version, changes[$index - 1], change) | trusted"></div> ng-bind-html="motion.getTextBetweenChangeRecommendations(version, changes[$index - 1], change, highlight) | trusted"></div>
<div class="diff-box diff-box-{{ change.id }} clearfix"> <div class="diff-box diff-box-{{ change.id }} clearfix">
<div class="action-row" ng-if="motion.isAllowed('can_manage')"> <div class="action-row" ng-if="motion.isAllowed('can_manage')">
@ -36,11 +36,11 @@
</div> </div>
<div class="motion-text motion-text-diff line-numbers-{{ lineNumberMode }}" <div class="motion-text motion-text-diff line-numbers-{{ lineNumberMode }}"
ng-bind-html="change.format(motion, version) | trusted"></div> ng-bind-html="change.format(motion, version, highlight) | trusted"></div>
</div> </div>
</div> </div>
<div class="motion-text original-text line-numbers-{{ lineNumberMode }}" <div class="motion-text original-text line-numbers-{{ lineNumberMode }}"
ng-bind-html="motion.getTextRemainderAfterLastChangeRecommendation(version, changes) | trusted"></div> ng-bind-html="motion.getTextRemainderAfterLastChangeRecommendation(version, changes, highlight) | trusted"></div>
</div> </div>
</div> </div>

View File

@ -5,10 +5,10 @@ describe('linenumbering', function () {
var lineNumberingService, var lineNumberingService,
brMarkup = function (no) { brMarkup = function (no) {
return '<br class="os-line-break">' + return '<br class="os-line-break">' +
'<span class="os-line-number line-number-' + no + '" data-line-number="' + no + '" name="L' + no + '" contenteditable="false">&nbsp;</span>'; '<span class="os-line-number line-number-' + no + '" data-line-number="' + no + '" contenteditable="false">&nbsp;</span>';
}, },
noMarkup = function (no) { noMarkup = function (no) {
return '<span class="os-line-number line-number-' + no + '" data-line-number="' + no + '" name="L' + no + '" contenteditable="false">&nbsp;</span>'; return '<span class="os-line-number line-number-' + no + '" data-line-number="' + no + '" contenteditable="false">&nbsp;</span>';
}, },
longstr = function (length) { longstr = function (length) {
var outstr = ''; var outstr = '';