Changeset View
Changeset View
Standalone View
Standalone View
webroot/rsrc/js/application/diff/DiffInline.js
| /** | /** | ||||
| * @provides phabricator-diff-inline | * @provides phabricator-diff-inline | ||||
| * @requires javelin-dom | * @requires javelin-dom | ||||
| * phabricator-diff-inline-content-state | * phabricator-diff-inline-content-state | ||||
| * @javelin | * @javelin | ||||
| */ | */ | ||||
| JX.install('DiffInline', { | JX.install('DiffInline', { | ||||
| construct : function() { | construct : function() { | ||||
| this._activeContentState = new JX.DiffInlineContentState(); | this._activeContentState = new JX.DiffInlineContentState(); | ||||
| this._committedContentState = new JX.DiffInlineContentState(); | |||||
| }, | }, | ||||
| members: { | members: { | ||||
| _id: null, | _id: null, | ||||
| _phid: null, | _phid: null, | ||||
| _changesetID: null, | _changesetID: null, | ||||
| _row: null, | _row: null, | ||||
| _number: null, | _number: null, | ||||
| _length: null, | _length: null, | ||||
| _displaySide: null, | _displaySide: null, | ||||
| _isNewFile: null, | _isNewFile: null, | ||||
| _replyToCommentPHID: null, | _replyToCommentPHID: null, | ||||
| _originalState: null, | |||||
| _snippet: null, | _snippet: null, | ||||
| _menuItems: null, | _menuItems: null, | ||||
| _documentEngineKey: null, | _documentEngineKey: null, | ||||
| _isDeleted: false, | _isDeleted: false, | ||||
| _isInvisible: false, | _isInvisible: false, | ||||
| _isLoading: false, | _isLoading: false, | ||||
| Show All 18 Lines | members: { | ||||
| _skipFocus: false, | _skipFocus: false, | ||||
| _menu: null, | _menu: null, | ||||
| _startOffset: null, | _startOffset: null, | ||||
| _endOffset: null, | _endOffset: null, | ||||
| _isSelected: false, | _isSelected: false, | ||||
| _canSuggestEdit: false, | _canSuggestEdit: false, | ||||
| _committedContentState: null, | |||||
| _activeContentState: null, | _activeContentState: null, | ||||
| bindToRow: function(row) { | bindToRow: function(row) { | ||||
| this._row = row; | this._row = row; | ||||
| var row_data = JX.Stratcom.getData(row); | var row_data = JX.Stratcom.getData(row); | ||||
| row_data.inline = this; | row_data.inline = this; | ||||
| this._isCollapsed = row_data.hidden || false; | this._isCollapsed = row_data.hidden || false; | ||||
| ▲ Show 20 Lines • Show All 264 Lines • ▼ Show 20 Lines | _newRow: function() { | ||||
| JX.Stratcom.getData(row).inline = this; | JX.Stratcom.getData(row).inline = this; | ||||
| this._row = row; | this._row = row; | ||||
| this._id = null; | this._id = null; | ||||
| this._phid = null; | this._phid = null; | ||||
| this._isCollapsed = false; | this._isCollapsed = false; | ||||
| this._originalState = null; | |||||
| return row; | return row; | ||||
| }, | }, | ||||
| setCollapsed: function(collapsed) { | setCollapsed: function(collapsed) { | ||||
| this._closeMenu(); | this._closeMenu(); | ||||
| this._isCollapsed = collapsed; | this._isCollapsed = collapsed; | ||||
| ▲ Show 20 Lines • Show All 248 Lines • ▼ Show 20 Lines | _oncreateresponse: function(response) { | ||||
| var rows = JX.$H(response.view).getNode(); | var rows = JX.$H(response.view).getNode(); | ||||
| this._readInlineState(response.inline); | this._readInlineState(response.inline); | ||||
| this._drawEditRows(rows); | this._drawEditRows(rows); | ||||
| }, | }, | ||||
| _readInlineState: function(state) { | _readInlineState: function(state) { | ||||
| this._id = state.id; | this._id = state.id; | ||||
| this._originalState = state.contentState; | |||||
| // TODO: This is not the correct content state after a reload: it is | |||||
| // the draft state. | |||||
| this._getCommittedContentState().readWireFormat(state.contentState); | |||||
| this._getActiveContentState().readWireFormat(state.contentState); | this._getActiveContentState().readWireFormat(state.contentState); | ||||
| this._canSuggestEdit = state.canSuggestEdit; | this._canSuggestEdit = state.canSuggestEdit; | ||||
| }, | }, | ||||
| _ondeleteresponse: function() { | _ondeleteresponse: function() { | ||||
| // If there's an existing "unedit" undo element, remove it. | // If there's an existing "unedit" undo element, remove it. | ||||
| ▲ Show 20 Lines • Show All 54 Lines • ▼ Show 20 Lines | _drawContentRows: function(rows) { | ||||
| return this._drawRows(rows, null, 'content'); | return this._drawRows(rows, null, 'content'); | ||||
| }, | }, | ||||
| _drawEditRows: function(rows) { | _drawEditRows: function(rows) { | ||||
| this.setEditing(true); | this.setEditing(true); | ||||
| this._editRow = this._drawRows(rows, null, 'edit'); | this._editRow = this._drawRows(rows, null, 'edit'); | ||||
| this._drawSuggestionState(this._editRow); | this._drawSuggestionState(this._editRow); | ||||
| this.setHasSuggestion(this._originalState.hasSuggestion); | |||||
| // TODO: We're just doing this for the rendering side effect of drawing | |||||
| // the button text. | |||||
| this.setHasSuggestion(this.getHasSuggestion()); | |||||
| }, | }, | ||||
| _drawRows: function(rows, cursor, type) { | _drawRows: function(rows, cursor, type) { | ||||
| var first_row = JX.DOM.scry(rows, 'tr')[0]; | var first_row = JX.DOM.scry(rows, 'tr')[0]; | ||||
| var row = first_row; | var row = first_row; | ||||
| var anchor = cursor || this._row; | var anchor = cursor || this._row; | ||||
| cursor = cursor || this._row.nextSibling; | cursor = cursor || this._row.nextSibling; | ||||
| ▲ Show 20 Lines • Show All 110 Lines • ▼ Show 20 Lines | _getActiveContentState: function() { | ||||
| if (this._editRow) { | if (this._editRow) { | ||||
| state.readForm(this._editRow); | state.readForm(this._editRow); | ||||
| } | } | ||||
| return state; | return state; | ||||
| }, | }, | ||||
| _getCommittedContentState: function() { | |||||
| return this._committedContentState; | |||||
| }, | |||||
| setHasSuggestion: function(has_suggestion) { | setHasSuggestion: function(has_suggestion) { | ||||
| var state = this._getActiveContentState(); | var state = this._getActiveContentState(); | ||||
| state.setHasSuggestion(has_suggestion); | state.setHasSuggestion(has_suggestion); | ||||
| var button = this._getSuggestionButton(); | var button = this._getSuggestionButton(); | ||||
| var pht = this.getChangeset().getChangesetList().getTranslations(); | var pht = this.getChangeset().getChangesetList().getTranslations(); | ||||
| if (has_suggestion) { | if (has_suggestion) { | ||||
| button | button | ||||
| Show All 37 Lines | _shouldDeleteOnCancel: function() { | ||||
| var state = this._getActiveContentState(); | var state = this._getActiveContentState(); | ||||
| // TODO: This is greatly simplified, too. | // TODO: This is greatly simplified, too. | ||||
| return !state.getText().length; | return !state.getText().length; | ||||
| }, | }, | ||||
| _shouldUndoOnCancel: function() { | _shouldUndoOnCancel: function() { | ||||
| var state = this._getActiveContentState().getWireFormat(); | var new_state = this._getActiveContentState().getWireFormat(); | ||||
| var old_state = this._getCommittedContentState().getWireFormat(); | |||||
| // TODO: This is also simplified. | // TODO: This is also simplified. | ||||
| var is_empty = this._isVoidContentState(state); | var is_empty = this._isVoidContentState(new_state); | ||||
| var is_same = this._isSameContentState(state, this._originalState); | var is_same = this._isSameContentState(new_state, old_state); | ||||
| if (!is_empty && !is_same) { | if (!is_empty && !is_same) { | ||||
| return true; | return true; | ||||
| } | } | ||||
| return false; | return false; | ||||
| }, | }, | ||||
| ▲ Show 20 Lines • Show All 81 Lines • ▼ Show 20 Lines | cancel: function() { | ||||
| // If you "undo" to restore text ("AB") and then "Cancel", we put you | // If you "undo" to restore text ("AB") and then "Cancel", we put you | ||||
| // back in the original text state ("A"). We also send the original | // back in the original text state ("A"). We also send the original | ||||
| // text ("A") to the server as the current persistent state. | // text ("A") to the server as the current persistent state. | ||||
| this.setEditing(false); | this.setEditing(false); | ||||
| this.setInvisible(false); | this.setInvisible(false); | ||||
| this._applyCancel(this._originalState); | var old_state = this._getCommittedContentState(); | ||||
| this._applyCancel(old_state.getWireFormat()); | |||||
| this._didUpdate(true); | this._didUpdate(true); | ||||
| }, | }, | ||||
| _onCancelResponse: function(response) { | _onCancelResponse: function(response) { | ||||
| // Nothing to do. | // Nothing to do. | ||||
| }, | }, | ||||
| ▲ Show 20 Lines • Show All 211 Lines • ▼ Show 20 Lines | _newContentState: function() { | ||||
| return { | return { | ||||
| text: '', | text: '', | ||||
| suggestionText: '', | suggestionText: '', | ||||
| hasSuggestion: false | hasSuggestion: false | ||||
| }; | }; | ||||
| }, | }, | ||||
| _isVoidContentState: function(state) { | _isVoidContentState: function(state) { | ||||
| if (!state.text) { | |||||
| return true; | |||||
| } | |||||
| return (!state.text.length && !state.suggestionText.length); | return (!state.text.length && !state.suggestionText.length); | ||||
| }, | }, | ||||
| _isSameContentState: function(u, v) { | _isSameContentState: function(u, v) { | ||||
| return ( | return ( | ||||
| ((u === null) === (v === null)) && | ((u === null) === (v === null)) && | ||||
| (u.text === v.text) && | (u.text === v.text) && | ||||
| (u.suggestionText === v.suggestionText) && | (u.suggestionText === v.suggestionText) && | ||||
| (u.hasSuggestion === v.hasSuggestion)); | (u.hasSuggestion === v.hasSuggestion)); | ||||
| } | } | ||||
| } | } | ||||
| }); | }); | ||||