oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

upgraded yui to 2.2.2 and yui-ext to 1.0.1a

Browse source
This commit is contained in:
JT Smith 2007-07-05 04:23:55 +00:00
parent 4d9af2c691
commit 547ced6500
1992 changed files with 645731 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

34
www/extras/yui-ext/examples/view/chooser-example.js vendored Normal file
View file

@ -0,0 +1,34 @@
/*
* Ext JS Library 1.0.1
* Copyright(c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://www.extjs.com/license
*/
Ext.onReady(function(){
var chooser, btn;
function insertImage(data){
Ext.DomHelper.append('images', {
tag: 'img', src: data.url, style:'margin:10px;visibility:hidden;'
}, true).show(true);
btn.getEl().focus();
};
function choose(btn){
if(!chooser){
chooser = new ImageChooser({
url:'get-images.php',
width:515,
height:400
});
}
chooser.show(btn.getEl(), insertImage);
};
btn = new Ext.Button('buttons', {
text: "Insert Image",
handler: choose
});
});

72
www/extras/yui-ext/examples/view/chooser.css Normal file
View file

@ -0,0 +1,72 @@
/*
* Ext JS Library 1.0.1
* Copyright(c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://www.extjs.com/license
*/
.details{
padding: 10px;
text-align: center;
}
.details-info{
border-top: 1px solid #cccccc;
font: 11px Arial, Helvetica, sans-serif;
margin-top: 5px;
padding-top: 5px;
text-align: left;
}
.details-info b{
color: #555555;
display: block;
margin-bottom: 4px;
}
.details-info span{
display: block;
margin-bottom: 5px;
margin-left: 5px;
}
.ychooser-dlg select{
font-size: 12px;
}
.ychooser-view{
background: white;
font: 11px Arial, Helvetica, sans-serif;
overflow: auto;
}
.ychooser-view .thumb{
background: #dddddd;
padding: 3px;
}
.ychooser-view .thumb img{
height: 60px;
width: 80px;
}
.ychooser-view .thumb-wrap{
float: left;
margin: 4px;
margin-right: 0;
padding: 5px;
}
.ychooser-view .thumb-wrap span{
display: block;
overflow: hidden;
text-align: center;
}
.ychooser-view .x-view-selected{
background: #c3daf9;
border: 2px solid #6593cf;
padding: 3px;
}
.ychooser-view .x-view-selected .thumb{
background:transparent;
}
.ychooser-view .loading-indicator {
font-size:11px;
background-image:url('../../resources/images/grid/loading.gif');
background-repeat: no-repeat;
background-position: left;
padding-left:20px;
margin:10px;
}

26
www/extras/yui-ext/examples/view/chooser.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>JsonView Example</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<!-- GC --> <!-- LIBS --> <script type="text/javascript" src="../../adapter/yui/yui-utilities.js"></script> <script type="text/javascript" src="../../adapter/yui/ext-yui-adapter.js"></script> <!-- ENDLIBS -->
<script type="text/javascript" src="../../ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="chooser.css" />
<script type="text/javascript" src="chooser.js"></script>
<script type="text/javascript" src="chooser-example.js"></script>
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../examples.css" />
</head>
<body class="ytheme-gray">
<script type="text/javascript" src="../examples.js"></script><!-- EXAMPLES -->
<h1>JsonView Example</h1>
<p>This example demonstrates how to use some of the advanced features of a JsonView. It also shows how
to use the LayoutDialog and DomHelper.Template classes.</p>
<div id="buttons" style="margin:20px;"></div>
<div id="images" style="margin:20px;width:400px;"></div>
</body>
</html>

204
www/extras/yui-ext/examples/view/chooser.js vendored Normal file
View file

