'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabModal.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabPaste.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabQuote.js?v={@LAST_UPDATE_TIME}',
+ '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabReply.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSize.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSmiley.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSource.js?v={@LAST_UPDATE_TIME}',
element.value = autosave.getInitialValue();
}
- var placeholderCallback = null, replyContainer = element.closest('.messageQuickReplyContent');
- if (replyContainer) {
- var container = elById('messageQuickReply');
- if (container.classList.contains('messageQuickReplyCollapsed')) {
- placeholderCallback = function (event) {
- if (event instanceof Event) {
- event.preventDefault();
- }
-
- if (container.classList.contains('messageQuickReplyCollapsed')) {
- container.classList.remove('messageQuickReplyCollapsed');
- $(element).redactor('focus.end');
-
- replyContainer.removeEventListener(WCF_CLICK_EVENT, placeholderCallback);
- }
-
- return null;
- };
-
- replyContainer.addEventListener(WCF_CLICK_EVENT, placeholderCallback);
- }
- }
-
var config = {
buttons: buttons,
formatting: ['p', 'h2', 'h3', 'h4'],
'WoltLabModal',
'WoltLabPaste',
'WoltLabQuote',
+ 'WoltLabReply',
'WoltLabSize',
'WoltLabSmiley',
'WoltLabSource',
buttons: buttonOptions,
buttonMobile: buttonMobile,
customButtons: customButtons,
- highlighters: highlighters,
- placeholderCallback: placeholderCallback
+ highlighters: highlighters
}
};
config.callbacks = config.callbacks || { };
config.callbacks.init = function() {
- var editor = element.previousElementSibling;
- if (replyContainer) {
- elData(editor, 'reply-placeholder', elData(element, 'reply-placeholder'));
- }
-
// slight delay to allow Redactor to initialize itself
window.setTimeout(function() {
$(element).redactor('code.set', content);
- editor.classList.add('redactorReady');
}, 10);
};
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabModal.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabPaste.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabQuote.js?v={@LAST_UPDATE_TIME}',
+ '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabReply.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSize.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSmiley.js?v={@LAST_UPDATE_TIME}',
'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSource.js?v={@LAST_UPDATE_TIME}',
element.value = autosave.getInitialValue();
}
- var placeholderCallback = null, replyContainer = element.closest('.messageQuickReplyContent');
- if (replyContainer) {
- var container = elById('messageQuickReply');
- if (container.classList.contains('messageQuickReplyCollapsed')) {
- placeholderCallback = function (event) {
- if (event instanceof Event) {
- event.preventDefault();
- }
-
- if (container.classList.contains('messageQuickReplyCollapsed')) {
- container.classList.remove('messageQuickReplyCollapsed');
- $(element).redactor('focus.end');
-
- replyContainer.removeEventListener(WCF_CLICK_EVENT, placeholderCallback);
- }
-
- return null;
- };
-
- replyContainer.addEventListener(WCF_CLICK_EVENT, placeholderCallback);
- }
- }
-
var config = {
buttons: buttons,
formatting: ['p', 'h2', 'h3', 'h4'],
'WoltLabModal',
'WoltLabPaste',
'WoltLabQuote',
+ 'WoltLabReply',
'WoltLabSize',
'WoltLabSmiley',
'WoltLabSource',
buttons: buttonOptions,
buttonMobile: buttonMobile,
customButtons: customButtons,
- highlighters: highlighters,
- placeholderCallback: placeholderCallback
+ highlighters: highlighters
}
};
config.callbacks = config.callbacks || { };
config.callbacks.init = function() {
- var editor = element.previousElementSibling;
- if (replyContainer) {
- elData(editor, 'reply-placeholder', elData(element, 'reply-placeholder'));
- }
-
// slight delay to allow Redactor to initialize itself
window.setTimeout(function() {
$(element).redactor('code.set', content);
- editor.classList.add('redactorReady');
}, 10);
};
this.WoltLabCaret._initInternalRange();
},
+ endOfEditor: function () {
+ var editor = this.core.editor()[0];
+
+ if (document.activeElement !== editor) {
+ editor.focus();
+ }
+
+ var lastElement = editor.lastElementChild;
+ if (lastElement.nodeName === 'P') {
+ this.caret.end(lastElement);
+ }
+ else {
+ this.caret.after(lastElement);
+ }
+ },
+
_initInternalRange: function () {
var editor = this.core.editor()[0];
var internalRange = null;
this._callbacks = [];
this._elementId = this.$element[0].id;
- require(['EventHandler'], this.WoltLabEvent._setEvents.bind(this));
+ require(['EventHandler'], (function(EventHandler) {
+ this.WoltLabEvent._setEvents(EventHandler);
+
+ var uuid = EventHandler.add('com.woltlab.wcf.redactor2', 'showEditor', (function (data) {
+
+ }).bind(this))
+ }).bind(this));
},
_setEvents: function(EventHandler) {
--- /dev/null
+$.Redactor.prototype.WoltLabReply = function() {
+ "use strict";
+
+ var _callbackClick = null;
+ var _messageContent = null;
+ var _messageQuickReply = null;
+
+ return {
+ init: function () {
+ var messageContent = this.$editor[0].closest('.messageContent');
+ var messageQuickReply = elById('messageQuickReply');
+
+ if (!messageContent || !messageContent.classList.contains('messageQuickReplyContent') || !messageQuickReply || !messageQuickReply.classList.contains('messageQuickReplyCollapsed')) {
+ return;
+ }
+
+ _callbackClick = this.WoltLabReply._click.bind(this);
+ _messageContent = messageContent;
+ _messageQuickReply = messageQuickReply;
+
+ WCF.System.Event.addListener('com.woltlab.wcf.redactor2', 'showEditor', this.WoltLabReply.showEditor.bind(this));
+
+ _messageContent.addEventListener(WCF_CLICK_EVENT, _callbackClick);
+ },
+
+ showEditor: function () {
+ if (!_messageQuickReply.classList.contains('messageQuickReplyCollapsed')) {
+ return;
+ }
+
+ _messageQuickReply.classList.remove('messageQuickReplyCollapsed');
+ _messageContent.removeEventListener(WCF_CLICK_EVENT, _callbackClick);
+
+ this.WoltLabCaret.endOfEditor();
+ },
+
+ _click: function (event) {
+ event.preventDefault();
+
+ WCF.System.Event.fireEvent('com.woltlab.wcf.redactor2', 'showEditor');
+ }
+ };
+};
replyButtons[i].addEventListener(WCF_CLICK_EVENT, (function(event) {
event.preventDefault();
+ this._getEditor().WoltLabReply.showEditor();
+
UiScroll.element(this._container, (function() {
- this._getEditor().focus.end();
+ this._getEditor().WoltLabCaret.endOfEditor();
}).bind(this));
}).bind(this));
}
* @protected
*/
_insertQuote: function (data) {
- this._editor.selection.restore();
+ EventHandler.fire('com.woltlab.wcf.redactor2', 'showEditor');
this._editor.buffer.set();
}
.messageQuickReplyCollapsed {
+ border-bottom-width: 0 !important;
+
+ @include screen-sm-down {
+ margin-left: -10px;
+ margin-right: -10px;
+ }
+
.messageSidebar {
- pointer-events: none;
-
- @include screen-sm-down {
- opacity: .6;
- }
-
- @include screen-md-up {
- > .messageAuthor {
- > :not(.userAvatar),
- .badgeOnline {
- display: none;
- }
- }
-
- > .userCredits {
- display: none;
- }
- }
+ display: none;
}
.messageQuickReplyContent {
- // simulate clickable area
+ background-color: $wcfSidebarBackground;
cursor: pointer;
+ display: inline-block !important;
+ margin: 0 !important;
+ max-width: 100% !important;
+ overflow: hidden;
+ padding: 20px;
+ position: relative;
+ width: 100% !important;
- .wysiwygTextarea {
- height: 138px;
+ @include screen-md-up {
+ border-radius: 2px;
}
- > .messageBody,
- > .messageFooter {
- pointer-events: none;
+ &::before {
+ color: $wcfSidebarText;
+ content: $fa-var-reply;
+ font-family: FontAwesome;
+ font-size: 28px;
+ height: 32px;
+ line-height: 32px;
+ margin-right: 10px;
+ width: 32px;
+ vertical-align: -5px;
}
- .redactor-editor {
- max-height: 100px !important;
- min-height: 100px !important;
- overflow: hidden;
- position: relative;
-
- &::before {
- color: rgb(169, 169, 169);
- content: attr(data-reply-placeholder);
- display: block;
- left: 20px;
- position: absolute;
- top: 50%;
- transform: translateY(-50%);
- }
+ &::after {
+ color: $wcfSidebarText;
+ content: attr(data-placeholder);
- > * {
- visibility: hidden;
+ @include screen-sm-up {
+ @include wcfFontSection;
}
}
- .redactor-toolbar > li,
- .messageTabMenu li {
- opacity: .5;
+ > .messageBody {
+ left: 200%;
+ position: absolute;
+ top: -100%;
}
> .messageFooter {