diff options
Diffstat (limited to 'views')
| -rw-r--r-- | views/default/forms/photos/ajax_upload.php | 66 | ||||
| -rw-r--r-- | views/default/js/photos/uploading.php | 85 | ||||
| -rw-r--r-- | views/default/photos/css.php | 169 |
3 files changed, 190 insertions, 130 deletions
diff --git a/views/default/forms/photos/ajax_upload.php b/views/default/forms/photos/ajax_upload.php index f0738994a..be25d628e 100644 --- a/views/default/forms/photos/ajax_upload.php +++ b/views/default/forms/photos/ajax_upload.php @@ -2,26 +2,22 @@ /** * Tidypics ajax upload form body * - * @uses $vars['album'] + * @uses $vars['entity'] */ -$album = $vars['album']; +$album = $vars['entity']; $ts = time(); -$token = generate_action_token($ts); $batch = time(); -$tidypics_token = md5(session_id() . get_site_secret() . $ts . get_loggedin_user()->salt); - +$tidypics_token = md5(session_id() . get_site_secret() . $ts . elgg_get_logged_in_user_entity()->salt); $basic_uploader_url = current_page_url() . '/basic'; -$upload_endpoint_url = "{$vars['url']}action/tidypics/ajax_upload/"; -$upload_complete_url = "{$vars['url']}action/tidypics/ajax_upload_complete/"; -$maxfilesize = (float) get_plugin_setting('maxfilesize','tidypics'); +$maxfilesize = (float) elgg_get_plugin_setting('maxfilesize', 'tidypics'); if (!$maxfilesize) { $maxfilesize = 5; } -$quota = get_plugin_setting('quota','tidypics'); +$quota = elgg_get_plugin_setting('quota', 'tidypics'); if ($quota) { $image_repo_size_md = get_metadata_byname($album->container_guid, "image_repo_size"); $image_repo_size = (int)$image_repo_size_md->value; @@ -40,30 +36,32 @@ if ($quota) { ?> -<div class="contentWrapper"> - - <p><?php echo sprintf(elgg_echo('tidypics:uploader:instructs'), $basic_uploader_url); ?></p> +<p><?php echo elgg_echo('tidypics:uploader:instructs', array($basic_uploader_url)); ?></p> - <ul id="tidypics_uploader_steps"> - <li> - <div id="tidypics_uploader"> - <a id="tidypics_choose_button" href="<?php echo $basic_uploader_url; ?>"> - 1. <?php echo elgg_echo('tidypics:uploader:choose'); ?> - </a> - <div id="tidypics_flash_uploader"> - <input type="file" id="uploadify" name="uploadify" /> - </div> - </div> - </li> - <li> - <a id="tidypics_upload_button" class="tidypics_disable" href="javascript:$('#uploadify').uploadifyUpload();"> - 2. <?php echo elgg_echo('tidypics:uploader:upload'); ?> +<ul id="tidypics-uploader-steps"> + <li class="mbm"> + <div id="tidypics-uploader"> + <a id="tidypics-choose-button" href="<?php echo $basic_uploader_url; ?>"> + 1. <?php echo elgg_echo('tidypics:uploader:choose'); ?> </a> - </li> - <li> - <a id="tidypics_describe_button" class="tidypics_disable" href="<?php echo $vars['url']; ?>pg/photos/batch/<?php echo $batch; ?>"> - 3. <?php echo elgg_echo('tidypics:uploader:describe'); ?> - </a> - </li> - </ul> -</div> + <div id="tidypics-flash-uploader"> + <input type="file" id="uploadify" name="uploadify" class="hidden" /> + <input type="hidden" name="album_guid" value="<?php echo $album->getGUID(); ?>" /> + <input type="hidden" name="batch" value="<?php echo $batch; ?>" /> + <input type="hidden" name="tidypics_token" value="<?php echo $tidypics_token; ?>" /> + <input type="hidden" name="user_guid" value="<?php echo elgg_get_logged_in_user_guid(); ?>" /> + <input type="hidden" name="Elgg" value="<?php echo session_id(); ?>" /> + </div> + </div> + </li> + <li class="mbm"> + <a id="tidypics-upload-button" class="tidypics-disable" href="#"> + 2. <?php echo elgg_echo('tidypics:uploader:upload'); ?> + </a> + </li> + <li class="mbm"> + <a id="tidypics-describe-button" class="tidypics-disable" href="#"> + 3. <?php echo elgg_echo('tidypics:uploader:describe'); ?> + </a> + </li> +</ul> diff --git a/views/default/js/photos/uploading.php b/views/default/js/photos/uploading.php index 59448dd46..cb79dc77c 100644 --- a/views/default/js/photos/uploading.php +++ b/views/default/js/photos/uploading.php @@ -1,27 +1,92 @@ <?php /** - * + * AJAX uploading */ - -$site_url = elgg_get_site_url(); -$upload_endpoint_url = "{$site_url}action/tidypics/ajax_upload/"; -$upload_complete_url = "{$site_url}action/tidypics/ajax_upload_complete/"; - ?> +//<script> elgg.provide('elgg.tidypics.uploading'); elgg.tidypics.uploading.init = function() { + + var fields = ['Elgg', 'user_guid', 'album_guid', 'batch', 'tidypics_token']; + var data = elgg.security.token; + + $(fields).each(function(i, name) { + var value = $('input[name=' + name + ']').val(); + if (value) { + data[name] = value; + } + }); + + data['XDEBUG_SESSION_START'] = 'netbeans-xdebug'; + $("#uploadify").uploadify({ - 'uploader' : '<?php echo $site_url; ?>mod/tidypics/vendors/uploadify/uploadify.swf', - 'script' : '<?php echo $upload_endpoint_url; ?>', + 'uploader' : elgg.config.wwwroot + 'mod/tidypics/vendors/uploadify/uploadify.swf', + 'script' : elgg.config.wwwroot + 'action/photos/image/ajax_upload', + 'cancelImg' : elgg.config.wwwroot + 'mod/tidypics/vendors/uploadify/cancel.png', 'fileDataName' : 'Image', 'multi' : true, 'auto' : false, 'wmode' : 'transparent', 'buttonImg' : " ", - 'height' : 20, - 'width' : 130 + 'height' : $('#tidypics-choose-button').height(), + 'width' : $('#tidypics-choose-button').width(), + 'scriptData' : data, + 'onEmbedFlash' : function(event) { + // @todo This is supposed to mimick hovering over the link. + // hover events aren't firing for the object. + $("#" + event.id).hover( + function(){ + $("#tidypics-choose-button").addClass('tidypics-choose-button-hover'); + }, + function(){ + $("#tidypics-choose-button").removeClass('tidypics-choose-button-hover'); + } + ); + }, + 'onSelectOnce' : function() { + $("#tidypics-upload-button").removeClass('tidypics-disable'); + }, + 'onAllComplete' : function() { + // @todo they can keep adding pics if they want. no need to disable this. + $("#tidypics-choose-button").addClass('tidypics-disable'); + $("#tidypics-upload-button").addClass('tidypics-disable').die(); + $("#tidypics-describe-button").removeClass('tidypics-disable'); + + elgg.action('photos/image/ajax_upload_complete', { + data: { + album_guid: data.album_guid, + batch: data.batch + }, + success: function(json) { + var url = elgg.normalize_url('photos/edit/' + json.batch_guid) + $('#tidypics-describe-button').attr('href', url); + } + }); + }, + 'onComplete' : function(event, queueID, fileObj, response) { + // check for errors here + if (response != 'success') { + $("#uploadify" + queueID + " .percentage").text(" - " + response); + $("#uploadify" + queueID).addClass('uploadifyError'); + } + $("#uploadify" + queueID + " > .cancel").remove(); + return false; + }, + 'onCancel' : function(event, queueID, fileObj, data) { + if (data.fileCount == 0) { + $("#tidypics-upload-button").addClass('tidypics-disable'); + } + } + + }); + + // bind to upload button + $('#tidypics-upload-button').live('click', function(e) { + var $uploadify = $('#uploadify'); + $uploadify.uploadifyUpload(); + e.preventDefault(); }); } diff --git a/views/default/photos/css.php b/views/default/photos/css.php index 3e448f27a..2290e1f9a 100644 --- a/views/default/photos/css.php +++ b/views/default/photos/css.php @@ -130,12 +130,82 @@ Tagging *************************************** */ #tidypics_uploader { -position:relative; -width:400px; -min-height:20px; + position:relative; + width:400px; + min-height:20px; } #tidypics_choose_button { + position:absolute; + top:0; + left:0; + z-index:0; + display:block; + float:left; +} + +#tidypics_flash_uploader { + position:relative; + z-index:100; +} + +/* *************************************** + AJAX UPLOADER +*************************************** */ +#tidypics-uploader-steps { + list-style: none; +} + +#tidypics-uploader-steps li a { + font-weight:bold; +} + +.tidypics-choose-button-hover { + color:#0054a7; + text-decoration:underline; +} + +.tidypics-disable { + color:#cccccc; +} + +.tidypics-disable:hover { +color:#cccccc; +text-decoration:none; +} + + +.uploadifyQueueItem { +background-color:#F5F5F5; +border:2px solid #E5E5E5; +font-size:11px; +margin-top:5px; +padding:10px; +width:350px; +} + +.uploadifyProgress { +background-color:#FFFFFF; +border-color:#808080 #C5C5C5 #C5C5C5 #808080; +border-style:solid; +border-width:1px; +margin-top:10px; +width:100%; +} + +.uploadifyProgressBar { +background-color: #0054a7; +width: 1px; +height: 3px; +} + +#tidypics-uploader { + position:relative; + width:400px; + min-height:20px; +} + +#tidypics-choose-button { position:absolute; top:0; left:0; @@ -144,11 +214,20 @@ display:block; float:left; } -#tidypics_flash_uploader { +#tidypics-flash-uploader { position:relative; z-index:100; } +.uploadifyQueueItem .cancel { + float: right; +} + +.uploadifyError { +border: 2px solid #FBCBBC; +background-color: #FDE5DD; +} + <?php return true; ?> @@ -465,88 +544,6 @@ display:inline; list-style: none; } -/*----- uploadify ------*/ - -#tidypics_uploader_steps { -list-style:none; -} - -#tidypics_uploader_steps li { -margin-bottom: 20px; -} - -#tidypics_uploader_steps li a { -font-weight:bold; -} - -.tidypics_choose_button_hover { -color:#0054a7; -text-decoration:underline; -} - -.tidypics_disable { -color:#cccccc; -} - -.tidypics_disable:hover { -color:#cccccc; -text-decoration:none; -} - - -.uploadifyQueueItem { -background-color:#F5F5F5; -border:2px solid #E5E5E5; -font-size:11px; -margin-top:5px; -padding:10px; -width:350px; -} - -.uploadifyProgress { -background-color:#FFFFFF; -border-color:#808080 #C5C5C5 #C5C5C5 #808080; -border-style:solid; -border-width:1px; -margin-top:10px; -width:100%; -} - -.uploadifyProgressBar { -background-color: #0054a7; -width: 1px; -height: 3px; -} - -#tidypics_uploader { -position:relative; -width:400px; -min-height:20px; -} - -#tidypics_choose_button { -position:absolute; -top:0; -left:0; -z-index:0; -display:block; -float:left; -} - -#tidypics_flash_uploader { -position:relative; -z-index:100; -} - -.uploadifyQueueItem .cancel { -float: right; -} - -.uploadifyError { -border: 2px solid #FBCBBC; -background-color: #FDE5DD; -} - #tidypics_album_sort { padding:0; margin:0; |