@ -0,0 +1,204 @@
/*
* Ext JS Library 1.0.1
* Copyright(c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://www.extjs.com/license
*/
var ImageChooser = function(config){
// create the dialog from scratch
var dlg = new Ext.LayoutDialog(config.id || Ext.id(), {
autoCreate : true,
minWidth:400,
minHeight:300,
syncHeightBeforeShow: true,
shadow:true,
fixedcenter:true,
center:{autoScroll:false},
east:{split:true,initialSize:150,minSize:150,maxSize:250}
});
dlg.setTitle('Choose an Image');
dlg.getEl().addClass('ychooser-dlg');
dlg.addKeyListener(27, dlg.hide, dlg);
// add some buttons
this.ok = dlg.addButton('OK', this.doCallback, this);
this.ok.disable();
dlg.setDefaultButton(dlg.addButton('Cancel', dlg.hide, dlg));
dlg.on('show', this.load, this);
this.dlg = dlg;
var layout = dlg.getLayout();
// filter/sorting toolbar
this.tb = new Ext.Toolbar(this.dlg.body.createChild({tag:'div'}));
this.sortSelect = Ext.DomHelper.append(this.dlg.body.dom, {
tag:'select', children: [
{tag: 'option', value:'name', selected: 'true', html:'Name'},
{tag: 'option', value:'size', html:'File Size'},
{tag: 'option', value:'lastmod', html:'Last Modified'}
]
}, true);
this.sortSelect.on('change', this.sortImages, this, true);
this.txtFilter = Ext.DomHelper.append(this.dlg.body.dom, {
tag:'input', type:'text', size:'12'}, true);
this.txtFilter.on('focus', function(){this.dom.select();});
this.txtFilter.on('keyup', this.filter, this, {buffer:500});
this.tb.add('Filter:', this.txtFilter.dom, 'separator', 'Sort By:', this.sortSelect.dom);
// add the panels to the layout
layout.beginUpdate();
var vp = layout.add('center', new Ext.ContentPanel(Ext.id(), {
autoCreate : true,
toolbar: this.tb,
fitToFrame:true
}));
var dp = layout.add('east', new Ext.ContentPanel(Ext.id(), {
autoCreate : true,
fitToFrame:true
}));
layout.endUpdate();
var bodyEl = vp.getEl();
bodyEl.appendChild(this.tb.getEl());
var viewBody = bodyEl.createChild({tag:'div', cls:'ychooser-view'});
vp.resizeEl = viewBody;
this.detailEl = dp.getEl();
// create the required templates
this.thumbTemplate = new Ext.Template(
'<div class="thumb-wrap" id="{name}">' +
'<div class="thumb"><img src="{url}" title="{name}"></div>' +
'<span>{shortName}</span></div>'
);
this.thumbTemplate.compile();
this.detailsTemplate = new Ext.Template(
'<div class="details"><img src="{url}"><div class="details-info">' +
'<b>Image Name:</b>' +
'<span>{name}</span>' +
'<b>Size:</b>' +
'<span>{sizeString}</span>' +
'<b>Last Modified:</b>' +
'<span>{dateString}</span></div></div>'
);
this.detailsTemplate.compile();
// initialize the View
this.view = new Ext.JsonView(viewBody, this.thumbTemplate, {
singleSelect: true,
jsonRoot: 'images',
emptyText : '<div style="padding:10px;">No images match the specified filter</div>'
});
this.view.on('selectionchange', this.showDetails, this, {buffer:100});
this.view.on('dblclick', this.doCallback, this);
this.view.on('loadexception', this.onLoadException, this);
this.view.on('beforeselect', function(view){
return view.getCount() > 0;
});
Ext.apply(this, config, {
width: 540, height: 400
});
var formatSize = function(size){
if(size < 1024) {
return size + " bytes";
} else {
return (Math.round(((size*10) / 1024))/10) + " KB";
}
};
// cache data by image name for easy lookup
var lookup = {};
// make some values pretty for display
this.view.prepareData = function(data){
data.shortName = data.name.ellipse(15);
data.sizeString = formatSize(data.size);
data.dateString = new Date(data.lastmod).format("m/d/Y g:i a");
lookup[data.name] = data;
return data;
};
this.lookup = lookup;
dlg.resizeTo(this.width, this.height);
this.loaded = false;
};
ImageChooser.prototype = {
show : function(el, callback){
this.reset();
this.dlg.show(el);
this.callback = callback;
},
reset : function(){
this.view.getEl().dom.scrollTop = 0;
this.view.clearFilter();
this.txtFilter.dom.value = '';
this.view.select(0);
},
load : function(){
if(!this.loaded){
this.view.load({url: this.url, params:this.params, callback:this.onLoad.createDelegate(this)});
}
},
onLoadException : function(v,o){
this.view.getEl().update('<div style="padding:10px;">Error loading images.</div>');
},
filter : function(){
var filter = this.txtFilter.dom.value;
this.view.filter('name', filter);
this.view.select(0);
},
onLoad : function(){
this.loaded = true;
this.view.select(0);
},
sortImages : function(){
var p = this.sortSelect.dom.value;
this.view.sort(p, p != 'name' ? 'desc' : 'asc');
this.view.select(0);
},
showDetails : function(view, nodes){
var selNode = nodes[0];
if(selNode && this.view.getCount() > 0){
this.ok.enable();
var data = this.lookup[selNode.id];
this.detailEl.hide();
this.detailsTemplate.overwrite(this.detailEl, data);
this.detailEl.slideIn('l', {stopFx:true,duration:.2});
}else{
this.ok.disable();
this.detailEl.update('');
}
},
doCallback : function(){
var selNode = this.view.getSelectedNodes()[0];
var callback = this.callback;
var lookup = this.lookup;
this.dlg.hide(function(){
if(selNode && callback){
var data = lookup[selNode.id];
callback(data);
}
});
}
};
String.prototype.ellipse = function(maxLength){
if(this.length > maxLength){
return this.substr(0, maxLength-3) + '...';
}
return this;
};

15
www/extras/yui-ext/examples/view/get-images.php Normal file
View file

@ -0,0 +1,15 @@
<?
$dir = "images/thumbs/";
$images = array();
$d = dir($dir);
while($name = $d->read()){
if(!preg_match('/\.(jpg|gif|png)$/', $name)) continue;
$size = filesize($dir.$name);
$lastmod = filemtime($dir.$name)*1000;
$images[] = array('name'=>$name, 'size'=>$size,
'lastmod'=>$lastmod, 'url'=>$dir.$name);
}
$d->close();
$o = array('images'=>$images);
echo json_encode($o);
?>

BIN
www/extras/yui-ext/examples/view/images/thumbs/dance_fever.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/gangster_zack.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/kids_hug.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/kids_hug2.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/sara_pink.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/sara_pumpkin.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/sara_smile.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/up_to_something.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/zack.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/zack_dress.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/zack_hat.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/zack_sink.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
www/extras/yui-ext/examples/view/images/thumbs/zacks_grill.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB