Notice form cleanup: removing hardcoded IDs from attachment handling (prep for reusable notice forms)

This commit is contained in:
Brion Vibber 2011-03-03 16:56:54 -08:00
parent 77a3017e9e
commit 1ff17f0ed9
14 changed files with 46 additions and 50 deletions

View File

@ -53,8 +53,6 @@ var SN = { // StatusNet
NoticeDataText: 'notice_data-text', NoticeDataText: 'notice_data-text',
NoticeTextCount: 'notice_text-count', NoticeTextCount: 'notice_text-count',
NoticeInReplyTo: 'notice_in-reply-to', NoticeInReplyTo: 'notice_in-reply-to',
NoticeDataAttach: 'notice_data-attach',
NoticeDataAttachSelected: 'notice_data-attach_selected',
NoticeActionSubmit: 'notice_action-submit', NoticeActionSubmit: 'notice_action-submit',
NoticeLat: 'notice_data-lat', NoticeLat: 'notice_data-lat',
NoticeLon: 'notice_data-lon', NoticeLon: 'notice_data-lon',
@ -368,7 +366,7 @@ var SN = { // StatusNet
if (parseInt(xhr.status) === 0 || jQuery.inArray(parseInt(xhr.status), SN.C.I.HTTP20x30x) >= 0) { if (parseInt(xhr.status) === 0 || jQuery.inArray(parseInt(xhr.status), SN.C.I.HTTP20x30x) >= 0) {
form form
.resetForm() .resetForm()
.find('#'+SN.C.S.NoticeDataAttachSelected).remove(); .find('.attach-status').remove();
SN.U.FormNoticeEnhancements(form); SN.U.FormNoticeEnhancements(form);
} }
else { else {
@ -425,8 +423,8 @@ var SN = { // StatusNet
} }
} }
form.resetForm(); form.resetForm();
form.find('#'+SN.C.S.NoticeInReplyTo).val(''); form.find('[name=inreplyto]').val('');
form.find('#'+SN.C.S.NoticeDataAttachSelected).remove(); form.find('.attach-status').remove();
SN.U.FormNoticeEnhancements(form); SN.U.FormNoticeEnhancements(form);
} }
}, },
@ -850,36 +848,34 @@ var SN = { // StatusNet
* *
* This preview box will also allow removing the attachment * This preview box will also allow removing the attachment
* prior to posting. * prior to posting.
*
* @param {jQuery} form
*/ */
NoticeDataAttach: function() { NoticeDataAttach: function(form) {
NDA = $('#'+SN.C.S.NoticeDataAttach); var NDA = form.find('input[type=file]');
NDA.change(function(event) { NDA.change(function(event) {
form.find('.attach-status').remove();
var filename = $(this).val(); var filename = $(this).val();
if (!filename) { if (!filename) {
// No file -- we've been tricked! // No file -- we've been tricked!
$('#'+SN.C.S.NoticeDataAttachSelected).remove();
return false; return false;
} }
// @fixme appending filename straight in is potentially unsafe var attachStatus = $('<div class="attach-status '+SN.C.S.Success+'"><code></code> <button class="close">&#215;</button></div>');
S = '<div id="'+SN.C.S.NoticeDataAttachSelected+'" class="'+SN.C.S.Success+'"><code>'+filename+'</code> <button class="close">&#215;</button></div>'; attachStatus.find('code').text(filename);
NDAS = $('#'+SN.C.S.NoticeDataAttachSelected); attachStatus.find('button').click(function(){
if (NDAS.length > 0) { attachStatus.remove();
NDAS.replaceWith(S);
}
else {
$('#'+SN.C.S.FormNotice).append(S);
}
$('#'+SN.C.S.NoticeDataAttachSelected+' button').click(function(){
$('#'+SN.C.S.NoticeDataAttachSelected).remove();
NDA.val(''); NDA.val('');
return false; return false;
}); });
form.append(attachStatus);
if (typeof this.files == "object") { if (typeof this.files == "object") {
// Some newer browsers will let us fetch the files for preview. // Some newer browsers will let us fetch the files for preview.
for (var i = 0; i < this.files.length; i++) { for (var i = 0; i < this.files.length; i++) {
SN.U.PreviewAttach(this.files[i]); SN.U.PreviewAttach(form, this.files[i]);
} }
} }
}); });
@ -915,13 +911,14 @@ var SN = { // StatusNet
* Known fail: * Known fail:
* - Opera 10.63, 11 beta (no input.files interface) * - Opera 10.63, 11 beta (no input.files interface)
* *
* @param {jQuery} form
* @param {File} file * @param {File} file
* *
* @todo use configured thumbnail size * @todo use configured thumbnail size
* @todo detect pixel size? * @todo detect pixel size?
* @todo should we render a thumbnail to a canvas and then use the smaller image? * @todo should we render a thumbnail to a canvas and then use the smaller image?
*/ */
PreviewAttach: function(file) { PreviewAttach: function(form, file) {
var tooltip = file.type + ' ' + Math.round(file.size / 1024) + 'KB'; var tooltip = file.type + ' ' + Math.round(file.size / 1024) + 'KB';
var preview = true; var preview = true;
@ -981,11 +978,11 @@ var SN = { // StatusNet
.attr('alt', tooltip) .attr('alt', tooltip)
.attr('src', url) .attr('src', url)
.attr('style', 'height: 120px'); .attr('style', 'height: 120px');
$('#'+SN.C.S.NoticeDataAttachSelected).append(img); form.find('.attach-status').append(img);
}); });
} else { } else {
var img = $('<div></div>').text(tooltip); var img = $('<div></div>').text(tooltip);
$('#'+SN.C.S.NoticeDataAttachSelected).append(img); form.find('.attach-status').append(img);
} }
}, },
@ -1365,9 +1362,8 @@ var SN = { // StatusNet
$('.'+SN.C.S.FormNotice).each(function() { $('.'+SN.C.S.FormNotice).each(function() {
SN.U.FormNoticeXHR($(this)); SN.U.FormNoticeXHR($(this));
SN.U.FormNoticeEnhancements($(this)); SN.U.FormNoticeEnhancements($(this));
SN.U.NoticeDataAttach($(this));
}); });
SN.U.NoticeDataAttach();
} }
}, },

