|
45
|
1 // https://fonts.google.com/icons
|
|
|
2
|
|
|
3 function bb_fixTextarea(textarea) {
|
|
44
|
4 let height = textarea.scrollHeight;
|
|
|
5 if( height > textarea.clientHeight ) {
|
|
|
6 textarea.style.height = (height+2) + "px";
|
|
|
7 }
|
|
|
8 }
|
|
|
9
|
|
45
|
10 function bb_fileButtonClick(button) {
|
|
44
|
11 button.parentNode.querySelector('input[type="file"]').click();
|
|
|
12 }
|
|
|
13
|
|
45
|
14 function bb_upload(input,callback) {
|
|
44
|
15 let file = input.files[0];
|
|
|
16 input.value = null;
|
|
|
17 let request = new XMLHttpRequest();
|
|
|
18 let url = 'https://upload.uploadcare.com/base/';
|
|
|
19 request.open( 'POST', url );
|
|
|
20 request.onload = function() {
|
|
|
21 if( request.status !== 200 ) {
|
|
|
22 let err = 'ajax failed: ' + request.status;
|
|
|
23 if( request.responseText ) {
|
|
|
24 err += '\n' + request.responseText;
|
|
|
25 document.write('<pre>'+request.responseText+'</pre>');
|
|
|
26 }
|
|
|
27 console.log(err);
|
|
|
28 ajax( '/error_log.js', 'err='+encodeURIComponent(err) );
|
|
|
29 return;
|
|
|
30 }
|
|
|
31 let response = JSON.parse(request.responseText);
|
|
|
32 let filename = file.name;
|
|
|
33 let url = 'https://ucarecdn.com/' + response.file + '/' + filename;
|
|
|
34 callback(input,url,filename);
|
|
|
35 };
|
|
|
36 let formData = new FormData();
|
|
|
37 formData.append( 'UPLOADCARE_PUB_KEY', 'fe3d30f3088a50941d45' );
|
|
|
38 formData.append( 'file', file );
|
|
|
39 request.send(formData);
|
|
|
40 }
|
|
|
41
|
|
47
|
42 function bb_getDivBbcode(node) {
|
|
44
|
43 do {
|
|
|
44 //console.log(node);
|
|
|
45 if( node.getAttribute('bbcode') !== null )
|
|
|
46 return node;
|
|
|
47 } while( node = node.parentNode );
|
|
|
48 }
|
|
|
49
|
|
46
|
50 function bb_getTextarea(node) {
|
|
47
|
51 return bb_getDivBbcode(node).querySelector('textarea');
|
|
46
|
52 }
|
|
|
53
|
|
45
|
54 function bb_uploaded(input,url,filename) {
|
|
46
|
55 let textarea = bb_getTextarea(input);
|
|
45
|
56 textarea.setRangeText(url,textarea.selectionStart,textarea.selectionEnd,'select');
|
|
44
|
57 textarea.focus();
|
|
45
|
58 }
|
|
|
59
|
|
|
60 function bb_add(input,openTag,closeTag) {
|
|
46
|
61 let textarea = bb_getTextarea(input);
|
|
45
|
62 let start = textarea.selectionStart;
|
|
|
63 let end = textarea.selectionEnd;
|
|
|
64 textarea.setRangeText(closeTag,end,end);
|
|
|
65 textarea.setRangeText(openTag,start,start);
|
|
|
66 let len = openTag.length;
|
|
|
67 textarea.setSelectionRange(start+len,end+len);
|
|
|
68 textarea.focus();
|
|
44
|
69 }
|
|
|
70
|
|
47
|
71 function bb_more(button) {
|
|
|
72 let checked = button.getAttribute('checked') !== null;
|
|
|
73 let buttons = button.parentNode.querySelectorAll('button');
|
|
|
74 if( checked ) {
|
|
|
75 button.removeAttribute('checked');
|
|
|
76 for( let b of buttons ) {
|
|
|
77 if( b === button )
|
|
|
78 break;
|
|
|
79 b.setAttribute('hidden','');
|
|
|
80 }
|
|
|
81 } else {
|
|
|
82 button.setAttribute('checked','');
|
|
|
83 for( let b of buttons ) {
|
|
|
84 if( b === button )
|
|
|
85 break;
|
|
|
86 b.removeAttribute('hidden');
|
|
|
87 }
|
|
|
88 }
|
|
|
89 }
|
|
|
90
|
|
44
|
91 function bbcodeCreate(div,options) {
|
|
46
|
92 if( typeof(div) === 'string' ) {
|
|
44
|
93 div = document.querySelector(div);
|
|
46
|
94 if(!div) throw 'selector not found';
|
|
|
95 }
|
|
|
96 options = options || {};
|
|
44
|
97 let content = options.content || '';
|
|
|
98 let save = options.save;
|
|
|
99 let cancel = options.cancel;
|
|
|
100 let html = `\
|
|
|
101 <div bbcode>
|
|
46
|
102 <textarea name=bbcode oninput="bb_fixTextarea(this)">${content}</textarea>
|
|
45
|
103 <div buttons>
|
|
|
104 <button type=button onclick="bb_add(this,'[b]','[/b]')" title="Bold"><img src="/bbcode/icons/format_bold.svg"></button>
|
|
|
105 <button type=button onclick="bb_add(this,'[i]','[/i]')" title="Italic"><img src="/bbcode/icons/format_italic.svg"></button>
|
|
|
106 <button type=button onclick="bb_add(this,'[u]','[/u]')" title="Underline"><img src="/bbcode/icons/format_underlined.svg"></button>
|
|
|
107 <button type=button onclick="bb_add(this,'[s]','[/s]')" title="Strikethrough"><img src="/bbcode/icons/format_strikethrough.svg"></button>
|
|
|
108 <button type=button onclick="bb_add(this,'[sub]','[/sub]')" title="Subscript"><img src="/bbcode/icons/subscript.svg"></button>
|
|
|
109 <button type=button onclick="bb_add(this,'[sup]','[/sup]')" title="Superscript"><img src="/bbcode/icons/superscript.svg"></button>
|
|
47
|
110 <button more checked type=button onclick="bb_more(this)" title="More..."><img src="/bbcode/icons/more_horiz.svg"></button>
|
|
45
|
111 <input type=file onchange="bb_upload(this,bb_uploaded)">
|
|
|
112 <button type=button onclick="bb_fileButtonClick(this)" title="Upload File"><img src="/bbcode/icons/file_upload.svg"></button>
|
|
44
|
113 ` ;
|
|
|
114 if(save) {
|
|
|
115 html += `\
|
|
45
|
116 <button type=button save title="Send message"><img src="/bbcode/icons/send.svg"></button>
|
|
44
|
117 ` ;
|
|
|
118 }
|
|
|
119 if(cancel) {
|
|
|
120 html += `\
|
|
45
|
121 <button type=button cancel title="Cancel"><img src="/bbcode/icons/cancel.svg"></button>
|
|
44
|
122 ` ;
|
|
|
123 }
|
|
|
124 html += `\
|
|
45
|
125 </div>
|
|
44
|
126 </div>
|
|
|
127 ` ;
|
|
|
128 div.innerHTML = html;
|
|
|
129 if(save)
|
|
|
130 div.querySelector('button[save]').addEventListener('click',save);
|
|
|
131 if(cancel)
|
|
|
132 div.querySelector('button[cancel]').addEventListener('click',cancel);
|
|
46
|
133 let textarea = div.querySelector('textarea')
|
|
|
134 bb_fixTextarea(textarea);
|
|
47
|
135 bb_more( div.querySelector('button[more]') );
|
|
44
|
136 }
|
