##// END OF EJS Templates
Insert markup only to the text textarea
neko259 -
r1768:e1a0b47b default
parent child Browse files
Show More
@@ -1,190 +1,190
1 var ITEM_FILE_SOURCE = 'fileSource';
1 var ITEM_FILE_SOURCE = 'fileSource';
2 var URL_STICKERS = '/api/stickers';
2 var URL_STICKERS = '/api/stickers';
3 var MIN_INPUT_LENGTH = 3;
3 var MIN_INPUT_LENGTH = 3;
4 var URL_DELIMITER = '\n';
4 var URL_DELIMITER = '\n';
5
5
6 $('input[name=image]').wrap($('<div class="file_wrap"></div>'));
6 $('input[name=image]').wrap($('<div class="file_wrap"></div>'));
7
7
8 $('body').on('change', 'input[name=image]', function(event) {
8 $('body').on('change', 'input[name=image]', function(event) {
9 var file = event.target.files[0];
9 var file = event.target.files[0];
10
10
11 if(file.type.match('image.*')) {
11 if(file.type.match('image.*')) {
12 var fileReader = new FileReader();
12 var fileReader = new FileReader();
13
13
14 fileReader.addEventListener("load", function(event) {
14 fileReader.addEventListener("load", function(event) {
15 var wrapper = $('.file_wrap');
15 var wrapper = $('.file_wrap');
16
16
17 wrapper.find('.file-thumb').remove();
17 wrapper.find('.file-thumb').remove();
18 wrapper.append(
18 wrapper.append(
19 $('<div class="file-thumb" style="background-image: url('+event.target.result+')"></div>')
19 $('<div class="file-thumb" style="background-image: url('+event.target.result+')"></div>')
20 );
20 );
21 });
21 });
22
22
23 fileReader.readAsDataURL(file);
23 fileReader.readAsDataURL(file);
24 }
24 }
25 });
25 });
26
26
27 var form = $('#form');
27 var form = $('#form');
28 $('textarea').keypress(function(event) {
28 $('textarea').keypress(function(event) {
29 if ((event.which == 10 || event.which == 13) && event.ctrlKey) {
29 if ((event.which == 10 || event.which == 13) && event.ctrlKey) {
30 form.find('input[type=submit]').click();
30 form.find('input[type=submit]').click();
31 }
31 }
32 });
32 });
33
33
34 $('#preview-button').click(function() {
34 $('#preview-button').click(function() {
35 var data = {
35 var data = {
36 raw_text: $('textarea').val()
36 raw_text: $('textarea#id_text').val()
37 }
37 }
38
38
39 var diffUrl = '/api/preview/';
39 var diffUrl = '/api/preview/';
40
40
41 $.post(diffUrl,
41 $.post(diffUrl,
42 data,
42 data,
43 function(data) {
43 function(data) {
44 var previewTextBlock = $('#preview-text');
44 var previewTextBlock = $('#preview-text');
45 previewTextBlock.html(data);
45 previewTextBlock.html(data);
46 previewTextBlock.show();
46 previewTextBlock.show();
47
47
48 addScriptsToPost(previewTextBlock);
48 addScriptsToPost(previewTextBlock);
49 })
49 })
50 });
50 });
51
51
52 /**
52 /**
53 * Show text in the errors row of the form.
53 * Show text in the errors row of the form.
54 * @param form
54 * @param form
55 * @param text
55 * @param text
56 */
56 */
57 function showAsErrors(form, text) {
57 function showAsErrors(form, text) {
58 form.children('.form-errors').remove();
58 form.children('.form-errors').remove();
59
59
60 if (text.length > 0) {
60 if (text.length > 0) {
61 var errorList = $('<div class="form-errors">' + text + '<div>');
61 var errorList = $('<div class="form-errors">' + text + '<div>');
62 errorList.appendTo(form);
62 errorList.appendTo(form);
63 }
63 }
64 }
64 }
65
65
66 function addHiddenInput(form, name, value) {
66 function addHiddenInput(form, name, value) {
67 form.find('input[name=' + name + ']').val(value);
67 form.find('input[name=' + name + ']').val(value);
68 }
68 }
69
69
70 function selectFileChoice() {
70 function selectFileChoice() {
71 var file_input = $('#id_file');
71 var file_input = $('#id_file');
72 var url_input = $('#id_file_url');
72 var url_input = $('#id_file_url');
73
73
74 var file_input_row = file_input.parent().parent();
74 var file_input_row = file_input.parent().parent();
75 var url_input_row = url_input.parent().parent();
75 var url_input_row = url_input.parent().parent();
76
76
77 file_input_row.toggle();
77 file_input_row.toggle();
78 url_input_row.toggle();
78 url_input_row.toggle();
79 url_input.val('');
79 url_input.val('');
80 file_input.val('');
80 file_input.val('');
81
81
82 var source;
82 var source;
83 if (file_input_row.is(':visible')) {
83 if (file_input_row.is(':visible')) {
84 source = 'file';
84 source = 'file';
85 } else {
85 } else {
86 source = 'url';
86 source = 'url';
87 }
87 }
88 localStorage.setItem(ITEM_FILE_SOURCE, source);
88 localStorage.setItem(ITEM_FILE_SOURCE, source);
89 }
89 }
90
90
91 $(document).ready(function() {
91 $(document).ready(function() {
92 var powDifficulty = parseInt($('body').attr('data-pow-difficulty'));
92 var powDifficulty = parseInt($('body').attr('data-pow-difficulty'));
93 if (powDifficulty > 0 && typeof SharedWorker != 'undefined') {
93 if (powDifficulty > 0 && typeof SharedWorker != 'undefined') {
94 var worker = new SharedWorker($('.post-form').attr('data-pow-script'));
94 var worker = new SharedWorker($('.post-form').attr('data-pow-script'));
95 worker.port.onmessage = function(e) {
95 worker.port.onmessage = function(e) {
96 var form = $('#form');
96 var form = $('#form');
97 addHiddenInput(form, 'timestamp', e.data.timestamp);
97 addHiddenInput(form, 'timestamp', e.data.timestamp);
98 addHiddenInput(form, 'iteration', e.data.iteration);
98 addHiddenInput(form, 'iteration', e.data.iteration);
99 addHiddenInput(form, 'guess', e.data.guess);
99 addHiddenInput(form, 'guess', e.data.guess);
100
100
101 form.submit();
101 form.submit();
102 $('.post-form-w').unblock();
102 $('.post-form-w').unblock();
103 };
103 };
104 worker.onerror = function(event){
104 worker.onerror = function(event){
105 throw new Error(event.message + " (" + event.filename + ":" + event.lineno + ")");
105 throw new Error(event.message + " (" + event.filename + ":" + event.lineno + ")");
106 };
106 };
107 worker.port.start();
107 worker.port.start();
108
108
109 var form = $('#form');
109 var form = $('#form');
110 var submitButton = form.find('input[type=submit]');
110 var submitButton = form.find('input[type=submit]');
111 submitButton.click(function() {
111 submitButton.click(function() {
112 showAsErrors(form, gettext('Computing PoW...'));
112 showAsErrors(form, gettext('Computing PoW...'));
113 $('.post-form-w').block({ message: gettext('Computing PoW...') })
113 $('.post-form-w').block({ message: gettext('Computing PoW...') })
114
114
115 var msg = $('textarea').val().trim();
115 var msg = $('textarea#id_text').val().trim();
116
116
117 var data = {
117 var data = {
118 msg: msg,
118 msg: msg,
119 difficulty: parseInt($('body').attr('data-pow-difficulty')),
119 difficulty: parseInt($('body').attr('data-pow-difficulty')),
120 hasher: $('.post-form').attr('data-hasher')
120 hasher: $('.post-form').attr('data-hasher')
121 };
121 };
122 worker.port.postMessage(data);
122 worker.port.postMessage(data);
123
123
124 return false;
124 return false;
125 });
125 });
126 }
126 }
127
127
128 var $fileSourceButton = $('#file-source-button');
128 var $fileSourceButton = $('#file-source-button');
129 if (window.localStorage) {
129 if (window.localStorage) {
130 var source = localStorage.getItem(ITEM_FILE_SOURCE);
130 var source = localStorage.getItem(ITEM_FILE_SOURCE);
131 if (source == null) {
131 if (source == null) {
132 source = 'file';
132 source = 'file';
133 }
133 }
134 if (source == 'file') {
134 if (source == 'file') {
135 $('#id_file_url').parent().parent().hide();
135 $('#id_file_url').parent().parent().hide();
136 } else {
136 } else {
137 $('#id_file').parent().parent().hide();
137 $('#id_file').parent().parent().hide();
138 }
138 }
139
139
140 $fileSourceButton.click(function() {
140 $fileSourceButton.click(function() {
141 selectFileChoice();
141 selectFileChoice();
142 });
142 });
143 } else {
143 } else {
144 $fileSourceButton.hide();
144 $fileSourceButton.hide();
145 }
145 }
146
146
147 // Stickers autocomplete
147 // Stickers autocomplete
148 function split( val ) {
148 function split( val ) {
149 return val.split(URL_DELIMITER);
149 return val.split(URL_DELIMITER);
150 }
150 }
151
151
152 function extractLast( term ) {
152 function extractLast( term ) {
153 return split(term).pop();
153 return split(term).pop();
154 }
154 }
155
155
156 $('#id_file_1').autocomplete({
156 $('#id_file_1').autocomplete({
157 source: function( request, response ) {
157 source: function( request, response ) {
158 $.getJSON(URL_STICKERS, {
158 $.getJSON(URL_STICKERS, {
159 term: extractLast( request.term )
159 term: extractLast( request.term )
160 }, response);
160 }, response);
161 },
161 },
162 search: function() {
162 search: function() {
163 // custom minLength
163 // custom minLength
164 var term = extractLast( this.value );
164 var term = extractLast( this.value );
165 if (term.length < MIN_INPUT_LENGTH) {
165 if (term.length < MIN_INPUT_LENGTH) {
166 return false;
166 return false;
167 }
167 }
168 },
168 },
169 focus: function() {
169 focus: function() {
170 // prevent value inserted on focus
170 // prevent value inserted on focus
171 return false;
171 return false;
172 },
172 },
173 select: function( event, ui ) {
173 select: function( event, ui ) {
174 var terms = split( this.value );
174 var terms = split( this.value );
175 // remove the current input
175 // remove the current input
176 terms.pop();
176 terms.pop();
177 // add the selected item
177 // add the selected item
178 terms.push( ui.item.alias );
178 terms.push( ui.item.alias );
179 // add placeholder to get the comma-and-space at the end
179 // add placeholder to get the comma-and-space at the end
180 terms.push("");
180 terms.push("");
181 this.value = terms.join(URL_DELIMITER);
181 this.value = terms.join(URL_DELIMITER);
182 return false;
182 return false;
183 }
183 }
184 })
184 })
185 .autocomplete( "instance" )._renderItem = function( ul, item ) {
185 .autocomplete( "instance" )._renderItem = function( ul, item ) {
186 return $( "<li>" )
186 return $( "<li>" )
187 .append( "<div>" + '<img src="' + item.thumb + '">' + '<br />' + item.alias + "</div>" )
187 .append( "<div>" + '<img src="' + item.thumb + '">' + '<br />' + item.alias + "</div>" )
188 .appendTo( ul );
188 .appendTo( ul );
189 };
189 };
190 });
190 });
@@ -1,60 +1,60
1 /*
1 /*
2 @licstart The following is the entire license notice for the
2 @licstart The following is the entire license notice for the
3 JavaScript code in this page.
3 JavaScript code in this page.
4
4
5
5
6 Copyright (C) 2013 neko259
6 Copyright (C) 2013 neko259
7
7
8 The JavaScript code in this page is free software: you can
8 The JavaScript code in this page is free software: you can
9 redistribute it and/or modify it under the terms of the GNU
9 redistribute it and/or modify it under the terms of the GNU
10 General Public License (GNU GPL) as published by the Free Software
10 General Public License (GNU GPL) as published by the Free Software
11 Foundation, either version 3 of the License, or (at your option)
11 Foundation, either version 3 of the License, or (at your option)
12 any later version. The code is distributed WITHOUT ANY WARRANTY;
12 any later version. The code is distributed WITHOUT ANY WARRANTY;
13 without even the implied warranty of MERCHANTABILITY or FITNESS
13 without even the implied warranty of MERCHANTABILITY or FITNESS
14 FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
14 FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
15
15
16 As additional permission under GNU GPL version 3 section 7, you
16 As additional permission under GNU GPL version 3 section 7, you
17 may distribute non-source (e.g., minimized or compacted) forms of
17 may distribute non-source (e.g., minimized or compacted) forms of
18 that code without the copy of the GNU GPL normally required by
18 that code without the copy of the GNU GPL normally required by
19 section 4, provided you include this license notice and a URL
19 section 4, provided you include this license notice and a URL
20 through which recipients can access the Corresponding Source.
20 through which recipients can access the Corresponding Source.
21
21
22 @licend The above is the entire license notice
22 @licend The above is the entire license notice
23 for the JavaScript code in this page.
23 for the JavaScript code in this page.
24 */
24 */
25
25
26 /**
26 /**
27 * Add the desired characters to the start and end of selection.
27 * Add the desired characters to the start and end of selection.
28 *
28 *
29 * @param start Start (left) text
29 * @param start Start (left) text
30 * @param end End (right) text
30 * @param end End (right) text
31 */
31 */
32 function addMarkToMsg(start, end) {
32 function addMarkToMsg(start, end) {
33 var textareas = $('textarea');
33 var textareas = $('textarea#id_text');
34
34
35 for (var i = 0; i < textareas.length; i++) {
35 for (var i = 0; i < textareas.length; i++) {
36 var textarea = textareas[i];
36 var textarea = textareas[i];
37
37
38 if (document.selection) {
38 if (document.selection) {
39 textarea.focus();
39 textarea.focus();
40
40
41 var sel = document.selection.createRange();
41 var sel = document.selection.createRange();
42 sel.text = start + sel.text + end;
42 sel.text = start + sel.text + end;
43 } else if (textarea.selectionStart || textarea.selectionStart == '0') {
43 } else if (textarea.selectionStart || textarea.selectionStart == '0') {
44 textarea.focus();
44 textarea.focus();
45
45
46 var startPos = textarea.selectionStart;
46 var startPos = textarea.selectionStart;
47 var endPos = textarea.selectionEnd;
47 var endPos = textarea.selectionEnd;
48
48
49 var oldValue = textarea.value;
49 var oldValue = textarea.value;
50 textarea.value = oldValue.substring(0, startPos) + start +
50 textarea.value = oldValue.substring(0, startPos) + start +
51 oldValue.substring(startPos, endPos) + end +
51 oldValue.substring(startPos, endPos) + end +
52 oldValue.substring(endPos, oldValue.length);
52 oldValue.substring(endPos, oldValue.length);
53 } else {
53 } else {
54 textarea.value += start + end;
54 textarea.value += start + end;
55 }
55 }
56 }
56 }
57
57
58 return false;
58 return false;
59 }
59 }
60
60
General Comments 0
You need to be logged in to leave comments. Login now