2
js/util.min.js vendored

File diff suppressed because one or more lines are too long

View File

@ -651,7 +651,7 @@ width:81.5%;
margin-bottom:0; margin-bottom:0;
line-height:1.618; line-height:1.618;
} }
.form_notice #notice_data-attach_selected code { .form_notice .attach-status code {
float:left; float:left;
width:80%; width:80%;
display:block; display:block;
@ -659,7 +659,7 @@ overflow:auto;
margin-right:2.5%; margin-right:2.5%;
font-size:1.1em; font-size:1.1em;
} }
.form_notice #notice_data-attach_selected button.close { .form_notice .attach-status button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;
} }

View File

@ -26,11 +26,11 @@ display:block;
width:17%; width:17%;
max-width:17%; max-width:17%;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }

View File

@ -519,7 +519,7 @@ margin-bottom:0;
line-height:1.618; line-height:1.618;
} }
.form_notice #notice_data-attach_selected button.close { .form_notice .attach-status button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;
} }

View File

@ -22,11 +22,11 @@ display:block;
width: 96px; width: 96px;
max-width: 96px; max-width: 96px;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }

View File

@ -22,11 +22,11 @@ display:block;
width: 106px; width: 106px;
max-width: 106px; max-width: 106px;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }

View File

@ -549,7 +549,7 @@ width:81.5%;
margin-bottom:0; margin-bottom:0;
line-height:1.618; line-height:1.618;
} }
.form_notice #notice_data-attach_selected code, .form_notice .attach-status code,
.form_notice #notice_data-geo_name { .form_notice #notice_data-geo_name {
float:left; float:left;
width:80%; width:80%;
@ -557,10 +557,10 @@ display:block;
overflow:auto; overflow:auto;
margin-right:2.5%; margin-right:2.5%;
} }
.form_notice #notice_data-attach_selected code { .form_notice .attach-status code {
font-size:1.1em; font-size:1.1em;
} }
.form_notice #notice_data-attach_selected button.close, .form_notice .attach-status button.close,
.form_notice #notice_data-geo_selected button.close { .form_notice #notice_data-geo_selected button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;

View File

@ -992,7 +992,7 @@ width:81.5%;
margin-bottom:0; margin-bottom:0;
line-height:1.618; line-height:1.618;
} }
.form_notice #notice_data-attach_selected code { .form_notice .attach-status code {
float:left; float:left;
width:80%; width:80%;
display:block; display:block;
@ -1000,7 +1000,7 @@ overflow:auto;
margin-right:2.5%; margin-right:2.5%;
font-size:1.1em; font-size:1.1em;
} }
.form_notice #notice_data-attach_selected button.close { .form_notice .attach-status button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;
} }

View File

@ -33,11 +33,11 @@ display:block;
width:17%; width:17%;
max-width:17%; max-width:17%;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }

View File

@ -506,7 +506,7 @@ width:81.5%;
margin-bottom:0; margin-bottom:0;
line-height:1.618; line-height:1.618;
} }
.form_notice #notice_data-attach_selected code { .form_notice .attach-status code {
float:left; float:left;
width:80%; width:80%;
display:block; display:block;
@ -514,7 +514,7 @@ overflow:auto;
margin-right:2.5%; margin-right:2.5%;
font-size:1.1em; font-size:1.1em;
} }
.form_notice #notice_data-attach_selected button.close { .form_notice .attach-status button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;
} }

View File

@ -302,7 +302,7 @@ address .poweredby {
margin-left: -2px; margin-left: -2px;
} }
.form_notice #notice_data-attach_selected code { .form_notice .attach-status code {
font-size: 1.2em; font-size: 1.2em;
} }
@ -312,7 +312,7 @@ address .poweredby {
padding: 6px 2px 6px 5px; padding: 6px 2px 6px 5px;
} }
.form_notice #notice_data-attach_selected button.close { .form_notice .attach-status button.close {
float:right; float:right;
font-size:0.8em; font-size:0.8em;
} }

View File

@ -21,11 +21,11 @@ display:block;
width: 106px; width: 106px;
max-width: 106px; max-width: 106px;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }

View File

@ -23,11 +23,11 @@ display:block;
width: 96px; width: 96px;
max-width: 96px; max-width: 96px;
} }
.form_notice #notice_data-attach_selected, .form_notice .attach-status,
.form_notice #notice_data-geo_selected { .form_notice #notice_data-geo_selected {
width:78.75%; width:78.75%;
} }
.form_notice #notice_data-attach_selected button, .form_notice .attach-status button,
.form_notice #notice_data-geo_selected button { .form_notice #notice_data-geo_selected button {
padding:0 4px; padding:0 4px;
} }