From af700ea27703bbec5aa1078a84f9fd44c0260322 Mon Sep 17 00:00:00 2001 From: Robin Millette Date: Tue, 26 May 2009 21:20:04 -0400 Subject: Let's you upload a file with a notice and have it shown with other attachments. --- js/jquery.form.js | 4 ++-- js/util.js | 12 ++++++++++++ 2 files changed, 14 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/jquery.form.js b/js/jquery.form.js index cb8b5a660..936b847ab 100644 --- a/js/jquery.form.js +++ b/js/jquery.form.js @@ -157,7 +157,7 @@ $.fn.ajaxSubmit = function(options) { function fileUpload() { var form = $form[0]; - if ($(':input[@name=submit]', form).length) { + if ($(':input[name=submit]', form).length) { alert('Error: Form elements must not be named "submit".'); return; } @@ -570,7 +570,7 @@ $.fn.clearForm = function() { $.fn.clearFields = $.fn.clearInputs = function() { return this.each(function() { var t = this.type, tag = this.tagName.toLowerCase(); - if (t == 'text' || t == 'password' || tag == 'textarea') + if (t == 'file' || t == 'text' || t == 'password' || tag == 'textarea') this.value = ''; else if (t == 'checkbox' || t == 'radio') this.checked = false; diff --git a/js/util.js b/js/util.js index b1b6ec82b..85ab48b4c 100644 --- a/js/util.js +++ b/js/util.js @@ -17,6 +17,17 @@ */ $(document).ready(function(){ + $('input#notice_data-attach').toggle(); + $('label[for=notice_data-attach]').text('Upload a file as an attachment?'); + $('label[for=notice_data-attach]').click(function () { + if ('Upload a file as an attachment?' == $(this).text()) { + $(this).text('Upload: '); + $('input#notice_data-attach').slideDown('fast'); + } else { + $('input#notice_data-attach').slideUp('fast', function() {$('label[for=notice_data-attach]').text('Upload a file as an attachment?');}); + } + }); + $('a.attachment').click(function() {$().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); $("a.thumbnail").hover( function() { @@ -227,6 +238,7 @@ $(document).ready(function(){ } } $("#notice_data-text").val(""); + $("#notice_data-attach").val(""); counter(); } $("#form_notice").removeClass("processing"); -- cgit v1.2.3-54-g00ecf From 60ac9bc6fda74278d98890a2c26f3834acad8222 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Wed, 27 May 2009 19:43:43 +0000 Subject: Bunch of UI fixes/improvements for attachments (hover, overlay, notice view, clip) --- js/util.js | 72 ++++++++++++++-------- lib/attachmentlist.php | 6 +- theme/base/css/display.css | 67 +++++++++++++++----- theme/base/images/icons/twotone/green/clip-02.gif | Bin 0 -> 70 bytes theme/default/css/display.css | 6 ++ theme/identica/css/display.css | 6 ++ 6 files changed, 116 insertions(+), 41 deletions(-) create mode 100644 theme/base/images/icons/twotone/green/clip-02.gif (limited to 'js') diff --git a/js/util.js b/js/util.js index b1b6ec82b..08cc1d370 100644 --- a/js/util.js +++ b/js/util.js @@ -17,30 +17,6 @@ */ $(document).ready(function(){ - $('a.attachment').click(function() {$().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); - $("a.thumbnail").hover( - function() { - var anchor = $(this); - $("a.thumbnail").children('img').remove(); - - setTimeout(function() { - anchor.closest(".entry-title").addClass('ov'); - $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { - anchor.append(data); - }); - }, 250); - - setTimeout(function() { - anchor.children('img').remove(); - anchor.closest(".entry-title").removeClass('ov'); - }, 3000); - }, - function() { - $(this).children('img').remove(); - $(this).closest(".entry-title").removeClass('ov'); - } - ); - // count character on keyup function counter(event){ var maxLength = 140; @@ -238,6 +214,7 @@ $(document).ready(function(){ $("#form_notice").each(addAjaxHidden); NoticeHover(); NoticeReply(); + NoticeAttachments(); }); @@ -276,3 +253,50 @@ function NoticeReplySet(nick,id) { } return true; } + +function NoticeAttachments() { + $.fn.jOverlay.options = { + method : 'GET', + data : '', + url : '', + color : '#000', + opacity : '0.6', + zIndex : 9999, + center : true, + imgLoading : $('address .url')[0].href+'theme/base/images/illustrations/illu_progress_loading-01.gif', + bgClickToClose : true, + success : function() { + $('#jOverlayContent').append(''); + $('#jOverlayContent button').click($.closeOverlay); + }, + timeout : 0 + }; + + $('a.attachment').click(function() { + $().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); + return false; + }); + $("body:not(#shownotice) a.thumbnail").hover( + function() { + var anchor = $(this); + $("a.thumbnail").children('img').remove(); + anchor.closest(".entry-title").addClass('ov'); + + setTimeout(function() { + $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { + anchor.append(data); + }); + }, 500); + + setTimeout(function() { + anchor.children('img').remove(); + anchor.closest(".entry-title").removeClass('ov'); + }, 3000); + }, + function() { + $("a.thumbnail").children('img').remove(); + $(this).closest(".entry-title").removeClass('ov'); + } + ); +} + diff --git a/lib/attachmentlist.php b/lib/attachmentlist.php index d0478bad3..559962acc 100644 --- a/lib/attachmentlist.php +++ b/lib/attachmentlist.php @@ -80,10 +80,10 @@ class AttachmentList extends Widget function show() { - $this->out->elementStart('dl', array('id' =>'attachment')); + $this->out->elementStart('dl', array('id' =>'attachments')); $this->out->element('dt', null, _('Attachments')); $this->out->elementStart('dd'); - $this->out->elementStart('ul', array('class' => 'attachments')); + $this->out->elementStart('ol', array('class' => 'attachments')); $atts = new File; $att = $atts->getAttachments($this->notice->id); @@ -93,7 +93,7 @@ class AttachmentList extends Widget } $this->out->elementEnd('dd'); - $this->out->elementEnd('ul'); + $this->out->elementEnd('ol'); $this->out->elementEnd('dl'); return count($att); diff --git a/theme/base/css/display.css b/theme/base/css/display.css index 9bc1417b1..16c9e3c00 100644 --- a/theme/base/css/display.css +++ b/theme/base/css/display.css @@ -855,20 +855,6 @@ display:inline-block; text-transform:lowercase; } -.notice .attachment { -position:relative; -} -.notice .attachment img { -position:absolute; -top:18px; -left:0; -z-index:99; -} -#shownotice .notice .attachment img { -position:static; -} - - .notice-options { position:relative; font-size:0.95em; @@ -936,6 +922,59 @@ padding:0; } +.notice .attachment { +position:relative; +padding-left:16px; +} +#attachments .attachment { +padding-left:0; +} +.notice .attachment img { +position:absolute; +top:18px; +left:0; +z-index:99; +} +#shownotice .notice .attachment img { +position:static; +} + +#attachments { +clear:both; +float:left; +width:100%; +margin-top:18px; +} +#attachments dt { +font-weight:bold; +font-size:1.3em; +margin-bottom:4px; +} + +#attachments li { +margin-bottom:18px; +list-style-type:decimal; +float:left; +clear:both; +} + +#jOverlayContent, +#jOverlayContent #content { +width: auto !important; +} +#jOverlayContent .external span { +display:block; +margin-bottom:11px; +} +#jOverlayContent button { +position:absolute; +top:0; +right:0; +padding:3px 4px; +font-weight:bold; +} + + #usergroups #new_group { float: left; margin-right: 2em; diff --git a/theme/base/images/icons/twotone/green/clip-02.gif b/theme/base/images/icons/twotone/green/clip-02.gif new file mode 100644 index 000000000..77a729799 Binary files /dev/null and b/theme/base/images/icons/twotone/green/clip-02.gif differ diff --git a/theme/default/css/display.css b/theme/default/css/display.css index 737db7ce9..e08a4783b 100644 --- a/theme/default/css/display.css +++ b/theme/default/css/display.css @@ -175,6 +175,12 @@ background-image:url(../../base/images/icons/twotone/green/shield.gif); } /* NOTICES */ +.notice .attachment { +background:transparent url(../../base/images/icons/twotone/green/clip-02.gif) no-repeat 0 45%; +} +#attachments .attachment { +background:none; +} .notice-options .notice_reply a, .notice-options form input.submit { background-color:transparent; diff --git a/theme/identica/css/display.css b/theme/identica/css/display.css index f7abac482..1f1298737 100644 --- a/theme/identica/css/display.css +++ b/theme/identica/css/display.css @@ -175,6 +175,12 @@ background-image:url(../../base/images/icons/twotone/green/shield.gif); } /* NOTICES */ +.notice .attachment { +background:transparent url(../../base/images/icons/twotone/green/clip-02.gif) no-repeat 0 45%; +} +#attachments .attachment { +background:none; +} .notice-options .notice_reply a, .notice-options form input.submit { background-color:transparent; -- cgit v1.2.3-54-g00ecf From f0dc97e4da16181b0d6a74361734678d0f37fd5e Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Thu, 28 May 2009 22:59:22 +0000 Subject: Smarter call for hover events. It now makes a new GET for attachment thumbnails on mouseover only if it hasn't been requested before on that notice attachment. --- js/util.js | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) (limited to 'js') diff --git a/js/util.js b/js/util.js index 08cc1d370..6cfad3a8e 100644 --- a/js/util.js +++ b/js/util.js @@ -261,7 +261,7 @@ function NoticeAttachments() { url : '', color : '#000', opacity : '0.6', - zIndex : 9999, + zIndex : '9999', center : true, imgLoading : $('address .url')[0].href+'theme/base/images/illustrations/illu_progress_loading-01.gif', bgClickToClose : true, @@ -279,22 +279,22 @@ function NoticeAttachments() { $("body:not(#shownotice) a.thumbnail").hover( function() { var anchor = $(this); - $("a.thumbnail").children('img').remove(); + $("a.thumbnail").children('img').hide(); anchor.closest(".entry-title").addClass('ov'); - setTimeout(function() { - $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { - anchor.append(data); - }); - }, 500); - - setTimeout(function() { - anchor.children('img').remove(); - anchor.closest(".entry-title").removeClass('ov'); - }, 3000); + if (anchor.children('img').length == 0) { + setTimeout(function() { + $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { + anchor.append(data); + }); + }, 500); + } + else { + anchor.children('img').show(); + } }, function() { - $("a.thumbnail").children('img').remove(); + $("a.thumbnail").children('img').hide(); $(this).closest(".entry-title").removeClass('ov'); } ); -- cgit v1.2.3-54-g00ecf From 6612993c1d59051bbb4dafed73e0111eec8ccfd6 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Thu, 28 May 2009 23:16:25 +0000 Subject: Prevents regular hovers over attachment anchors from making a GET request for the thumbnail. There is 500 ms delay while on mouseover state before going ahead with the request. Fun. --- js/util.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'js') diff --git a/js/util.js b/js/util.js index 6cfad3a8e..d5697e880 100644 --- a/js/util.js +++ b/js/util.js @@ -276,6 +276,8 @@ function NoticeAttachments() { $().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); + + var t; $("body:not(#shownotice) a.thumbnail").hover( function() { var anchor = $(this); @@ -283,7 +285,7 @@ function NoticeAttachments() { anchor.closest(".entry-title").addClass('ov'); if (anchor.children('img').length == 0) { - setTimeout(function() { + t = setTimeout(function() { $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { anchor.append(data); }); @@ -294,6 +296,7 @@ function NoticeAttachments() { } }, function() { + clearTimeout(t); $("a.thumbnail").children('img').hide(); $(this).closest(".entry-title").removeClass('ov'); } -- cgit v1.2.3-54-g00ecf From f56f2f52e74ec3d0037bc33f9bbcee170e982d49 Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Sat, 30 May 2009 19:42:15 +0000 Subject: Some cross-browser updates for conversation UI --- js/util.js | 2 +- theme/base/css/display.css | 12 ++++++++++-- theme/base/css/ie.css | 6 ++++++ 3 files changed, 17 insertions(+), 3 deletions(-) (limited to 'js') diff --git a/js/util.js b/js/util.js index d5697e880..c710ae839 100644 --- a/js/util.js +++ b/js/util.js @@ -261,7 +261,7 @@ function NoticeAttachments() { url : '', color : '#000', opacity : '0.6', - zIndex : '9999', + zIndex : 99, center : true, imgLoading : $('address .url')[0].href+'theme/base/images/illustrations/illu_progress_loading-01.gif', bgClickToClose : true, diff --git a/theme/base/css/display.css b/theme/base/css/display.css index e3c499a5e..5ad4217cd 100644 --- a/theme/base/css/display.css +++ b/theme/base/css/display.css @@ -951,7 +951,7 @@ font-size:1.3em; margin-bottom:4px; } -#attachments li { +#attachments ol li { margin-bottom:18px; list-style-type:decimal; float:left; @@ -962,6 +962,11 @@ clear:both; #jOverlayContent #content, #jOverlayContent #content_inner { width: auto !important; +margin-bottom:0; +} +#jOverlayContent #content { +padding:11px; +min-height:auto; } #jOverlayContent .external span { display:block; @@ -971,8 +976,11 @@ margin-bottom:11px; position:absolute; top:0; right:0; -padding:3px 4px; +width:29px; +height:29px; +text-align:center; font-weight:bold; +padding:0; } #jOverlayContent h1 { max-width:475px; diff --git a/theme/base/css/ie.css b/theme/base/css/ie.css index 5d8bea8ae..df0388a5a 100644 --- a/theme/base/css/ie.css +++ b/theme/base/css/ie.css @@ -30,3 +30,9 @@ margin-right:4px; .entity_profile { width:64%; } +#jOverlayContent .notice * { +z-index:1; +} +#jOverlayContent .notice .attachment img { +z-index:9999; +} -- cgit v1.2.3-54-g00ecf From a39fa0ce2bceadbfec8c1ddb8d1148edeb84634d Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Mon, 1 Jun 2009 15:20:12 -0400 Subject: Unnecessary JavaScript for notice form attachment --- js/util.js | 11 ----------- 1 file changed, 11 deletions(-) (limited to 'js') diff --git a/js/util.js b/js/util.js index acf44a17c..20f17f6e7 100644 --- a/js/util.js +++ b/js/util.js @@ -17,17 +17,6 @@ */ $(document).ready(function(){ - $('input#notice_data-attach').toggle(); - $('label[for=notice_data-attach]').text('Upload a file as an attachment?'); - $('label[for=notice_data-attach]').click(function () { - if ('Upload a file as an attachment?' == $(this).text()) { - $(this).text('Upload: '); - $('input#notice_data-attach').slideDown('fast'); - } else { - $('input#notice_data-attach').slideUp('fast', function() {$('label[for=notice_data-attach]').text('Upload a file as an attachment?');}); - } - }); - $('a.attachment').click(function() {$().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); $("a.thumbnail").hover( function() { -- cgit v1.2.3-54-g00ecf From 0cbd72e0927cbe9b605e34d7bbd86d2046ea0c49 Mon Sep 17 00:00:00 2001 From: Robin Millette Date: Mon, 1 Jun 2009 15:52:52 -0400 Subject: Re-added some javascript to toggle upload field. --- js/util.js | 11 +++++++++++ lib/noticeform.php | 1 + 2 files changed, 12 insertions(+) (limited to 'js') diff --git a/js/util.js b/js/util.js index 20f17f6e7..acf44a17c 100644 --- a/js/util.js +++ b/js/util.js @@ -17,6 +17,17 @@ */ $(document).ready(function(){ + $('input#notice_data-attach').toggle(); + $('label[for=notice_data-attach]').text('Upload a file as an attachment?'); + $('label[for=notice_data-attach]').click(function () { + if ('Upload a file as an attachment?' == $(this).text()) { + $(this).text('Upload: '); + $('input#notice_data-attach').slideDown('fast'); + } else { + $('input#notice_data-attach').slideUp('fast', function() {$('label[for=notice_data-attach]').text('Upload a file as an attachment?');}); + } + }); + $('a.attachment').click(function() {$().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); $("a.thumbnail").hover( function() { diff --git a/lib/noticeform.php b/lib/noticeform.php index 5a6c7cf38..805cd56b1 100644 --- a/lib/noticeform.php +++ b/lib/noticeform.php @@ -148,6 +148,7 @@ class NoticeForm extends Form $this->out->element('dd', array('id' => 'notice_text-count'), '140'); $this->out->elementEnd('dl'); + $this->out->element('br', array('style' => 'clear:both')); $this->out->element('label', array('for' => 'notice_data-attach'), _('Attach')); $this->out->element('input', array('id' => 'notice_data-attach', 'type' => 'file', -- cgit v1.2.3-54-g00ecf From fe38827a76520e4a910f9e988b11d0914872d44e Mon Sep 17 00:00:00 2001 From: Robin Millette Date: Mon, 1 Jun 2009 17:40:53 -0400 Subject: Remove js that crept back in, added another error string. --- actions/newnotice.php | 2 ++ js/util.js | 24 ------------------------ lib/attachmentlist.php | 2 +- 3 files changed, 3 insertions(+), 25 deletions(-) (limited to 'js') diff --git a/actions/newnotice.php b/actions/newnotice.php index 3e6ff1518..02976a2ae 100644 --- a/actions/newnotice.php +++ b/actions/newnotice.php @@ -279,6 +279,8 @@ class NewnoticeAction extends Action } else { $this->clientError(_('There was a database error while saving your file. Please try again.')); } + } else { + $this->clientError(_('File could not be moved to destination directory.')); } } diff --git a/js/util.js b/js/util.js index acf44a17c..bffbf916f 100644 --- a/js/util.js +++ b/js/util.js @@ -28,30 +28,6 @@ $(document).ready(function(){ } }); - $('a.attachment').click(function() {$().jOverlay({url: $('address .url')[0].href+'/attachment/' + ($(this).attr('id').substring('attachment'.length + 1)) + '/ajax'}); return false; }); - $("a.thumbnail").hover( - function() { - var anchor = $(this); - $("a.thumbnail").children('img').remove(); - - setTimeout(function() { - anchor.closest(".entry-title").addClass('ov'); - $.get($('address .url')[0].href+'/attachment/' + (anchor.attr('id').substring('attachment'.length + 1)) + '/thumbnail', null, function(data) { - anchor.append(data); - }); - }, 250); - - setTimeout(function() { - anchor.children('img').remove(); - anchor.closest(".entry-title").removeClass('ov'); - }, 3000); - }, - function() { - $(this).children('img').remove(); - $(this).closest(".entry-title").removeClass('ov'); - } - ); - // count character on keyup function counter(event){ var maxLength = 140; diff --git a/lib/attachmentlist.php b/lib/attachmentlist.php index 898be1bb0..45e4fa319 100644 --- a/lib/attachmentlist.php +++ b/lib/attachmentlist.php @@ -83,7 +83,7 @@ class AttachmentList extends Widget $atts = new File; $att = $atts->getAttachments($this->notice->id); if (empty($att)) return 0; - $this->out->elementStart('dl', array('id' =>'attachment')); + $this->out->elementStart('dl', array('id' =>'attachments')); $this->out->element('dt', null, _('Attachments')); $this->out->elementStart('dd'); $this->out->elementStart('ol', array('class' => 'attachments')); -- cgit v1.2.3-54-g00ecf From b708b81065b4adc46026e570d8e2cb9d37bc24af Mon Sep 17 00:00:00 2001 From: Sarven Capadisli Date: Fri, 5 Jun 2009 00:00:04 -0400 Subject: Init notice_data-attach UI for form_notice --- js/util.js | 11 ----------- lib/noticeform.php | 1 - theme/base/css/display.css | 16 ++++++++++++++++ theme/identica/css/display.css | 7 +++++++ 4 files changed, 23 insertions(+), 12 deletions(-) (limited to 'js') diff --git a/js/util.js b/js/util.js index bffbf916f..b712ba8e2 100644 --- a/js/util.js +++ b/js/util.js @@ -17,17 +17,6 @@ */ $(document).ready(function(){ - $('input#notice_data-attach').toggle(); - $('label[for=notice_data-attach]').text('Upload a file as an attachment?'); - $('label[for=notice_data-attach]').click(function () { - if ('Upload a file as an attachment?' == $(this).text()) { - $(this).text('Upload: '); - $('input#notice_data-attach').slideDown('fast'); - } else { - $('input#notice_data-attach').slideUp('fast', function() {$('label[for=notice_data-attach]').text('Upload a file as an attachment?');}); - } - }); - // count character on keyup function counter(event){ var maxLength = 140; diff --git a/lib/noticeform.php b/lib/noticeform.php index 805cd56b1..5a6c7cf38 100644 --- a/lib/noticeform.php +++ b/lib/noticeform.php @@ -148,7 +148,6 @@ class NoticeForm extends Form $this->out->element('dd', array('id' => 'notice_text-count'), '140'); $this->out->elementEnd('dl'); - $this->out->element('br', array('style' => 'clear:both')); $this->out->element('label', array('for' => 'notice_data-attach'), _('Attach')); $this->out->element('input', array('id' => 'notice_data-attach', 'type' => 'file', diff --git a/theme/base/css/display.css b/theme/base/css/display.css index 7d495c539..7eea54eb2 100644 --- a/theme/base/css/display.css +++ b/theme/base/css/display.css @@ -452,6 +452,22 @@ float:left; font-size:1.3em; margin-bottom:7px; } +#form_notice label[for=notice_data-attach] { +text-indent:-9999px; +display:block; +} +#form_notice label[for=notice_data-attach], +#form_notice #notice_data-attach { +position:absolute; +top:25px; +right:49px; +width:16px; +height:16px; +cursor:pointer; +} +#form_notice #notice_data-attach { +text-indent:-279px; +} #form_notice #notice_submit label { display:none; } diff --git a/theme/identica/css/display.css b/theme/identica/css/display.css index 1f1298737..8a03a4d77 100644 --- a/theme/identica/css/display.css +++ b/theme/identica/css/display.css @@ -82,6 +82,13 @@ color:#333; #form_notice.warning #notice_text-count { color:#000; } +#form_notice label[for=notice_data-attach] { +background:transparent url(../../base/images/icons/twotone/green/clip-01.gif) no-repeat 0 45%; +} +#form_notice #notice_data-attach { +opacity:0; +} + #form_notice.processing #notice_action-submit { background:#fff url(../../base/images/icons/icon_processing.gif) no-repeat 47% 47%; cursor:wait; -- cgit v1.2.3-54-g00ecf