Author: ganeshmb
Date: Mon Apr 20 03:10:00 2009
New Revision: 766565
URL: http://svn.apache.org/viewvc?rev=766565&view=rev
Log:
UI changes made by Tanuja for new popup pages and for enhancing media file
view/search pages added.
Added:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/tiles/tiles-popuppage.jsp
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/classes/struts.xml
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileSearch.jsp
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileView.jsp
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/tiles.xml
roller/branches/roller_mediablogging/apps/weblogger/web/roller-ui/styles/roller.css
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/classes/struts.xml
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/classes/struts.xml?rev=766565&r1=766564&r2=766565&view=diff
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/classes/struts.xml
(original)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/classes/struts.xml
Mon Apr 20 03:10:00 2009
@@ -218,19 +218,33 @@
<result name="success" type="chain">entryEdit</result>
</action>
- <action name="mediaFileAdd!*" method="{1}"
+ <action name="mediaFileAdd!*" method="{1}"
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileAdd">
<result name="input" type="tiles">.MediaFileAdd</result>
<result name="success" type="tiles">.MediaFileAddSuccess</result>
<result name="error" type="tiles">.MediaFileAdd</result>
</action>
- <action name="mediaFileEdit!*" method="{1}"
+ <action name="mediaFileAddInclude!*" method="{1}"
+
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileAdd">
+ <result name="input" type="tiles">.MediaFileAddInclude</result>
+ <result name="success"
type="tiles">.MediaFileAddSuccessInclude</result>
+ <result name="error"
type="tiles">.MediaFileAddInclude</result>
+ </action>
+
+ <action name="mediaFileEdit!*" method="{1}"
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileEdit">
<result name="input" type="tiles">.MediaFileEdit</result>
<result name="success" type="tiles">.MediaFileEdit</result>
</action>
+ <action name="mediaFileAddExternalInclude!*" method="{1}"
+
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileEdit">
+ <result name="input"
type="tiles">.MediaFileAddExternalInclude</result>
+ <result name="success"
type="tiles">.MediaFileAddExternalInclude</result>
+ <result name="error"
type="tiles">.MediaFileAddExternalInclude</result>
+ </action>
+
<action name="mediaFileView!*" method="{1}"
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileView">
<result name="success" type="tiles">.MediaFileView</result>
@@ -248,6 +262,13 @@
<result name="error" type="tiles">.MediaFileSearch</result>
<result name="success" type="tiles">.MediaFileSearch</result>
</action>
+
+ <action name="mediaFileSearchInclude!*" method="{1}"
+
class="org.apache.roller.weblogger.ui.struts2.editor.MediaFileSearch">
+ <result name="input" type="tiles">.MediaFileSearchInclude</result>
+ <result name="error" type="tiles">.MediaFileSearchInclude</result>
+ <result name="success"
type="tiles">.MediaFileSearchInclude</result>
+ </action>
<action name="tabular!*" method="{1}"
class="org.apache.roller.weblogger.ui.struts2.editor.Resources">
Added:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp?rev=766565&view=auto
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp
(added)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp
Mon Apr 20 03:10:00 2009
@@ -0,0 +1,56 @@
+<%--
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. The ASF licenses this file to You
+ under the Apache License, Version 2.0 (the "License"); you may not
+ use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License. For additional information regarding
+ copyright in this work, please see the NOTICE file in the top level
+ directory of this distribution.
+--%>
+<%@ include file="/WEB-INF/jsps/taglibs-struts2.jsp" %>
+
+<p class="subtitle">
+ <s:text name="mediaFile.add.title" />
+</p>
+
+<s:form id="entry" action=" " onsubmit="editorCleanup()" method="POST">
+
+
+ <table class="entryEditTable" cellpadding="0" cellspacing="0" width="100%">
+
+ <tr>
+ <td class="entryEditFormLabel">
+ <label for="status">URL:</label>
+ </td>
+ <td>
+ <s:textfield name=" " size="50" maxlength="255" tabindex="1" />
+ </td>
+ </tr>
+
+ <tr>
+ <td class="entryEditFormLabel">
+ <label for="status">Title</label>
+ </td>
+ <td>
+ <s:textfield name=" " size="50" maxlength="255" />
+ </td>
+ </tr>
+
+
+ </table>
+
+
+ <br>
+ <div class="control">
+ <input type="submit" value="Insert" name="submit" />
+ </div>
+
+</s:form>
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileSearch.jsp
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileSearch.jsp?rev=766565&r1=766564&r2=766565&view=diff
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileSearch.jsp
(original)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileSearch.jsp
Mon Apr 20 03:10:00 2009
@@ -16,6 +16,199 @@
directory of this distribution.
--%>
<%@ include file="/WEB-INF/jsps/taglibs-struts2.jsp" %>
+<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/combo?2.6.0/build/reset-fonts-grids/reset-fonts-grids.css&2.6.0/build/menu/assets/skins/sam/menu.css";>
+<!-- Combo-handled YUI JS files: -->
+<script type="text/javascript"
src="http://yui.yahooapis.com/combo?2.6.0/build/yahoo-dom-event/yahoo-dom-event.js&2.6.0/build/animation/animation-min.js&2.6.0/build/container/container_core-min.js&2.6.0/build/menu/menu-min.js";></script>
+<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.6.0/build/fonts/fonts-min.css"; />
+<link rel="stylesheet" type="text/css"
+href="http://yui.yahooapis.com/2.6.0/build/container/assets/skins/sam/container.css";
/>
+
+<script type="text/javascript"
src="http://yui.yahooapis.com/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js";></script>
+<script type="text/javascript"
+src="http://yui.yahooapis.com/2.6.0/build/container/container-min.js";></script>
+<style type="text/css">
+body {
+ margin:0;
+ padding:0;
+ text-align:left;
+ }
+ h1 {
+ font-size:20px;
+ font-weight:bold;
+ }
+.yui-overlay {
+ position:fixed;
+ background: #ffffff;
+ z-index: 112;
+ color:#000000;
+ border: 4px solid #525252;
+ text-align:left;
+ top: 50%;
+ left: 50%;
+ }
+</style>
+<script type="text/javascript">
+YAHOO.util.Event.onContentReady("myMenu", function () {
+
+
+ var oClones = this;
+
+
+ function deleteMedia(p_oLI) {
+
+ var oUL =
YAHOO.util.Dom.getAncestorByTagName(p_oLI, "LI");
+
+
+ var myparent = oUL.parentNode;
+
+
+ var hidden_mediaFileId =
document.getElementById("mediafileidentity");
+ var hidden_mediaFileId_value = hidden_mediaFileId.value;
+ myparent.removeChild(oUL);
+
document.mediaFileSearchForm.mediaFileId.value=hidden_mediaFileId_value;
+ document.mediaFileSearchForm.action='<s:url
action="mediaFileSearch!delete" />';
+ document.mediaFileSearchForm.submit();
+
+
+ }
+
+
+ function createPost() {
+
+
+ }
+
+
+ function includeMedia() {
+ var hidden_mediaFileId =
document.getElementById("mediafileidentity");
+ var hidden_mediaFileId_value = hidden_mediaFileId.value;
+
document.mediaFileSearchForm.mediaFileId.value=hidden_mediaFileId_value;
+ document.mediaFileSearchForm.action='<s:url
action="mediaFileSearch!includeInGallery" />';
+ document.mediaFileSearchForm.submit();
+
+ }
+
+
+
+ function onEweContextMenuClick(p_sType, p_aArgs) {
+
+ /*
+ The second item in the arguments array (p_aArgs)
+ passed back to the "click" event handler is the
+ MenuItem instance that was the target of the
+ "click" event.
+ */
+
+ var oItem = p_aArgs[1], // The MenuItem that was clicked
+ oTarget = this.contextEventTarget,
+ oLI;
+
+
+ if (oItem) {
+
+ oLI = oTarget.className ==
"contextMenu" ?
+ oTarget :
YAHOO.util.Dom.getAncestorByClassName(oTarget, "contextMenu");
+
+
+ switch (oItem.index) {
+
+ case 0: // delete
+
+ deleteMedia(oLI);
+
+ break;
+
+
+ case 1: // create post
+
+ createPost();
+
+ break;
+
+
+ case 2: // include in gallery
+
+ includeMedia();
+
+ break;
+
+ }
+
+ }
+
+ }
+
+
+ /*
+ Array of text labels for the MenuItem instances to be
+ added to the ContextMenu instanc.
+ */
+
+ var aMenuItems = ["Delete", "Create Post", "Include in
Gallery" ];
+
+
+ /*
+ Instantiate a ContextMenu: The first
argument passed to the constructor
+ is the id for the Menu element to be
created, the second is an
+ object literal of configuration
properties.
+ */
+
+ var oEweContextMenu = new YAHOO.widget.ContextMenu(
+ "ewecontextmenu",
+ {
+ trigger:
oClones.getElementsByClassName("contextMenu"),
+ itemdata: aMenuItems,
+ lazyload: true
+ }
+ );
+
+
+ // "render" event handler for the ewe context menu
+
+ function onContextMenuRender(p_sType, p_aArgs) {
+
+ // Add a "click" event handler to the ewe context menu
+
+ this.subscribe("click", onEweContextMenuClick);
+
+ }
+
+
+ // Add a "render" event handler to the ewe context menu
+
+ oEweContextMenu.subscribe("render", onContextMenuRender);
+
+
+ });
+YAHOO.example = function() {
+ var $D = YAHOO.util.Dom;
+ var $E = YAHOO.util.Event;
+ return {
+ init : function() {
+ var overlay_img = new
YAHOO.widget.Overlay("overlay_img", { fixedcenter:true,
+
visible:false,
+
width:"577px",height:"487px"
+
});
+ overlay_img.render();
+ var overlay =
document.createElement('div');
+ overlay.id = 'overlay';
+
+ // Assign 100% height and width
+ overlay.style.width = '100%';
+ overlay.style.height = '100%';
+
+
document.getElementsByTagName('body')[0].appendChild(overlay);
+ overlay.style.display = 'none';
+ }
+ };
+
+ }();
+
+ YAHOO.util.Event.addListener(window, "load",
YAHOO.example.init);
+
+</script>
+
+
<%-- JavaScript for media file search page--%>
<script type="text/javascript">
<!--
@@ -65,6 +258,37 @@
document.mediaFileSearchForm["bean.pageNum"].value =
parseInt(document.mediaFileSearchForm["bean.pageNum"].value) - 1;
document.mediaFileSearchForm.submit();
}
+function onClose()
+{
+ document.getElementById('overlay').style.display = 'none';
+ document.getElementById('overlay_img').style.visibility = 'hidden';
+}
+function onClickEdit(mediaFileId)
+{
+
+ document.getElementById("overlay_img").style.visibility = "visible";
+ document.getElementById('overlay').style.display = 'block';
+
+ var frame = document.createElement('iframe');
+ frame.setAttribute("id","myframe");
+ frame.setAttribute("frameborder","no");
+ frame.setAttribute("scrolling","auto");
+
+ frame.setAttribute('src','<s:url
action="mediaFileEdit"><s:param name="weblog" value="%{actionWeblog.handle}"
/></s:url>&mediaFileId='+mediaFileId );
+ frame.style.width="100%";
+ frame.style.height="100%";
+ //var mystring="<s:url
action='mediaFileEdit'><s:param name='weblog' value='%{actionWeblog.handle}'
/></s:url>&mediaFileId="+mediaFileId;
+
+ //var innerstring = "<iframe
id='myframe' frameborder='no' scrolling='auto' src="+mystring+" width='100%'
height='100%'></iframe>";
+
+
+ document.getElementById("overlay_img").innerHTML = '<div ><a href="#"
class="container-close" onclick="onClose()"></a></div>';
+
+ document.getElementById("overlay_img").appendChild(frame);
+
+
+}
+
-->
</script>
@@ -75,7 +299,7 @@
<s:form id="mediaFileSearchForm" name="mediaFileSearchForm"
action="mediaFileSearch!search" onsubmit="editorCleanup()">
<s:hidden name="weblog" />
<input type="hidden" name="mediaFileId" value="" />
- <table class="mediaFileSearchTable" cellpadding="0" cellspacing="0"
width="100%">
+ <table class="mediaFileSearchTable" cellpadding="0" cellspacing="3"
width="100%">
<tr>
<td>
<label for="name">Name</label>
@@ -94,12 +318,12 @@
<td>
<label for="size">Size</label>
</td>
- <td>
+ <td width="80%">
<s:select name="bean.sizeFilterType" list="sizeFilterTypes"
listKey="key" listValue="value" />
- <s:textfield name="bean.size" size="10" maxlength="15" />
+ <s:textfield name="bean.size" size="3" maxlength="10" />
<s:select name="bean.sizeUnit" list="sizeUnits" listKey="key"
listValue="value" />
</td>
- <td>
+ <td width="10%">
<label for="tags">Tags</label>
</td>
<td>
@@ -115,6 +339,9 @@
<td> </td>
</tr>
</table>
+ <div id="overlay_img" style="visibility:hidden">
+
+</div>
<div class="control">
<span style="padding-left:20px">Sort by:</span>
@@ -132,18 +359,26 @@
<%-- ==================================================================
--%>
<%-- Title, category, dates and other metadata --%>
- <ul style="margin-top:10px">
+ <ul id = "myMenu" style="margin-top:10px">
<s:iterator id="mediaFile" value="pager.items">
- <li class="mediaFileSearchResult">
- <img border="0" src='<s:url
value="/roller-ui/rendering/media-resources/%{#mediaFile.id}" />' width="120px"
alt="mediaFolder.png"/><br/>
- <input type="checkbox" name="selectedMediaFiles" value="<s:property
value="#mediaFile.id"/>" style="float:left;clear:left"/>
- <label><s:property value="#mediaFile.name" /></label>
- <label><s:property value="#mediaFile.path" /></label>
- <a href='<s:url action="mediaFileEdit"><s:param name="mediaFileId"
value="%{#mediaFile.id}" /><s:param name="weblog"
value="%{actionWeblog.handle}" /></s:url>'>Edit</a>
- <a href="#" onclick="onDelete('<s:property value="#mediaFile.id"
/>')">Delete</a>
- <a href="#" onclick="onIncludeInGallery('<s:property
value="#mediaFile.id" />')">Include in gallery</a>
- </li>
+ <li class="align-images">
+ <img style="border:1px solid #000000;margin:5px;" border="0"
src='<s:url value="/roller-ui/rendering/media-resources/%{#mediaFile.id}" />'
width="120px" height="100px" alt="mediaFolder.png"/><br/>
+ <div
style="clear:left;width:130px;margin-left:5px;"><label><s:property
+value="#mediaFile.name" /></label>
+<div style="padding-top:5px;"> <!-- one -->
+ <input style="float:left;" type="checkbox" name="selectedMediaFiles"
value="<s:property
+value="#mediaFile.id"/>"/>
+ <INPUT TYPE="hidden" id="mediafileidentity" value="<s:property
value='#mediaFile.id'/>">
+
+<div style="float:right;">
+ <a href="#" id="<s:property value='#mediaFile.id'/>"
onclick="onClickEdit(this.id)">Edit</a>
+
+<a class="contextMenu" href="#">More...</a>
+</div>
+</div> <!-- one -->
+ </div>
+ </li>
</s:iterator>
</ul>
@@ -161,6 +396,7 @@
+
<%-- ==================================================================
--%>
<%-- Weblog edit or preview --%>
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileView.jsp
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileView.jsp?rev=766565&r1=766564&r2=766565&view=diff
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileView.jsp
(original)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/editor/MediaFileView.jsp
Mon Apr 20 03:10:00 2009
@@ -16,22 +16,209 @@
directory of this distribution.
--%>
<%@ include file="/WEB-INF/jsps/taglibs-struts2.jsp" %>
+<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/combo?2.6.0/build/reset-fonts-grids/reset-fonts-grids.css&2.6.0/build/menu/assets/skins/sam/menu.css";>
+<!-- Combo-handled YUI JS files: -->
+<script type="text/javascript"
src="http://yui.yahooapis.com/combo?2.6.0/build/yahoo-dom-event/yahoo-dom-event.js&2.6.0/build/animation/animation-min.js&2.6.0/build/container/container_core-min.js&2.6.0/build/menu/menu-min.js";></script>
+<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.6.0/build/fonts/fonts-min.css"; />
+<link rel="stylesheet" type="text/css"
+href="http://yui.yahooapis.com/2.6.0/build/container/assets/skins/sam/container.css";
/>
+
+<script type="text/javascript"
src="http://yui.yahooapis.com/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js";></script>
+<script type="text/javascript"
+src="http://yui.yahooapis.com/2.6.0/build/container/container-min.js";></script>
+
+<style>
+/*margin and padding on body element
+ can introduce errors in determining
+ element position and are not recommended;
+ we turn them off as a foundation for YUI
+ CSS treatments. */
+ body {
+ margin:0;
+ padding:0;
+ text-align:left;
+ }
+ h1 {
+ font-size:20px;
+ font-weight:bold;
+ }
+
+ .yui-overlay {
+ position:fixed;
+ background: #ffffff;
+ z-index: 112;
+ color:#000000;
+ border: 4px solid #525252;
+ text-align:left;
+ top: 50%;
+ left: 50%;
+ }
+
+
+</style>
+<script type="text/javascript">
+YAHOO.util.Event.onContentReady("myMenu", function () {
+
+
+ var oClones = this;
+
+
+ function deleteMedia(p_oLI) {
+
+ var oUL =
YAHOO.util.Dom.getAncestorByTagName(p_oLI, "LI");
+
+
+ var myparent = oUL.parentNode;
+
+
+ var hidden_mediaFileId =
document.getElementById("mediafileidentity");
+ var hidden_mediaFileId_value = hidden_mediaFileId.value;
+ myparent.removeChild(oUL);
+
document.mediaFileViewForm.mediaFileId.value=hidden_mediaFileId_value;
+ document.mediaFileViewForm.action='<s:url
action="mediaFileView!delete" />';
+ document.mediaFileViewForm.submit();
+
+
+ }
+
+
+ function createPost() {
+
+
+ }
+
+
+ function includeMedia() {
+ var hidden_mediaFileId =
document.getElementById("mediafileidentity");
+ var hidden_mediaFileId_value = hidden_mediaFileId.value;
+
document.mediaFileViewForm.mediaFileId.value=hidden_mediaFileId_value;
+ document.mediaFileViewForm.action='<s:url
action="mediaFileView!includeInGallery" />';
+ document.mediaFileViewForm.submit();
+
+ }
+
+
+
+ function onEweContextMenuClick(p_sType, p_aArgs) {
+
+ /*
+ The second item in the arguments array (p_aArgs)
+ passed back to the "click" event handler is the
+ MenuItem instance that was the target of the
+ "click" event.
+ */
+
+ var oItem = p_aArgs[1], // The MenuItem that was clicked
+ oTarget = this.contextEventTarget,
+ oLI;
+
+
+ if (oItem) {
+
+ oLI = oTarget.className ==
"contextMenu" ?
+ oTarget :
YAHOO.util.Dom.getAncestorByClassName(oTarget, "contextMenu");
+
+
+ switch (oItem.index) {
+
+ case 0: // delete
+
+ deleteMedia(oLI);
+
+ break;
+
+
+ case 1: // create post
+
+ createPost();
+
+ break;
+
+
+ case 2: // include in gallery
+
+ includeMedia();
+
+ break;
+
+ }
+
+ }
+
+ }
+
+
+ /*
+ Array of text labels for the MenuItem instances to be
+ added to the ContextMenu instanc.
+ */
+
+ var aMenuItems = ["Delete", "Create Post", "Include in
Gallery" ];
+
+
+ /*
+ Instantiate a ContextMenu: The first
argument passed to the constructor
+ is the id for the Menu element to be
created, the second is an
+ object literal of configuration
properties.
+ */
+
+ var oEweContextMenu = new YAHOO.widget.ContextMenu(
+ "ewecontextmenu",
+ {
+ trigger:
oClones.getElementsByClassName("contextMenu"),
+ itemdata: aMenuItems,
+ lazyload: true
+ }
+ );
+
+
+ // "render" event handler for the ewe context menu
+
+ function onContextMenuRender(p_sType, p_aArgs) {
+
+ // Add a "click" event handler to the ewe context menu
+
+ this.subscribe("click", onEweContextMenuClick);
+
+ }
+
+
+ // Add a "render" event handler to the ewe context menu
+
+ oEweContextMenu.subscribe("render", onContextMenuRender);
+
+
+ });
+
+ YAHOO.example = function() {
+ var $D = YAHOO.util.Dom;
+ var $E = YAHOO.util.Event;
+ return {
+ init : function() {
+ var overlay_img = new
YAHOO.widget.Overlay("overlay_img", { fixedcenter:true,
+
visible:false,
+
width:"569px",height:"465px"
+
});
+ overlay_img.render();
+ var overlay =
document.createElement('div');
+ overlay.id = 'overlay';
+
+ // Assign 100% height and width
+ overlay.style.width = '100%';
+ overlay.style.height = '100%';
+
+
document.getElementsByTagName('body')[0].appendChild(overlay);
+ overlay.style.display = 'none';
+ }
+ };
+
+ }();
+ YAHOO.util.Event.addListener(window, "load",
YAHOO.example.init);
+
+</script>
<script type="text/javascript">
<!--
-function onDelete(id)
-{
- document.mediaFileViewForm.mediaFileId.value=id;
- document.mediaFileViewForm.action='<s:url action="mediaFileView!delete"
/>';
- document.mediaFileViewForm.submit();
-}
-
-function onIncludeInGallery(id)
-{
- document.mediaFileViewForm.mediaFileId.value=id;
- document.mediaFileViewForm.action='<s:url
action="mediaFileView!includeInGallery" />';
- document.mediaFileViewForm.submit();
-}
function onSelectDirectory(id) {
document.mediaFileViewForm.directoryId.value = id;
@@ -40,14 +227,16 @@
function onCreateDirectory()
{
- document.mediaFileViewForm.action='<s:url
action="mediaFileView!createNewDirectory" />';
+ document.mediaFileViewForm.action='<s:url
+action="mediaFileView!createNewDirectory" />';
document.mediaFileViewForm.submit();
}
function onDeleteSelected()
{
if ( confirm("<s:text name='mediaFile.delete.confirm' />") ) {
- document.mediaFileViewForm.action='<s:url
action="mediaFileView!deleteSelected" />';
+ document.mediaFileViewForm.action='<s:url
+action="mediaFileView!deleteSelected" />';
document.mediaFileViewForm.submit();
}
}
@@ -55,10 +244,41 @@
function onMoveSelected()
{
if ( confirm("<s:text name='mediaFile.move.confirm' />") ) {
- document.mediaFileViewForm.action='<s:url
action="mediaFileView!moveSelected" />';
+ document.mediaFileViewForm.action='<s:url
+action="mediaFileView!moveSelected" />';
document.mediaFileViewForm.submit();
}
}
+function onClose()
+{
+ document.getElementById('overlay').style.display = 'none';
+ document.getElementById('overlay_img').style.visibility = 'hidden';
+}
+function onClickEdit(mediaFileId)
+{
+
+ document.getElementById("overlay_img").style.visibility = "visible";
+ document.getElementById('overlay').style.display = 'block';
+
+ var frame = document.createElement('iframe');
+ frame.setAttribute("id","myframe");
+ frame.setAttribute("frameborder","no");
+ frame.setAttribute("scrolling","auto");
+
+ frame.setAttribute('src','<s:url
action="mediaFileEdit"><s:param name="weblog" value="%{actionWeblog.handle}"
/></s:url>&mediaFileId='+mediaFileId );
+ frame.style.width="100%";
+ frame.style.height="100%";
+ var mystring="<s:url
action='mediaFileEdit'><s:param name='weblog' value='%{actionWeblog.handle}'
/></s:url>&mediaFileId="+mediaFileId;
+
+ var innerstring = "<iframe id='myframe'
frameborder='no' scrolling='auto' src="+mystring+" width='100%'
height='100%'></iframe>";
+
+
+ document.getElementById("overlay_img").innerHTML = '<div ><a href="#"
class="container-close" onclick="onClose()"></a></div>';
+
+ document.getElementById("overlay_img").appendChild(frame);
+
+
+}
-->
</script>
@@ -72,18 +292,22 @@
<s:param name="directoryPath" value="#directory.key" />
<s:param name="weblog" value="%{actionWeblog.handle}" />
</s:url>
- <s:a href="%{getDirectoryByPathUrl}"><s:property value="#directory.value"
/></s:a> /
+ <s:a href="%{getDirectoryByPathUrl}"><s:property value="#directory.value"
+/></s:a> /
</s:iterator>
</p>
-<s:form id="mediaFileViewForm" name="mediaFileViewForm" action="mediaFileView"
onsubmit="editorCleanup()">
+<s:form id="mediaFileViewForm" name="mediaFileViewForm" action="mediaFileView"
+onsubmit="editorCleanup()">
<s:url id="mediaFileHierarchicalViewURL" action="mediaFileHierarchicalView">
<s:param name="weblog" value="%{actionWeblog.handle}" />
</s:url>
-<p><span style="font-weight:bold">Tabular</span> | <s:a
href="%{mediaFileHierarchicalViewURL}">Hierarchical</s:a></p>
+<p><span style="font-weight:bold">Tabular</span> | <s:a
+href="%{mediaFileHierarchicalViewURL}">Hierarchical</s:a></p>
<div class="control">
<span style="padding-left:20px">Sort by:</span>
- <s:select name="sortBy" list="sortOptions" listKey="key" listValue="value"
onchange="document.mediaFileViewForm.submit();" />
+ <s:select name="sortBy" list="sortOptions" listKey="key" listValue="value"
+onchange="document.mediaFileViewForm.submit();" />
</span>
</div>
@@ -94,41 +318,69 @@
<%-- ==================================================================
--%>
<%-- Title, category, dates and other metadata --%>
- <div style="margin-top:10px">
- <ul>
+ <div width="720px" height="500px">
+ <ul id = "myMenu">
<s:iterator id="directory" value="childDirectories">
- <li>
- <img border="0" src='<s:url value="/images/folder.png"/>'
style="cursor:pointer;width:120px;height:100px" alt="mediaFolder.png"
onclick="onSelectDirectory('<s:property value="#directory.id"/>')"/>
- <label><s:property value="#directory.name" /></label>
+ <li class="align-images" >
+ <img border="0" src='<s:url value="/images/folder.png"/>'
+class="dir-image" alt="mediaFolder.png"
+onclick="onSelectDirectory('<s:property value="#directory.id"/>')"/>
+ <div style="clear:left;width:130px;margin-left:10px;"><label><s:property
+value="#directory.name" /></label>
+ <input type="checkbox" name="selectedMediaFiles" value="<s:property
+value="#directory.id"/>"/>
+ </div>
</li>
</s:iterator>
+
<s:iterator id="mediaFile" value="childFiles">
- <li>
+ <li class="align-images" >
<s:if test="#mediaFile.imageFile">
- <s:url id="mediaFileURL"
value="/roller-ui/rendering/media-resources/%{#mediaFile.id}"></s:url>
+ <s:url id="mediaFileURL"
+value="/roller-ui/rendering/media-resources/%{#mediaFile.id}"></s:url>
</s:if>
<s:else>
<s:url id="mediaFileURL" value="/images/page.png"></s:url>
</s:else>
- <img border="0" src='<s:property value="%{mediaFileURL}" />'
width="120px" />
- <label><s:property value="#mediaFile.name" /></label>
- <input type="checkbox" name="selectedMediaFiles" value="<s:property
value="#mediaFile.id"/>" style="float:left;clear:left"/>
- <a href='<s:url action="mediaFileEdit"><s:param name="mediaFileId"
value="%{#mediaFile.id}" /><s:param name="weblog"
value="%{actionWeblog.handle}" /></s:url>'>Edit</a>
- <a href="#" onclick="onDelete('<s:property value="#mediaFile.id"
/>')">Delete</a>
- <a href="#" onclick="onIncludeInGallery('<s:property
value="#mediaFile.id" />')">Include in gallery</a>
+ <img style="border:1px solid #000000;margin:5px;" border="0"
+src='<s:property value="%{mediaFileURL}" />' width="120px" height="100px"/>
+ <div style="clear:left;width:130px;margin-left:5px;"><label><s:property
+value="#mediaFile.name" /></label>
+<div style="padding-top:5px;"> <!-- one -->
+ <input style="float:left;" type="checkbox" name="selectedMediaFiles"
value="<s:property
+value="#mediaFile.id"/>"/>
+ <INPUT TYPE="hidden" id="mediafileidentity" value="<s:property
value='#mediaFile.id'/>">
+ <%-- <a href='<s:url action="mediaFileEdit"><s:param name="mediaFileId"
+value="%{#mediaFile.id}" /><s:param name="weblog"
value="%{actionWeblog.handle}"
+/></s:url>'>Edit</a>--%>
+ <%--<a href="#" id="show">Edit</a>--%>
+<%-- <INPUT TYPE="hidden" NAME="mediafileidentity"
value="%{#mediaFile.id}">--%>
+
+<%-- <INPUT TYPE="hidden" NAME="mediahandle"
value="%{actionWeblog.handle}">--%>
+<div style="float:right;">
+ <a href="#" id="<s:property value='#mediaFile.id'/>"
onclick="onClickEdit(this.id)">Edit</a>
+ <!-- <div id="<s:property value='#mediaFile.id'/>abc" ><a href="#"
id="<s:property value='#mediaFile.id'/>abcabc"
onclick="onRightClickEdit(this.id)">More...</a></div>-->
+<a class="contextMenu" href="#">More...</a>
+</div>
+</div> <!-- one -->
+ </div>
</li>
</s:iterator>
</ul>
</div>
-<div style="margin-left:320px">
-New Directory:
-<input type="text" name="newDirectoryName" size="30" />
+<div style="margin-left:320px;clear:left;">
+New Directory Name:
+<input style="margin-top:5px;margin-bottom:5px;" type="text"
+name="newDirectoryName" size="30" />
<input type="button" value="Create" onclick="onCreateDirectory()" />
</div>
+<div id="overlay_img" style="visibility:hidden">
+
+</div>
@@ -156,10 +408,13 @@
<br/>
<div class="control">
- <input type="button" style="padding-left:20px" value="Delete Selected"
onclick="onDeleteSelected()" />
- <input type="button" style="padding-left:20px" value="Move Selected"
onclick="onMoveSelected()" />
+ <input type="button" style="padding-left:20px" value="Delete Selected"
+onclick="onDeleteSelected()" />
+ <input type="button" style="padding-left:20px" value="Move Selected"
+onclick="onMoveSelected()" />
<span style="padding-left:20px">
- <s:select name="selectedDirectory" list="allDirectories" listKey="id"
listValue="path" />
+ <s:select name="selectedDirectory" list="allDirectories" listKey="id"
+listValue="path" />
</span>
</div>
Added:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/tiles/tiles-popuppage.jsp
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/tiles/tiles-popuppage.jsp?rev=766565&view=auto
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/tiles/tiles-popuppage.jsp
(added)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/jsps/tiles/tiles-popuppage.jsp
Mon Apr 20 03:10:00 2009
@@ -0,0 +1,56 @@
+<%--
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. The ASF licenses this file to You
+ under the Apache License, Version 2.0 (the "License"); you may not
+ use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License. For additional information regarding
+ copyright in this work, please see the NOTICE file in the top level
+ directory of this distribution.
+--%>
+<%@ include file="/WEB-INF/jsps/taglibs-struts2.jsp" %>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
+<html xmlns="http://www.w3.org/1999/xhtml";>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <tiles:insertAttribute name="head" />
+ <style type="text/css">
+ <tiles:insertAttribute name="styles" />
+ </style>
+ </head>
+
+ <body>
+
+
+
+ <div id="wrapper">
+ <div id="leftcontent_wrap">
+ <div id="leftcontent">
+ </div>
+ </div>
+
+ <div id="centercontent_wrap">
+ <div id="centercontent">
+ <tiles:insertAttribute name="messages" />
+ <tiles:insertAttribute name="content" />
+ </div>
+ </div>
+
+ <div id="rightcontent_wrap">
+ <div id="rightcontent">
+ </div>
+ </div>
+ </div>
+
+
+
+
+ </body>
+</html>
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/tiles.xml
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/tiles.xml?rev=766565&r1=766564&r2=766565&view=diff
==============================================================================
--- roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/tiles.xml
(original)
+++ roller/branches/roller_mediablogging/apps/weblogger/web/WEB-INF/tiles.xml
Mon Apr 20 03:10:00 2009
@@ -68,6 +68,17 @@
<put-attribute name="footer"
value="/WEB-INF/jsps/tiles/footer.jsp" />
</definition>
+ <definition name=".tiles-popuppage"
template="/WEB-INF/jsps/tiles/tiles-popuppage.jsp">
+
+ <put-attribute name="messages"
value="/WEB-INF/jsps/tiles/messages.jsp" />
+ <put-attribute name="content" value="${content}" />
+
+ </definition>
+ <definition name=".tiles-popuppage-only-content"
template="/WEB-INF/jsps/tiles/tiles-popuppage.jsp">
+
+ <put-attribute name="content" value="${content}" />
+
+ </definition>
<!-- error pages -->
<definition name=".denied" extends=".tiles-errorpage" >
@@ -209,13 +220,32 @@
<put-attribute name="styles"
value="/WEB-INF/jsps/tiles/css-sidebar.jsp" />
</definition>
- <definition name=".MediaFileEdit" extends=".tiles-tabbedpage" >
+ <definition name=".MediaFileEdit" extends=".tiles-popuppage" >
<put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
<put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileEdit.jsp" />
- <put-attribute name="sidebar"
value="/WEB-INF/jsps/editor/MediaFileSidebar.jsp" />
- <put-attribute name="styles"
value="/WEB-INF/jsps/tiles/css-sidebar.jsp" />
</definition>
+ <definition name=".MediaFileAddExternalInclude"
extends=".tiles-popuppage-only-content" >
+ <put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
+ <put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileAddExternalInclude.jsp" />
+ </definition>
+
+ <definition name=".MediaFileSearchInclude" extends=".tiles-popuppage" >
+ <put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
+ <put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileSearch.jsp" />
+ </definition>
+
+ <definition name=".MediaFileAddInclude" extends=".tiles-popuppage" >
+ <put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
+ <put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileAdd.jsp" />
+ </definition>
+
+ <definition name=".MediaFileAddSuccessInclude"
extends=".tiles-popuppage" >
+ <put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
+ <put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileAddSuccess.jsp" />
+ </definition>
+
+
<definition name=".MediaFileView" extends=".tiles-tabbedpage" >
<put-attribute name="head" value="/WEB-INF/jsps/tiles/head-ajax.jsp" />
<put-attribute name="content"
value="/WEB-INF/jsps/editor/MediaFileView.jsp" />
Modified:
roller/branches/roller_mediablogging/apps/weblogger/web/roller-ui/styles/roller.css
URL:
http://svn.apache.org/viewvc/roller/branches/roller_mediablogging/apps/weblogger/web/roller-ui/styles/roller.css?rev=766565&r1=766564&r2=766565&view=diff
==============================================================================
---
roller/branches/roller_mediablogging/apps/weblogger/web/roller-ui/styles/roller.css
(original)
+++
roller/branches/roller_mediablogging/apps/weblogger/web/roller-ui/styles/roller.css
Mon Apr 20 03:10:00 2009
@@ -755,3 +755,73 @@
margin-left: auto;
margin-right: auto;
}
+
+/* ----------------------------------------------------------------------
+Media File styles
+---------------------------------------------------------------------- */
+/*** for overlay ***/
+.yui-overlay span, #close {
+ float: left;
+ }
+
+ #close { float: right; }
+
+ #overlay {
+ position: fixed;
+ z-index:100;
+ top: 0px;
+ left: 0px;
+ height:100%;
+ width:100%;
+ display: none;
+ background-color:#000;
+ filter:alpha(opacity=25);
+ -moz-opacity: 0.25;
+ opacity: 0.25;
+ }
+
+ .container-close {
+ position:absolute;
+ top:2px;
+ right:4px;
+ z-index:6;
+ height:12px;
+ width:12px;
+ margin:0px;
+ padding:0px;
+
background:url(http://yui.yahooapis.com/2.6.0/build/container/assets/close12_1.gif)
no-repeat;
+ cursor:pointer;
+ }
+
+ .align-images {
+ display:inline;
+ float:left;
+ margin:5px;
+ list-style-type:none;
+ }
+
+ .dir-image {
+ cursor:pointer;
+ width:120px;
+ height:100px;
+ }
+
+ /*** For context menu ***/
+
+ #menu h1 {
+ line-height:120%;
+ margin:15px 0px;
+ }
+ #ewecontextmenu {
+ background-color:#CECECE;
+ border:1px solid #808080;
+ line-height:1.5;
+ }
+
+ #ewecontextmenu li a {
+ text-decoration:none;
+ color: #000000;
+ }
+
+ #ewecontextmenu .yuimenuitem-selected{background-color:#36404C;}
+ #ewecontextmenu .yuimenuitem-selected a {color:#ffffff;}
