Skip to content

Instantly share code, notes, and snippets.

@perlDreamer
Created October 26, 2009 22:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save perlDreamer/219097 to your computer and use it in GitHub Desktop.
Save perlDreamer/219097 to your computer and use it in GitHub Desktop.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="http://yui.yahooapis.com/2.8.0r4/build/menu/assets/skins/sam/menu.css" rel="stylesheet" type="text/css" />
<!--CSS file (default YUI Sam Skin) -->
<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/2.8.0r4/build/datatable/assets/skins/sam/datatable.css">
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/event/event-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/element/element-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/datasource/datasource-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/paginator/paginator-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/json/json-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/connection/connection-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/datatable/datatable-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/container/container-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.8.0r4/build/menu/menu-min.js"></script>
<script type="text/javascript">
if ( typeof WebGUI == "undefined" ) {
WebGUI = {};
}
if ( typeof WebGUI.AssetManager == "undefined" ) {
WebGUI.AssetManager = {};
}
WebGUI.AssetManager.CrumbMoreMenu;
WebGUI.AssetManager.MoreMenuItems = [
{ url: '<url>;1', label: 'one' },
{ url: '<url>;2', label: 'two' },
{ url: '<url>;3', label: 'three' },
{ url: '<url>;4', label: 'four' }
];
WebGUI.AssetManager.appendToUrl = function ( url, params ) {
var components = [ url ];
if (url.match(/\?/)) {
components.push(";");
}
else {
components.push("?");
}
components.push(params);
return components.join('');
}
WebGUI.AssetManager.moreMenuToggle = function(e, menu) {
YAHOO.util.Event.stopEvent(e);
menu.show();
menu.focus();
}
/*---------------------------------------------------------------------------
WebGUI.AssetManager.addHighlightToRow ( child )
Highlight the row containing this element by adding to it the "highlight"
class
*/
WebGUI.AssetManager.addHighlightToRow
= function ( child ) {
var row = WebGUI.AssetManager.findRow( child );
if ( !YAHOO.util.Dom.hasClass( row, "highlight" ) ) {
YAHOO.util.Dom.addClass( row, "highlight" );
}
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.buildMoreMenu ( url, linkElement )
Build a WebGUI style "More" menu for the asset referred to by url
*/
WebGUI.AssetManager.buildMoreMenu
= function ( url, linkElement, isNotLocked ) {
// Build a more menu
var rawItems = WebGUI.AssetManager.MoreMenuItems;
var menuItems = [];
var isLocked = !isNotLocked;
for ( var i = 0; i < rawItems.length; i++ ) {
var itemUrl = rawItems[i].url.match( /<url>/ )
? rawItems[i].url.replace( /<url>(?:\?(.*))?/, WebGUI.AssetManager.appendToUrl(url, "$1") )
: url + rawItems[i].url
;
if (! (itemUrl.match( /func=edit;/) && isLocked )) {
menuItems.push( { "url" : itemUrl, "text" : rawItems[i].label } );
}
}
var options = {
"zindex" : 1000,
"clicktohide" : true,
"position" : "dynamic",
"context" : [ linkElement, "tl", "bl" ],
"itemdata" : menuItems
};
return options;
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.findRow ( child )
Find the row that contains this child element.
*/
WebGUI.AssetManager.findRow
= function ( child ) {
var node = child;
while ( node ) {
if ( node.tagName == "TR" ) {
return node;
}
node = node.parentNode;
}
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatActions ( )
Format the Edit and More links for the row
*/
WebGUI.AssetManager.formatActions = function ( elCell, oRecord, oColumn, orderNumber ) {
if ( oRecord.getData( 'actions' ) ) {
elCell.innerHTML = 'Edit | ';
}
else {
elCell.innerHTML = "";
}
var more = document.createElement( 'a' );
elCell.appendChild( more );
more.appendChild( document.createTextNode( 'More' ) );
more.href = '#';
// Delete the old menu
if ( document.getElementById( 'moreMenu' + oRecord.getData( 'assetId' ) ) ) {
var oldMenu = document.getElementById( 'moreMenu' + oRecord.getData( 'assetId' ) );
oldMenu.parentNode.removeChild( oldMenu );
}
var options = WebGUI.AssetManager.buildMoreMenu(oRecord.getData( 'url' ), more, oRecord.getData( 'actions' ));
var menu = new YAHOO.widget.Menu( "moreMenu" + oRecord.getData( 'assetId' ), options );
YAHOO.util.Event.onDOMReady( function () { menu.render( document.getElementById( 'assetManager' ) ) } );
YAHOO.util.Event.addListener( more, "click", function (e) { YAHOO.util.Event.stopEvent(e); menu.show(); menu.focus(); }, null, menu );
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatAssetIdCheckbox ( )
Format the checkbox for the asset ID.
*/
WebGUI.AssetManager.formatAssetIdCheckbox = function ( elCell, oRecord, oColumn, orderNumber ) {
elCell.innerHTML = '<input type="checkbox" name="assetId" value="' + oRecord.getData("assetId") + '"';
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatAssetSize ( )
Format the asset class name
*/
WebGUI.AssetManager.formatAssetSize = function ( elCell, oRecord, oColumn, orderNumber ) {
elCell.innerHTML = oRecord.getData( "assetSize" );
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatClassName ( )
Format the asset class name
*/
WebGUI.AssetManager.formatClassName = function ( elCell, oRecord, oColumn, orderNumber ) {
elCell.innerHTML = '<img src="' + oRecord.getData( 'icon' ) + '" /> '
+ oRecord.getData( "className" );
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatLockedBy ( )
Format the asset class name
*/
WebGUI.AssetManager.formatLockedBy = function ( elCell, oRecord, oColumn, orderNumber ) {
elCell.innerHTML
= oRecord.getData( 'lockedBy' )
? 'Locked'
: 'Unlocked'
;
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatRank ( )
Format the input for the rank box
*/
WebGUI.AssetManager.formatRank = function ( elCell, oRecord, oColumn, orderNumber ) {
var rank = oRecord.getData("lineage").match(/[1-9][0-9]{0,5}$/);
elCell.innerHTML = '<input type="text" name="' + oRecord.getData("assetId") + '_rank" '
+ 'value="' + rank + '" size="3" />'
;
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.DefaultSortedBy ( )
*/
WebGUI.AssetManager.DefaultSortedBy = {
"key" : "lineage",
"dir" : YAHOO.widget.DataTable.CLASS_ASC
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatRevisionDate ( )
Format the asset class name
*/
WebGUI.AssetManager.formatRevisionDate = function ( elCell, oRecord, oColumn, orderNumber ) {
var revisionDate = new Date( oRecord.getData( "revisionDate" ) * 1000 );
var minutes = revisionDate.getMinutes();
if (minutes < 10)
minutes = "0" + minutes;
elCell.innerHTML = revisionDate.getFullYear() + '-' + ( revisionDate.getMonth() + 1 )
+ '-' + revisionDate.getDate() + ' ' + ( revisionDate.getHours() )
+ ':' + minutes
;
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.formatTitle ( )
Format the link for the title
*/
WebGUI.AssetManager.formatTitle = function ( elCell, oRecord, oColumn, orderNumber ) {
elCell.innerHTML = '<span class="hasChildren">'
+ ( oRecord.getData( 'childCount' ) > 0 ? "+" : "&nbsp;" )
+ '</span> <a href="' + WebGUI.AssetManager.appendToUrl(oRecord.getData( 'url' ), 'op=assetManager;method=manage') + '">'
+ oRecord.getData( 'title' )
+ '</a>'
;
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.initManager ( )
Initialize the i18n interface DISABLED
*/
WebGUI.AssetManager.initManager = function (o) {
WebGUI.AssetManager.initDataTable();
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.initDataTable ( )
Initialize the www_manage page
*/
WebGUI.AssetManager.initDataTable = function (o) {
// initialize the data source
WebGUI.AssetManager.DataSource
= new YAHOO.util.LocalDataSource({"assets":[{"icon":"/extras/assets/small/navigation.gif","actions":1,"assetSize":"364","childCount":"0","lockedBy":"","lineage":"000001000002000006000001","className":"Navigation","assetId":"pJd5TLAjfWMVXD6sCRLwUg","url":"/site_map/site_map","revisionDate":"1124395696","title":"Site Map"}],"sort":null,"dir":"","totalAssets":1});
WebGUI.AssetManager.DataSource.responseType
= YAHOO.util.DataSource.TYPE_JSON;
WebGUI.AssetManager.DataSource.responseSchema
= {
resultsList: 'assets',
fields: [
{ key: 'assetId' },
{ key: 'lineage' },
{ key: 'actions' },
{ key: 'title' },
{ key: 'className' },
{ key: 'revisionDate' },
{ key: 'assetSize' },
{ key: 'lockedBy' },
{ key: 'icon' },
{ key: 'url' },
{ key: 'childCount' }
],
metaFields: {
totalRecords: "totalAssets" // Access to value in the server response
}
};
WebGUI.AssetManager.ColumnDefs
= [
{ key: 'assetId', label: 'select all', formatter: WebGUI.AssetManager.formatAssetIdCheckbox },
{ key: 'lineage', label: 'rank', sortable: true, formatter: WebGUI.AssetManager.formatRank },
{ key: 'actions', label: "", formatter: WebGUI.AssetManager.formatActions },
{ key: 'title', label: "Title", formatter: WebGUI.AssetManager.formatTitle, sortable: true },
{ key: 'className', label: "Type", sortable: true, formatter: WebGUI.AssetManager.formatClassName },
{ key: 'revisionDate', label: "Last Updated", formatter: WebGUI.AssetManager.formatRevisionDate, sortable: true },
{ key: 'assetSize', label: "Size", formatter: WebGUI.AssetManager.formatAssetSize, sortable: true },
{ key: 'lockedBy', label: "Locked", formatter: WebGUI.AssetManager.formatLockedBy }
];
// Initialize the data table
WebGUI.AssetManager.DataTable
= new YAHOO.widget.DataTable( 'dataTableContainer',
WebGUI.AssetManager.ColumnDefs,
WebGUI.AssetManager.DataSource,
{ }
);
WebGUI.AssetManager.DataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
oPayload.totalRecords = oResponse.meta.totalRecords;
return oPayload;
}
};
/*---------------------------------------------------------------------------
WebGUI.AssetManager.showMoreMenu ( url, linkTextId )
Build a More menu for the last element of the Crumb trail
*/
WebGUI.AssetManager.showMoreMenu
= function ( url, linkTextId, isNotLocked ) {
var menu;
if ( typeof WebGUI.AssetManager.CrumbMoreMenu == "undefined" ) {
var more = document.getElementById(linkTextId);
var options = WebGUI.AssetManager.buildMoreMenu(url, more, isNotLocked);
menu = new YAHOO.widget.Menu( "crumbMoreMenu", options );
menu.render( document.getElementById( 'assetManager' ) );
WebGUI.AssetManager.CrumbMoreMenu = menu;
}
else {
menu = WebGUI.AssetManager.CrumbMoreMenu;
}
menu.show();
menu.focus();
};
YAHOO.util.Event.onDOMReady( WebGUI.AssetManager.initManager );
</script>
<body>
<div class="yui-skin-sam" id="assetManager">
<ol id="crumbtrail">
<li><a href="#" onclick="WebGUI.AssetManager.showMoreMenu('/', 'crumbMoreMenuLink', 1); return false;"><span id="crumbMoreMenuLink">Crumb</span></a></li>
</ol>
<div id="dataTableContainer">
</div>
<div id="pagination">
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment