diff --git a/config/alfresco/templates/client/doclist_preview_panel.ftl b/config/alfresco/templates/client/doclist_preview_panel.ftl index 3e0adb2efc..4accc801a6 100644 --- a/config/alfresco/templates/client/doclist_preview_panel.ftl +++ b/config/alfresco/templates/client/doclist_preview_panel.ftl @@ -1,34 +1,30 @@ <#assign isImage=node.isDocument && (node.mimetype = "image/gif" || node.mimetype = "image/jpeg" || node.mimetype = "image/png")> -<#assign isVideo=node.isDocument && node.mimetype?starts_with("video/")> -
-
- <#if node.isDocument && !isImage && !isVideo> +
+ <#if node.isDocument && !isImage> <#assign c=cropContent(node.properties.content, 512)> <#if c?length != 0> ${c?html?replace('$', '
', 'rm')}<#if (c?length >= 512)>... <#elseif isImage> - - <#else> - TBD - Video? +
- + - + - + diff --git a/config/alfresco/templates/client/myspaces_preview_panel.ftl b/config/alfresco/templates/client/myspaces_preview_panel.ftl new file mode 100644 index 0000000000..90e4d8fc32 --- /dev/null +++ b/config/alfresco/templates/client/myspaces_preview_panel.ftl @@ -0,0 +1,52 @@ +<#assign isImage=node.isDocument && (node.mimetype = "image/gif" || node.mimetype = "image/jpeg" || node.mimetype = "image/png")> +
Checkout Edit Details
Update View Content
Delete More Actions...
+ + + + + +
+
+ <#if node.isDocument && !isImage> + <#assign c=cropContent(node.properties.content, 512)> + <#if c?length != 0> + ${c?html?replace('$', '
', 'rm')}<#if (c?length >= 512)>... + + <#elseif isImage> +
+ <#elseif node.isContainer> + <#list node.children?sort_by('name') as c> + <#--if (c_index >= 25)>
...
<#break>--> + <#if c.isDocument || c.isContainer> + + + + +
+ 		+ + <#if node.isDocument> + + + + + + + + + + + + + <#else> + + + + + + + + + +
CheckoutEdit Details
UpdateView Content
DeleteMore Actions...
Edit DetailsDelete
More Actions...
+
diff --git a/config/alfresco/templates/webscripts/org/alfresco/portlets/doclist_get_html.ftl b/config/alfresco/templates/webscripts/org/alfresco/portlets/doclist_get_html.ftl index fb3a52e796..d8254ae78c 100644 --- a/config/alfresco/templates/webscripts/org/alfresco/portlets/doclist_get_html.ftl +++ b/config/alfresco/templates/webscripts/org/alfresco/portlets/doclist_get_html.ftl @@ -35,7 +35,7 @@ -
+ @@ -211,7 +211,7 @@ a.docfilterLinkSelected:link, a.docfilterLinkSelected:visited font-size: 12px; background-color: #bad7e4; color: #000000; - margin: 0px 0px 0px 0px; + margin: 0px; border-top: 1px dotted #0092dd; visibility: hidden; overflow: hidden; @@ -230,12 +230,12 @@ a.docfilterLinkSelected:link, a.docfilterLinkSelected:visited font-weight: bolder; } -.docMetapreview +.docPreview { color: #515D6B; font-family: Trebuchet MS, Arial, Helvetica, sans-serif; overflow: hidden; - height: 140px; + height: 144px; width: 410px; border: 1px solid #0092dd; } diff --git a/config/alfresco/templates/webscripts/org/alfresco/portlets/myspaces_get_html.ftl b/config/alfresco/templates/webscripts/org/alfresco/portlets/myspaces_get_html.ftl index c5700576cd..00344c5e62 100644 --- a/config/alfresco/templates/webscripts/org/alfresco/portlets/myspaces_get_html.ftl +++ b/config/alfresco/templates/webscripts/org/alfresco/portlets/myspaces_get_html.ftl @@ -15,7 +15,7 @@ <#-- get the filter mode from the passed in args --> -<#-- filters: 0=all, 1=spaces, 2=docs, 3=mine --> +<#-- filters: 0=all, 1=spaces, 2=docs, 3=mine, 4=recent --> <#if args.f?exists && args.f?length!=0><#assign filter=args.f?number><#else><#assign filter=0> <#-- get the path location from the passed in args, remove trailing slash --> @@ -48,22 +48,20 @@ - <#-- Refresh action --> - Refresh
- ${home.name?html} + ${home.name?html}
-
+
<#-- TODO: permission checks on the actions! --> <#-- Upload File action --> -
Upload
+
Upload
<#-- Url encode the path value, and encode any single quotes to generate valid string -->
<#-- Create Space action --> -
Create Space
+
Create Space
All Items
@@ -74,17 +72,19 @@ -
-
-
Name:
+
+
+ +
All Items Spaces Documents My ItemsRecently Modified + Refresh +
-
@@ -213,6 +213,28 @@ a.spacefilterLinkSelected:link, a.spacefilterLinkSelected:visited padding-left: 16px; } +.spaceResource +{ + font-family: Trebuchet MS, Arial, Helvetica, sans-serif; + font-size: 12px; + background-color: #bad7e4; + color: #000000; + margin: 0px; + border-top: 1px dotted #0092dd; + visibility: hidden; + overflow: hidden; +} + +.spacesAjaxWait +{ + background-image: url(${url.context}/images/icons/ajax_anim.gif); + background-position: center; + background-repeat: no-repeat; + width: 696px; + height: 150px; + overflow: hidden; +} + .spaceItemSelected { background-color: #CCE7F3 !important; @@ -263,14 +285,14 @@ a.spaceBreadcrumbLink:link, a.spaceBreadcrumbLink:visited, a.spaceBreadcrumbLink border: 1px solid #CCD4DB; } -.spaceActions +.spaceToolbar { background-color: #EEF7FB; height: 4em; border-bottom: 1px solid #CCD4DB; } -.spaceAction +.spaceToolbarAction { background-repeat: no-repeat; background-position: 2px; @@ -286,16 +308,90 @@ a.spaceBreadcrumbLink:link, a.spaceBreadcrumbLink:visited, a.spaceBreadcrumbLink border: 1px dashed #CCD4DB; } -.spaceActionUpload +.spaceToolbarActionUpload { background-image: url(${url.context}/images/icons/doclist_action_upload.png); } -.spaceActionCreateSpace +.spaceToolbarActionCreateSpace { background-image: url(${url.context}/images/icons/doclist_action_createspace.png); } +.spaceAction +{ + color: #515D6B; + font-family: Trebuchet MS, Arial, Helvetica, sans-serif; + font-size: 9pt; + font-weight: bolder; + background-color: #c3dce7; + background-repeat: no-repeat; + background-position: left; + width: 87px; + height: 28px; + border: 1px solid #ffffff; + float: left; + display: block; + padding: 10px 0px 0px 36px; + cursor: pointer; +} + +.docActionCheckout +{ + background-image: url(${url.context}/images/icons/doclist_action_checkout.png); + border-bottom: none; + border-right: none; +} + +.docActionEditDetails +{ + background-image: url(${url.context}/images/icons/doclist_action_edit.png); + border-bottom: none; +} + +.docActionUpdate +{ + background-image: url(${url.context}/images/icons/doclist_action_update.png); + border-bottom: none; + border-right: none; +} + +.docActionViewContent +{ + background-image: url(${url.context}/images/icons/doclist_action_view.png); + border-bottom: none; +} + +.docActionDelete +{ + background-image: url(${url.context}/images/icons/doclist_action_delete.png); + border-right: none; +} + +.docActionMoreActions +{ + padding-left: 20px; + padding-right: 16px; +} + +.spaceActionMoreActions +{ + padding-left: 20px; + padding-right: 16px; + border-top: none; +} + +.spaceActionEditDetails +{ + background-image: url(${url.context}/images/icons/doclist_action_edit.png); +} + +.spaceActionDelete +{ + background-image: url(${url.context}/images/icons/doclist_action_delete.png); + border-left: none; +} + .spaceUploadPanel { position: absolute; @@ -332,4 +428,26 @@ a.refreshViewLink:link, a.refreshViewLink:visited, a.refreshViewLink:hover text-decoration: none; } +.spacePreview +{ + color: #515D6B; + font-family: Trebuchet MS, Arial, Helvetica, sans-serif; + overflow: hidden; + height: 144px; + width: 410px; + border: 1px solid #0092dd; +} + +a.childSpaceLink:link, a.childSpaceLink:visited, a.childSpaceLink:hover +{ + color: #5A5741; + font-family: Trebuchet MS, Arial, Helvetica, sans-serif; +} + +img.spaceImageIcon +{ + vertical-align: -25%; + padding-right:4px; +} + \ No newline at end of file diff --git a/config/alfresco/templates/webscripts/org/alfresco/portlets/myspacespanel_get_html.ftl b/config/alfresco/templates/webscripts/org/alfresco/portlets/myspacespanel_get_html.ftl index eef1981b32..bbb6cf03bb 100644 --- a/config/alfresco/templates/webscripts/org/alfresco/portlets/myspacespanel_get_html.ftl +++ b/config/alfresco/templates/webscripts/org/alfresco/portlets/myspacespanel_get_html.ftl @@ -1,11 +1,13 @@ <#assign user=person.properties.userName> <#assign count=0> +<#assign weekms=1000*60*60*24*7> <#list companyhome.nodeByReference[args.h].children?sort_by('name') as d> <#if (d.isContainer || d.isDocument) && ((args.f="0") || (args.f="1" && d.isContainer) || (args.f="2" && d.isDocument) || - (args.f="3" && (d.properties.creator == user || d.properties.modifier == user)))> + (args.f="3" && (d.properties.creator == user || d.properties.modifier == user)) || + (args.f="4" && (dateCompare(d.properties["cm:modified"],date,weekms) == 1 || dateCompare(d.properties["cm:created"], date, weekms) == 1)))> <#assign count=count+1>
@@ -39,8 +41,9 @@
+
<#-- hidden div with the count value for the page --> - \ No newline at end of file + diff --git a/source/web/scripts/ajax/doclist.js b/source/web/scripts/ajax/doclist.js index f35451e9ef..36a46f1486 100644 --- a/source/web/scripts/ajax/doclist.js +++ b/source/web/scripts/ajax/doclist.js @@ -43,7 +43,7 @@ var MyDocs = { if (resource.isLoaded) { resource.needsOverflow = false; - var elePrev = $E('.docMetapreview', resource) + var elePrev = $E('.docPreview', resource) if (elePrev) { elePrev.setStyle('overflow', 'auto'); @@ -207,7 +207,7 @@ var MyDocs = { // deferred from transition complete event if (resource.needsOverflow) { - var elePrev = $E('.docMetapreview', resource) + var elePrev = $E('.docPreview', resource) if (elePrev) { elePrev.setStyle('overflow', 'auto'); @@ -312,7 +312,7 @@ var MyDocs = { 'opacity': [otherResource.getStyle('opacity'), 0]}; } - var otherMeta = $E('.docMetapreview', otherResource) + var otherMeta = $E('.docPreview', otherResource) if (otherMeta) { otherMeta.setStyle('overflow', 'hidden'); @@ -331,7 +331,7 @@ var MyDocs = { 'height': [resourceHeight, resource.defHeight], 'opacity': [resource.getStyle('opacity'), 0]}; - var elePrev = $E('.docMetapreview', resource) + var elePrev = $E('.docPreview', resource) if (elePrev) { elePrev.setStyle('overflow', 'hidden'); diff --git a/source/web/scripts/ajax/myspaces.js b/source/web/scripts/ajax/myspaces.js index 04b14634d0..6dea590b49 100644 --- a/source/web/scripts/ajax/myspaces.js +++ b/source/web/scripts/ajax/myspaces.js @@ -4,6 +4,7 @@ var MySpaces = { ANIM_LENGTH: 300, DETAIL_MARGIN: 56, TITLE_FONT_SIZE: 18, + RESOURCE_PANEL_HEIGHT: 150, fileInput: null, Path: null, Filter: null, @@ -59,10 +60,40 @@ var MySpaces = { var icons = $$('#spacePanel .spaceIcon'); var imgs = $$('#spacePanel .spaceIconImage'); var imgs64 = $$('#spacePanel .spaceIconImage64'); + var resources = $$('#spacePanel .spaceResource'); var fxItem = new Fx.Elements(items, {wait: false, duration: MySpaces.ANIM_LENGTH, transition: Fx.Transitions.linear}); var fxDetail = new Fx.Elements(details, {wait: false, duration: MySpaces.ANIM_LENGTH, transition: Fx.Transitions.linear}); var fxInfo = new Fx.Elements(infos, {wait: false, duration: MySpaces.ANIM_LENGTH, transition: Fx.Transitions.linear}); var fxIcon = new Fx.Elements(icons, {wait: false, duration: MySpaces.ANIM_LENGTH, transition: Fx.Transitions.linear}); + var fxResource = new Fx.Elements(resources, + { + wait: false, + duration: 500, + transition: Fx.Transitions.linear, + onComplete: function() + { + this.elements.each(function(resource, i) + { + if (resource.parentNode.isOpen) + { + if (resource.isLoaded) + { + resource.needsOverflow = false; + var elePrev = $E('.spacePreview', resource) + if (elePrev) + { + elePrev.setStyle('overflow', 'auto'); + } + } + else + { + // defer style change to ajax complete event + resource.needsOverflow = true; + } + } + }); + } + }); var fxImage = new Fx.Elements(imgs, { wait: false, @@ -82,7 +113,8 @@ var MySpaces = { var item = items[i], info = infos[i], detail = details[i], - img = imgs[i]; + img = imgs[i], + resource = resources[i]; // animated elements defaults item.defMarginLeft = item.getStyle('margin-left').toInt(); @@ -100,6 +132,8 @@ var MySpaces = { } img.defSrc = img.src; img.bigSrc = imgs64[i].src; + resource.defHeight = 1; + resource.setStyle('height', resource.defHeight); // register 'mouseenter' (subclassed mouseover) event for each space space.addEvent('mouseenter', function(e) @@ -179,6 +213,172 @@ var MySpaces = { fxInfo.start(animInfo); fxImage.start(animImage); }); + + space.addEvent('click', function(e) + { + var animItem = {}, + animDetail = {}, + animInfo = {}; + animImage = {}, + animResource = {}, + resourceHeight = resource.getStyle('height').toInt(); + + if (!space.isOpen) + { + if (!resource.isLoaded) + { + // fire off the ajax request to get the resources for this task + YAHOO.util.Connect.asyncRequest( + "POST", + getContextPath() + '/ajax/invoke/NodeInfoBean.sendNodeInfo', + { + success: function(response) + { + // remove the ajax waiting animation class + resource.removeClass("spacesAjaxWait"); + // populate the resource div with the result + resource.innerHTML = response.responseText; + // flag this resource as loaded + resource.isLoaded = true; + // deferred from transition complete event + if (resource.needsOverflow) + { + var elePrev = $E('.spacePreview', resource) + if (elePrev) + { + elePrev.setStyle('overflow', 'auto'); + } + } + }, + failure: function(response) + { + resource.innerHTML = "Sorry, preview currently unavailable."; + }, + argument: [resource] + }, + "noderef=" + resource.id + "&template=myspaces_preview_panel.ftl" + ); + } + + // open up this space's resources + // flag this space as open + space.isOpen = true; + + // slide and fade in the resources panel + animResource[i] = { + 'height': [resourceHeight, resource.defHeight + MySpaces.RESOURCE_PANEL_HEIGHT], + 'opacity': [resource.getStyle('opacity'), 1]}; + + // close other open space and toggle this one if it's already open + spaces.each(function(otherSpace, j) + { + var otherResource = resources[j], + otherItem = items[j], + otherInfo = infos[j], + otherDetail = details[j], + otherImg = imgs[j]; + + if (otherSpace == space) + { + // continue animations that may have been going on before the click + // move the item title to the right + animItem[j] = { + 'margin-left': [otherItem.getStyle('margin-left').toInt(), MySpaces.DETAIL_MARGIN], + 'font-size': [otherItem.getStyle('font-size').toInt(), MySpaces.TITLE_FONT_SIZE] + }; + // fade in the info button + animInfo[j] = {'opacity': [otherInfo.getStyle('opacity'), 1]}; + // slide and fade in the details panel + animDetail[j] = { + 'height': [otherDetail.getStyle('height').toInt(), otherDetail.defHeight + MySpaces.IMG_LARGE], + 'opacity': [otherDetail.getStyle('opacity'), 1] + }; + // grow the type image + animImage[j] = { + 'height': [otherImg.getStyle('height').toInt(), MySpaces.IMG_LARGE], + 'width': [otherImg.getStyle('width').toInt(), MySpaces.IMG_LARGE] + }; + } + else + { + // close any other open space + otherSpace.isOpen = false; + + // reset selected class? + otherSpace.removeClass('spaceItemSelected'); + // move the title back to the left? + var ml = otherItem.getStyle('margin-left').toInt(); + if (ml != otherItem.defMarginLeft) + { + animItem[j] = { + 'margin-left': [ml, otherItem.defMarginLeft], + 'font-size': [otherItem.getStyle('font-size').toInt(), otherItem.defFontSize] + }; + } + // does this space detail panel need resetting back to it's default height? + var h = otherDetail.getStyle('height').toInt(); + if (h != otherDetail.defHeight) + { + animDetail[j] = { + 'height': [h, otherDetail.defHeight], + 'opacity': [otherDetail.getStyle('opacity'), 0]}; + } + // does the info button need fading out + var o = otherInfo.getStyle('opacity'); + if (o != 0) + { + animInfo[j] = {'opacity': [o, 0]}; + } + // does the image need shrinking? + var ih = otherImg.getStyle('height').toInt(); + if (ih != MySpaces.IMG_SMALL) + { + animImage[j] = { + 'height': [ih, MySpaces.IMG_SMALL], + 'width': [ih, MySpaces.IMG_SMALL] + }; + } + + // does this space resource panel need resetting back to it's default height? + var otherHeight = otherResource.getStyle('height').toInt(); + if (otherHeight != otherResource.defHeight) + { + animResource[j] = { + 'height': [otherHeight, otherResource.defHeight], + 'opacity': [otherResource.getStyle('opacity'), 0]}; + } + + var otherMeta = $E('.spacePreview', otherResource) + if (otherMeta) + { + otherMeta.setStyle('overflow', 'hidden'); + } + } + }); + } + else + { + // close this space panel + // flag this space as closed + space.isOpen = false; + + // reset resource panel back to it's default height + animResource[i] = { + 'height': [resourceHeight, resource.defHeight], + 'opacity': [resource.getStyle('opacity'), 0]}; + + var elePrev = $E('.spacePreview', resource) + if (elePrev) + { + elePrev.setStyle('overflow', 'hidden'); + } + } + fxResource.start(animResource); + fxItem.start(animItem); + fxDetail.start(animDetail); + fxInfo.start(animInfo); + fxImage.start(animImage); + }); }); $('spacePanel').addEvent('mouseleave', function(e)