form.js
220 lines
| 6.3 KiB
| application/javascript
|
JavascriptLexer
|
r1461 | var ITEM_FILE_SOURCE = 'fileSource'; | ||
|
r1766 | var URL_STICKERS = '/api/stickers'; | ||
|
r1702 | var MIN_INPUT_LENGTH = 3; | ||
|
r1766 | var URL_DELIMITER = '\n'; | ||
|
r1461 | |||
|
r1985 | var pastedImages = []; | ||
|
r680 | $('input[name=image]').wrap($('<div class="file_wrap"></div>')); | ||
|
r676 | |||
$('body').on('change', 'input[name=image]', function(event) { | ||||
|
r673 | var file = event.target.files[0]; | ||
if(file.type.match('image.*')) { | ||||
var fileReader = new FileReader(); | ||||
fileReader.addEventListener("load", function(event) { | ||||
|
r680 | var wrapper = $('.file_wrap'); | ||
wrapper.find('.file-thumb').remove(); | ||||
wrapper.append( | ||||
$('<div class="file-thumb" style="background-image: url('+event.target.result+')"></div>') | ||||
|
r673 | ); | ||
}); | ||||
fileReader.readAsDataURL(file); | ||||
} | ||||
|
r1005 | }); | ||
var form = $('#form'); | ||||
$('textarea').keypress(function(event) { | ||||
r1577 | if ((event.which == 10 || event.which == 13) && event.ctrlKey) { | |||
|
r1428 | form.find('input[type=submit]').click(); | ||
|
r1005 | } | ||
|
r1217 | }); | ||
$('#preview-button').click(function() { | ||||
var data = { | ||||
|
r1768 | raw_text: $('textarea#id_text').val() | ||
|
r1217 | } | ||
var diffUrl = '/api/preview/'; | ||||
$.post(diffUrl, | ||||
data, | ||||
function(data) { | ||||
var previewTextBlock = $('#preview-text'); | ||||
previewTextBlock.html(data); | ||||
previewTextBlock.show(); | ||||
|
r1717 | |||
addScriptsToPost(previewTextBlock); | ||||
|
r1217 | }) | ||
|
r1428 | }); | ||
/** | ||||
* Show text in the errors row of the form. | ||||
* @param form | ||||
* @param text | ||||
*/ | ||||
function showAsErrors(form, text) { | ||||
form.children('.form-errors').remove(); | ||||
if (text.length > 0) { | ||||
var errorList = $('<div class="form-errors">' + text + '<div>'); | ||||
errorList.appendTo(form); | ||||
} | ||||
} | ||||
function addHiddenInput(form, name, value) { | ||||
form.find('input[name=' + name + ']').val(value); | ||||
} | ||||
|
r1461 | function selectFileChoice() { | ||
var file_input = $('#id_file'); | ||||
var url_input = $('#id_file_url'); | ||||
var file_input_row = file_input.parent().parent(); | ||||
var url_input_row = url_input.parent().parent(); | ||||
file_input_row.toggle(); | ||||
url_input_row.toggle(); | ||||
url_input.val(''); | ||||
file_input.val(''); | ||||
var source; | ||||
if (file_input_row.is(':visible')) { | ||||
source = 'file'; | ||||
} else { | ||||
source = 'url'; | ||||
} | ||||
localStorage.setItem(ITEM_FILE_SOURCE, source); | ||||
} | ||||
|
r1769 | function getPostTextarea() { | ||
return $('textarea#id_text'); | ||||
} | ||||
|
r1985 | function addOnImagePaste() { | ||
$('#id_file_1').on('paste', function(event) { | ||||
var items = (event.clipboardData || event.originalEvent.clipboardData).items; | ||||
for (index in items) { | ||||
var item = items[index]; | ||||
if (item.kind === 'file') { | ||||
var blob = item.getAsFile(); | ||||
pastedImages.push(blob); | ||||
var pastedImagesList = $('#pasted-images'); | ||||
if (pastedImagesList.length === 0) { | ||||
pastedImagesList = $('<div id="pasted-images" />'); | ||||
$('#id_file_1').parent().append(pastedImagesList); | ||||
} | ||||
pastedImagesList.text(gettext('Images posted: ') + pastedImages.length); | ||||
} | ||||
} | ||||
}); | ||||
} | ||||
|
r1428 | $(document).ready(function() { | ||
var powDifficulty = parseInt($('body').attr('data-pow-difficulty')); | ||||
|
r1465 | if (powDifficulty > 0 && typeof SharedWorker != 'undefined') { | ||
|
r1468 | var worker = new SharedWorker($('.post-form').attr('data-pow-script')); | ||
|
r1462 | worker.port.onmessage = function(e) { | ||
|
r1428 | var form = $('#form'); | ||
addHiddenInput(form, 'timestamp', e.data.timestamp); | ||||
addHiddenInput(form, 'iteration', e.data.iteration); | ||||
addHiddenInput(form, 'guess', e.data.guess); | ||||
form.submit(); | ||||
|
r1451 | $('.post-form-w').unblock(); | ||
|
r1428 | }; | ||
|
r1466 | worker.onerror = function(event){ | ||
throw new Error(event.message + " (" + event.filename + ":" + event.lineno + ")"); | ||||
|
r1464 | }; | ||
|
r1462 | worker.port.start(); | ||
|
r1428 | |||
var form = $('#form'); | ||||
var submitButton = form.find('input[type=submit]'); | ||||
submitButton.click(function() { | ||||
showAsErrors(form, gettext('Computing PoW...')); | ||||
|
r1451 | $('.post-form-w').block({ message: gettext('Computing PoW...') }) | ||
|
r1428 | |||
|
r1768 | var msg = $('textarea#id_text').val().trim(); | ||
|
r1428 | |||
var data = { | ||||
msg: msg, | ||||
difficulty: parseInt($('body').attr('data-pow-difficulty')), | ||||
|
r1468 | hasher: $('.post-form').attr('data-hasher') | ||
|
r1428 | }; | ||
|
r1462 | worker.port.postMessage(data); | ||
|
r1428 | |||
return false; | ||||
}); | ||||
} | ||||
|
r1461 | |||
r1639 | var $fileSourceButton = $('#file-source-button'); | |||
if (window.localStorage) { | ||||
var source = localStorage.getItem(ITEM_FILE_SOURCE); | ||||
if (source == null) { | ||||
source = 'file'; | ||||
} | ||||
if (source == 'file') { | ||||
$('#id_file_url').parent().parent().hide(); | ||||
} else { | ||||
$('#id_file').parent().parent().hide(); | ||||
} | ||||
$fileSourceButton.click(function() { | ||||
selectFileChoice(); | ||||
}); | ||||
|
r1461 | } else { | ||
r1639 | $fileSourceButton.hide(); | |||
|
r1461 | } | ||
|
r1702 | |||
|
r1985 | addOnImagePaste(); | ||
|
r1766 | // Stickers autocomplete | ||
function split( val ) { | ||||
return val.split(URL_DELIMITER); | ||||
} | ||||
function extractLast( term ) { | ||||
return split(term).pop(); | ||||
} | ||||
$('#id_file_1').autocomplete({ | ||||
|
r1702 | source: function( request, response ) { | ||
$.getJSON(URL_STICKERS, { | ||||
|
r1766 | term: extractLast( request.term ) | ||
|
r1702 | }, response); | ||
}, | ||||
search: function() { | ||||
// custom minLength | ||||
|
r1766 | var term = extractLast( this.value ); | ||
|
r1702 | if (term.length < MIN_INPUT_LENGTH) { | ||
return false; | ||||
} | ||||
}, | ||||
focus: function() { | ||||
// prevent value inserted on focus | ||||
return false; | ||||
}, | ||||
select: function( event, ui ) { | ||||
|
r1766 | var terms = split( this.value ); | ||
// remove the current input | ||||
terms.pop(); | ||||
// add the selected item | ||||
terms.push( ui.item.alias ); | ||||
// add placeholder to get the comma-and-space at the end | ||||
terms.push(""); | ||||
this.value = terms.join(URL_DELIMITER); | ||||
|
r1702 | return false; | ||
} | ||||
}) | ||||
.autocomplete( "instance" )._renderItem = function( ul, item ) { | ||||
return $( "<li>" ) | ||||
.append( "<div>" + '<img src="' + item.thumb + '">' + '<br />' + item.alias + "</div>" ) | ||||
.appendTo( ul ); | ||||
}; | ||||
|
r1428 | }); | ||