leftypol
/
leftypol
4
5
Fork 2
Code Issues 60 Pull Requests 1 Projects Releases Wiki Activity
Browse Source

Revert "Comment toolbar update and Thread stats addition"

pull/40/head
Fredrick Brennan 10 years ago
committed by czaks
parent
69a6631742
commit
1b0f5fd24c
2 changed files with 206 additions and 333 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 538
      js/comment-toolbar.js
  2. 1
      stylesheets/style.css

538
js/comment-toolbar.js
View File

@ -8,379 +8,253 @@
* $config['additional_javascript'][] = 'js/comment-toolbar.js'; * $config['additional_javascript'][] = 'js/comment-toolbar.js';
*/ */
if (active_page == 'thread' || active_page == 'index') { if (active_page == 'thread' || active_page == 'index') {
var formatText = (function($){ $(document).ready(function () {
"use strict"; 'use strict';
var self = {}; var formats = {
self.rules = { bold: {
spoiler: { displayText: 'B',
text: 'Spoiler', altText: 'bold',
key: 's', styleCSS: 'font-weight: bold;',
multiline: false, options: {
exclusiveline: false, prefix: "'''",
prefix:'**', suffix: "'''"
suffix:'**' },
edit: function (box, options) {
wrapSelection(box, options);
},
shortcutKey: 'b'
}, },
italics: { italics: {
text: 'Italics', displayText: 'i',
key: 'i', altText: 'italics',
multiline: false, styleCSS: 'font-style: italic;',
exclusiveline: false, options: {
prefix: "''", prefix: "''",
suffix: "''" suffix: "''"
},
edit: function (box, options) {
wrapSelection(box, options);
},
shortcutKey: 'i'
}, },
bold: { under: {
text: 'Bold', displayText: 'U',
key: 'b', altText: 'underline',
multiline: false, styleCSS: 'text-decoration: underline;',
exclusiveline: false, options: {
prefix: "'''", prefix: '__',
suffix: "'''" suffix: '__'
},
edit: function (box, options) {
wrapSelection(box, options);
},
shortcutKey: 'u'
}, },
underline: { spoiler: {
text: 'Underline', displayText: 'spoiler',
key: 'u', altText: 'mark as spoiler',
multiline: false, styleCSS: '',
exclusiveline: false, options: {
prefix:'__', prefix: '[spoiler]',
suffix:'__' suffix: '[/spoiler]'
},
edit: function (box, options) {
wrapSelection(box, options);
},
shortcutKey: 's'
}, },
code: { code: {
text: 'Code', displayText: 'code',
key: 'f', altText: "code formatting",
multiline: true, styleCSS: 'font-family: "Courier New", Courier, monospace;',
exclusiveline: false, options: {
prefix: '[code]', prefix: '[code]',
suffix: '[/code]' suffix: '[/code]',
multiline: true
},
edit: function (box, options) {
wrapSelection(box, options);
},
shortcutKey: 'd'
}, },
strike: { strike: {
text: 'Strike', displayText: 'strike',
key: 'd', altText: 'strikethrough',
multiline:false, styleCSS: 'text-decoration: line-through;',
exclusiveline:false, options: {
prefix:'~~', prefix: '~~',
suffix:'~~' suffix: '~~'
},
edit: function (box, options) {
wrapSelection(box, options);
}
}, },
heading: { heading: {
text: 'Heading', displayText: 'heading',
key: 'r', altText: 'redtext',
multiline:false, styleCSS: 'color: #AF0A0F; font-weight: bold;',
exclusiveline:true, options: {
prefix:'==', prefix: '==',
suffix:'==' suffix: '==',
exclusiveLine: true
},
edit: function (box, options) {
wrapSelection(box, options);
}
} }
}; };
self.toolbar_wrap = function(node) { var key, name, altText, ele;
if (!localStorage.formatText_enable || localStorage.formatText_enable == 'false') return; var strBuilder = [];
var parent = $(node).parents('form[name="post"]'); var subStr = '';
self.wrap(parent.find('#body')[0],'textarea[name="body"]', parent.find('.format-text > select')[0].value, false); var styleRules = '';
};
//not exactly mine
self.wrap = function(ref, target, option, expandedwrap) { var wrapSelection = function (box, options) {
if (!localStorage.formatText_enable || localStorage.formatText_enable == 'false') return; if (box == null) {
// clean and validate arguments return;
if (ref == null) return;
var settings = {multiline: false, exclusiveline: false, prefix:'', suffix: null};
$.extend(settings,JSON.parse(localStorage.formatText_rules)[option]);
// resolve targets into array of proper node elements
// yea, this is overly verbose, oh well.
var res = [];
if (target instanceof Array) {
for (var indexa in target) {
if (target.hasOwnProperty(indexa)) {
if (typeof target[indexa] == 'string') {
var nodes = $(target[indexa]);
for (var indexb in nodes) {
if (indexa.hasOwnProperty(indexb)) res.push(nodes[indexb]);
}
} else {
res.push(target[indexa]);
}
}
}
} else {
if (typeof target == 'string') {
var nodes = $(target);
for (var index in nodes) {
if (nodes.hasOwnProperty(index)) res.push(nodes[index]);
}
} else {
res.push(target);
}
} }
target = res; var prefix = options.prefix;
//record scroll top to restore it later. var suffix = options.suffix;
var scrollTop = ref.scrollTop; var multiline = options.multiline || false;
var exclusiveLine = options.exclusiveLine || false;
//We will restore the selection later, so record the current selection //record scroll top to restore it later.
var selectionStart = ref.selectionStart; var scrollTop = box.scrollTop;
var selectionEnd = ref.selectionEnd; var selectionStart = box.selectionStart;
var selectionEnd = box.selectionEnd;
var text = box.value;
var beforeSelection = text.substring(0, selectionStart);
var selectedText = text.substring(selectionStart, selectionEnd);
var afterSelection = text.substring(selectionEnd);
var text = ref.value;
var before = text.substring(0, selectionStart);
var selected = text.substring(selectionStart, selectionEnd);
var after = text.substring(selectionEnd);
var whiteSpace = [" ","\t"];
var breakSpace = ["\r","\n"]; var breakSpace = ["\r","\n"];
var cursor; var trailingSpace = "";
var cursor = selectedText.length - 1;
// handles multiline selections on formatting that doesn't support spanning over multiple lines
if (!settings.multiline) selected = selected.replace(/(\r|\n|\r\n)/g,settings.suffix +"$1"+ settings.prefix); //remove trailing space
while (cursor > 0 && selectedText[cursor] === " ") {
// handles formatting that requires it to be on it's own line OR if the user wishes to expand the wrap to the nearest linebreak trailingSpace += " ";
if (settings.exclusiveline || expandedwrap) { cursor--;
}
selectedText = selectedText.substring(0, cursor + 1);
if (!multiline)
selectedText = selectedText.replace(/(\r|\n|\r\n)/g, suffix +"$1"+ prefix);
if (exclusiveLine) {
// buffer the begining of the selection until a linebreak // buffer the begining of the selection until a linebreak
cursor = before.length -1; cursor = beforeSelection.length -1;
while (cursor >= 0 && breakSpace.indexOf(before.charAt(cursor)) == -1) { while (cursor >= 0 && breakSpace.indexOf(beforeSelection.charAt(cursor)) == -1) {
cursor--; cursor--;
} }
selected = before.substring(cursor +1) + selected; selectedText = beforeSelection.substring(cursor +1) + selectedText;
before = before.substring(0, cursor +1); beforeSelection = beforeSelection.substring(0, cursor +1);
// buffer the end of the selection until a linebreak // buffer the end of the selection until a linebreak
cursor = 0; cursor = 0;
while (cursor < after.length && breakSpace.indexOf(after.charAt(cursor)) == -1) { while (cursor < afterSelection.length && breakSpace.indexOf(afterSelection.charAt(cursor)) == -1) {
cursor++; cursor++;
} }
selected += after.substring(0, cursor); selectedText += afterSelection.substring(0, cursor);
after = after.substring(cursor); afterSelection = afterSelection.substring(cursor);
} }
// set values box.value = beforeSelection + prefix + selectedText + suffix + trailingSpace + afterSelection;
var res = before + settings.prefix + selected + settings.suffix + after;
$(target).val(res); box.selectionEnd = beforeSelection.length + prefix.length + selectedText.length;
// restore the selection area and scroll of the reference
ref.selectionEnd = before.length + settings.prefix.length + selected.length;
if (selectionStart === selectionEnd) { if (selectionStart === selectionEnd) {
ref.selectionStart = ref.selectionEnd; box.selectionStart = box.selectionEnd;
} else { } else {
ref.selectionStart = before.length + settings.prefix.length; box.selectionStart = beforeSelection.length + prefix.length;
} }
ref.scrollTop = scrollTop; box.scrollTop = scrollTop;
}; };
self.build_toolbars = function(){
if (!localStorage.formatText_enable || localStorage.formatText_enable == 'false') return;
if (localStorage.formatText_toolbar == 'true'){
// remove existing toolbars
if ($('.format-text').length > 0) $('.format-text').remove();
// Place toolbar above each textarea input
var name, options = '', rules = JSON.parse(localStorage.formatText_rules);
for (var index in rules) {
if (!rules.hasOwnProperty(index)) continue;
name = rules[index].text;
//add hint if key exists /* Generate the HTML for the toolbar
if (rules[index].key) { */
name += ' (CTRL + '+ rules[index].key.toUpperCase() +')'; for (ele in formats) {
if (formats.hasOwnProperty(ele) && formats[ele].displayText != null) {
name = formats[ele].displayText;
altText = formats[ele].altText || '';
key = formats[ele].shortcutKey;
//add tooltip text
if (altText) {
if (key) {
altText += ' (ctrl+'+ key +')';
} }
options += '<option value="'+ index +'">'+ name +'</option>'; altText = 'title="'+ altText +'"';
}
$('[name="body"]').before('<div class="format-text"><a href="javascript:;" onclick="formatText.toolbar_wrap(this);">Wrap</a><select>'+ options +'</select></div>');
$('body').append('<style>#quick-reply .format-text>a{width:15%;display:inline-block;text-align:center;}#quick-reply .format-text>select{width:85%;};</style>');
}
};
self.add_rule = function(rule, index){
if (rule === undefined) rule = {
text: 'New Rule',
key: '',
multiline:false,
exclusiveline:false,
prefix:'',
suffix:''
}
// generate an id for the rule
if (index === undefined) {
var rules = JSON.parse(localStorage.formatText_rules);
while (rules[index] || index === undefined) {
index = ''
index +='abcdefghijklmnopqrstuvwxyz'.substr(Math.floor(Math.random()*26),1);
index +='abcdefghijklmnopqrstuvwxyz'.substr(Math.floor(Math.random()*26),1);
index +='abcdefghijklmnopqrstuvwxyz'.substr(Math.floor(Math.random()*26),1);
} }
subStr = '<a href="javascript:void(0)" '+ altText +' id="tf-'+ ele +'">'+ name +'</a>';
strBuilder.push(subStr);
} else {
continue;
} }
if (window.Options && Options.get_tab('formatting')){ }
var html = $('<div class="format_rule" name="'+ index +'"></div>').html('\
<input type="text" name="text" class="format_option" size="10" value=\"'+ rule.text.replace(/"/g, '&quot;') +'\">\ $( 'textarea[name="body"]' ).before( '<div class="tf-toolbar"></div>' );
<input type="checkbox" name="multiline" class="format_option" '+ (rule.multiline ? 'checked' : '') +'>\ $( '.tf-toolbar' ).html( strBuilder.join(' | ') );
<input type="checkbox" name="exclusiveline" class="format_option" '+ (rule.exclusiveline ? 'checked' : '') +'>\
<input type="text" name="prefix" class="format_option" size="8" value=\"'+ (rule.prefix ? rule.prefix.replace(/"/g, '&quot;') : '') +'\">\ /* Sets the CSS style
<input type="text" name="suffix" class="format_option" size="8" value=\"'+ (rule.suffix ? rule.suffix.replace(/"/g, '&quot;') : '') +'\">\ */
<input type="text" name="key" class="format_option" size="2" maxlength="1" value=\"'+ rule.key +'\">\ styleRules = '\n/* generated by 8chan Formatting Tools */'+
<input type="button" value="X" onclick="if(confirm(\'Do you wish to remove the '+ rule.text +' formatting rule?\'))$(this).parent().remove();">\ '\n.tf-toolbar {padding: 0px 5px 1px 5px;}'+
'); '\n.tf-toolbar :link {text-decoration: none;}';
for (ele in formats) {
if ($('.format_rule').length > 0) { if (formats.hasOwnProperty(ele) && formats[ele].styleCSS) {
$('.format_rule').last().after(html); styleRules += ' \n#tf-' + ele + ' {' + formats[ele].styleCSS + '}';
} else {
Options.extend_tab('formatting', html);
} }
} }
}; //add CSS rule to user's custom CSS if it exist
if ($( '.user-css' ).length !== 0) {
self.save_rules = function(){ $( '.user-css' ).append( styleRules );
var newrules = {}, rules = $('.format_rule');
for (var index=0;rules[index];index++) {
newrules[$(rules[index]).attr('name')] = {
text: $(rules[index]).find('[name="text"]').val(),
key: $(rules[index]).find('[name="key"]').val(),
prefix: $(rules[index]).find('[name="prefix"]').val(),
suffix: $(rules[index]).find('[name="suffix"]').val(),
multiline: $(rules[index]).find('[name="multiline"]').is(':checked'),
exclusiveline: $(rules[index]).find('[name="exclusiveline"]').is(':checked')
};
}
localStorage.formatText_rules = JSON.stringify(newrules);
self.build_toolbars();
};
self.reset_rules = function() {
localStorage.formatText_rules = JSON.stringify(self.rules);
};
// store default rules for customizing
if (!localStorage.formatText_rules) self.reset_rules();
// Add settings to Options panel general tab
if (window.Options && Options.get_tab('general')) {
var s1 = '#formatText_enable>input', s2 = '#formatText_keybinds>input', s3 = '#formatText_toolbar>input', e = 'change';
Options.extend_tab('general', '\
<fieldset>\
<legend>Formatting Options</legend>\
<label id="formatText_enable"><input type="checkbox" checked="checked" id="formatText_enable">' + _('Enable post formatting') + '</label>\
<label id="formatText_keybinds"><input type="checkbox" checked="checked" id="formatText_keybinds">' + _('Enable formatting keybinds') + '</label>\
<label id="formatText_toolbar"><input type="checkbox" checked="checked" id="formatText_toolbar">' + _('Show formatting toolbar') + '</label>\
</fieldset>\
');
} else {
var s1 = '#formatText_enable', s2 = '#formatText_keybinds', s3 = '#formatText_toolbar', e = 'click';
$('hr:first').before('<div id="formatText_enable" style="text-align:right"><a class="unimportant" href="javascript:void(0)">'+ _('Enable post formatting') +'</a></div>');
$('hr:first').before('<div id="formatText_keybinds" style="text-align:right"><a class="unimportant" href="javascript:void(0)">'+ _('Enable formatting keybinds') +'</a></div>');
$('hr:first').before('<div id="formatText_toolbar" style="text-align:right"><a class="unimportant" href="javascript:void(0)">'+ _('Show formatting toolbar') +'</a></div>');
}
// setting for enableing text formatting
$(s1).on(e, function(e) {
if (!localStorage.formatText_enable || localStorage.formatText_enable == 'false') {
localStorage.formatText_enable = 'true';
if (window.Options && Options.get_tab('general')) e.target.checked = true;
} else { } else {
localStorage.formatText_enable = 'false'; $( 'body' ).append( '<style>'+ styleRules +'\n</style>' );
if (window.Options && Options.get_tab('general')) e.target.checked = false;
} }
});
/* Attach event listeners
// setting for enableing formatting keybinds */
$(s2).on(e, function(e) { $( 'body' ).on( 'keydown', 'textarea[name="body"]', {formats: formats}, function (e) {
if (!localStorage.formatText_keybinds || localStorage.formatText_keybinds == 'false') { //shortcuts
localStorage.formatText_keybinds = 'true'; if (e.ctrlKey) {
if (window.Options && Options.get_tab('general')) e.target.checked = true; var ch = String.fromCharCode(e.which).toLowerCase();
} else { var box = e.target;
localStorage.formatText_keybinds = 'false'; var formats = e.data.formats;
if (window.Options && Options.get_tab('general')) e.target.checked = false; for (var ele in formats) {
if (formats.hasOwnProperty(ele) && (ch === formats[ele].shortcutKey)) {
formats[ele].edit(box, formats[ele].options);
e.preventDefault();
}
}
} }
}); });
$( 'body' ).on( 'keydown', '#quick-reply textarea[name="body"]', {formats: formats}, function (e) {
// setting for toolbar injection //close quick reply when esc is prssed
$(s3).on(e, function(e) { if (e.which === 27) {
if (!localStorage.formatText_toolbar || localStorage.formatText_toolbar == 'false') { $( '.close-btn' ).trigger( 'click' );
localStorage.formatText_toolbar = 'true';
if (window.Options && Options.get_tab('general')) e.target.checked = true;
formatText.build_toolbars();
} else {
localStorage.formatText_toolbar = 'false';
if (window.Options && Options.get_tab('general')) e.target.checked = false;
$('.format-text').remove();
} }
}); });
$( 'body' ).on( 'click', '.tf-toolbar a[id]', {formats: formats}, function (e) {
// make sure the tab settings are switch properly at loadup //toolbar buttons
if (window.Options && Options.get_tab('general')) { var formats = e.data.formats;
if (localStorage.formatText_enable == 'true') $(s1)[0].checked = true; var box = $(e.target).parent().next()[0];
else $(s1)[0].checked = false;
if (localStorage.formatText_keybinds == 'true') $(s2)[0].checked = true; for (var ele in formats) {
else $(s2)[0].checked = false; if (formats.hasOwnProperty(ele) && (e.target.id === 'tf-' + ele)) {
if (localStorage.formatText_toolbar == 'true') $(s2)[0].checked = true; formats[ele].edit(box, formats[ele].options);
else $(s3)[0].checked = false;
}
// add the tab for customizing the format settings
if (window.Options && !Options.get_tab('formatting')) {
Options.add_tab('formatting', 'angle-right', 'Customize Formatting');
Options.extend_tab('formatting', '\
<style>\
.format_option{\
margin-right:5px;\
overflow:initial;\
font-size:15px;\
}\
.format_option[type="text"]{\
text-align:center;\
padding-bottom: 2px;\
padding-top: 2px;\
}\
.format_option:last-child{\
margin-right:0;\
}\
fieldset{\
margin-top:5px;\
}\
</style>\
');
// Data control row
Options.extend_tab('formatting', '\
<button onclick="formatText.add_rule();">Add Rule</button>\
<button onclick="formatText.save_rules();">Save Rules</button>\
<button onclick="formatText.reset_rules();">Reset Rules to Default</button>\
');
// Descriptor row
Options.extend_tab('formatting', '\
<span class="format_option" style="margin-left:25px;">Name</span>\
<span class="format_option" style="margin-left:45px;" title="Multi-line: Allow formatted area to contain linebreaks.">ML</span>\
<span class="format_option" style="margin-left:0px;" title="Exclusive-line: Require formatted area to start after and end before a linebreak.">EL</span>\
<span class="format_option" style="margin-left:25px;" title="Text injected at the start of a format area.">Prefix</span>\
<span class="format_option" style="margin-left:60px;" title="Text injected at the end of a format area.">Suffix</span>\
<span class="format_option" style="margin-left:40px;" title="Optional keybind value to allow keyboard shortcut access.">Key</span>\
');
// Rule rows
var rules = JSON.parse(localStorage.formatText_rules);
for (var index in rules){
if (!rules.hasOwnProperty(index)) continue;
self.add_rule(rules[index], index);
}
}
return self;
})(jQuery);
// run initial toolbar injection
formatText.build_toolbars();
//attach listeners to <body> so it also works on quick-reply box
$('body').on('keydown', '#body, #quick-reply #body', function(e) {
if (!localStorage.formatText_enable || localStorage.formatText_enable == 'false') return;
if (!localStorage.formatText_keybinds || localStorage.formatText_keybinds == 'false') return;
var key = String.fromCharCode(e.which).toLowerCase();
var rules = JSON.parse(localStorage.formatText_rules);
for (var index in rules) {
if (!rules.hasOwnProperty(index)) continue;
if (key === rules[index].key && e.ctrlKey) {
e.preventDefault();
if (e.shiftKey) {
formatText.wrap(e.target, 'textarea[name="body"]', index, true);
} else {
formatText.wrap(e.target, 'textarea[name="body"]', index, false);
} }
} }
} });
// $( 'body' ).on( 'keydown', function (e) {
// if (e.which === 67 &&
// e.target.nodeName !== 'INPUT' && //The C, the whole C, and nothing but the C
// e.target.nodeName !== 'TEXTAREA' &&
// !(e.ctrlKey || e.altKey || e.shiftKey)) {
// document.location.href = '//'+ document.location.host +'/'+ board_name +'/catalog.html';
// }
// });
}); });
$(document).trigger('formatText'); }
}

1
stylesheets/style.css
View File

@ -896,7 +896,6 @@ div.thread:hover {
right: 0px; right: 0px;
text-align: left; text-align: left;
font-size: 12px; font-size: 12px;
overflow-y: auto;
} }
.options_tab h2 { .options_tab h2 {

Write Preview
Loading…
Cancel
Save