blob: 1247de83b241a65fd3da9e59f8917d62e426ea4b [file] [log] [blame]
<?php
/**
* The main GUI for the ImageManager.
* @author $Author:ray $
* @version $Id:manager.php 987 2008-04-12 12:39:04Z ray $
* @package ImageManager
*/
require_once('config.inc.php');
require_once('ddt.php');
require_once('Classes/ImageManager.php');
$manager = new ImageManager($IMConfig);
$dirs = $manager->getDirs();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Insert Image</title>
<script type="text/javascript">
// temporary. An ImageManager rewrite will take care of this kludge.
_backend_url = "<?php print $IMConfig['backend_url']; ?>";
_resized_prefix = "<?php echo $IMConfig['resized_prefix']; ?>";
_resized_dir = "<?php echo $IMConfig['resized_dir']; ?>";
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="<?php print $IMConfig['base_url'];?>assets/manager.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../popups/popup.js"></script>
<script type="text/javascript" src="assets/popup.js"></script>
<script type="text/javascript" src="../../modules/ColorPicker/ColorPicker.js"></script>
<script type="text/javascript" src="<?php print $IMConfig['base_url'];?>assets/dialog.js"></script>
<script type="text/javascript">
/*<![CDATA[*/
if(window.opener)
Xinha = HTMLArea = window.opener.Xinha;
var thumbdir = "<?php echo $IMConfig['thumbnail_dir']; ?>";
var base_url = "<?php echo $manager->getImagesURL(); ?>";
/*]]>*/
</script>
<script type="text/javascript" src="<?php print $IMConfig['base_url'];?>assets/manager.js"></script>
<?php
if(!$IMConfig['show_full_options'])
{
?>
<style type="text/css">
.fullOptions { visibility:hidden; }
</style>
<?php
}
?>
<script type="text/javascript">
function switchChooser(toChooserPanel)
{
var ourPanel = document.getElementById(toChooserPanel);
if(!ourPanel) return false; // Can't change, doesn't exist.
// hide all panels
var d = document.getElementById('chooserFieldset').getElementsByTagName('div');
for(i = 0; i < d.length; i++)
{
if(d[i].className.match(/chooserPanel/))
d[i].style.display = 'none';
}
// show ours
ourPanel.style.display = 'block';
}
</script>
</head>
<body>
<form action="<?php print $IMConfig['backend_url'] ?>" id="uploadForm" method="post" enctype="multipart/form-data">
<input type="hidden" name="__plugin" value="ImageManager" />
<input type="hidden" name="__function" value="images" />
<fieldset id="chooserFieldset">
<legend>
Choose From:
<select onchange="switchChooser(this.options[this.selectedIndex].value)">
<?php
if($IMConfig['Local'])
{
?>
<option value="picturesChooser">This Server</option>
<?php
}
?>
<?php
if($IMConfig['YouTube'])
{
?>
<option value="youtubeChooser">YouTube Videos</option>
<?php
}
?>
<?php
if($IMConfig['Flickr'])
{
?>
<option value="flickrChooser">Flickr Pictures</option>
<?php
}
?>
</select>
</legend>
<?php
if($IMConfig['Local'])
{
?>
<div id="picturesChooser" class="chooserPanel">
<table width="100%">
<tr>
<th><label for="dirPath">Directory</label></th>
<td>
<select name="dir" class="dirWidth" id="dirPath" onchange="updateDir(this)">
<option value="/">/</option>
<?php
foreach($dirs as $relative=>$fullpath)
{
?>
<option value="<?php echo rawurlencode($relative); ?>"><?php echo $relative; ?></option>
<?php
}
?>
</select>
</td>
<td>
<a href="#" onclick="javascript: goUpDir();" title="Directory Up"><img src="<?php print $IMConfig['base_url']; ?>img/btnFolderUp.gif" height="15" width="15" alt="Directory Up" /></a>
<?php
if($IMConfig['safe_mode'] == false && $IMConfig['allow_new_dir'])
{
?>
<a href="#" onclick="newFolder();" title="New Folder"><img src="<?php print $IMConfig['base_url']; ?>img/btnFolderNew.gif" height="15" width="15" alt="New Folder" /></a>
<?php
}
?>
</td>
</tr>
<?php
if($IMConfig['allow_upload'] == TRUE)
{
?>
<tr>
<th style="text-align: left;">Upload:</th>
<td colspan="2">
<input type="file" name="upload" id="upload" />
<input name="Upload" type="submit" id="Upload" value="Upload" onclick="doUpload();" />
</td>
</tr>
<?php
}
?>
</table>
<div id="messages" style="display: none;"><span id="message"></span><img src="<?php print $IMConfig['base_url']; ?>img/dots.gif" width="22" height="12" alt="..." /></div>
<iframe src="<?php print $IMConfig['backend_url']; ?>__function=images" name="imgManager" id="imgManager" class="imageFrame" scrolling="auto" title="Image Selection" frameborder="0"></iframe>
</div>
<?php
}
?>
<?php
if($IMConfig['YouTube'])
{
?>
<div id="youtubeChooser" style="display:none" class="chooserPanel">
<table width="100%">
<tr>
<th><labelfor="ytUsername">YouTube Username</label></th>
<td>
<input type="text" name="ytUsername" id="ytUsername" />
</td>
<th><labelfor="ytSearch">Keyword</label></th>
<td>
<input type="text" name="ytSearch" id="ytSearch" />
</td>
<td>
<input type="button" value="Search" onclick="document.getElementById('ytManager').src='<?php print $IMConfig['backend_url']; ?>__function=youtube&ytSearch='+document.getElementById('ytSearch').value+'&ytUsername='+document.getElementById('ytUsername').value;" />
</td>
</tr>
</table>
<div id="messages" style="display: none;"><span id="message"></span><img SRC="<?php print $IMConfig['base_url']; ?>img/dots.gif" width="22" height="12" alt="..." /></div>
<iframe src="<?php print $IMConfig['backend_url']; ?>__function=youtube" name="ytManager" id="ytManager" class="imageFrame" scrolling="auto" title="YouTube Selection" frameborder="0"></iframe>
</div>
<?php
}
?>
<?php
if($IMConfig['Flickr'])
{
require_once('Classes/Flickr.php');
$lics = flickr_get_license_id_by_usage();
?>
<div id="flickrChooser" style="display:none" class="chooserPanel">
<script type="text/javascript">
function flickr_go()
{
var u = '<?php print $IMConfig['backend_url']; ?>__function=flickr';
u += '&flkSearch=' + encodeURIComponent(document.getElementById('flkSearch').value);
u += '&flkUsername='+ encodeURIComponent(document.getElementById('flkUsername').value);
u += '&flkLicense=' + encodeURIComponent( document.getElementById('flkLicense').options[document.getElementById('flkLicense').selectedIndex].value );
document.getElementById('flkManager').src= u;
}
</script>
<table width="100%">
<tr>
<th><labelfor="ytUsername">Flickr Username/Email</label></th>
<td>
<input type="text" name="flkUsername" id="flkUsername" />
</td>
<th><labelfor="ytSearch">Keyword</label></th>
<td>
<input type="text" name="flkSearch" id="flkSearch" />
</td>
<td>
<input type="button" value="Search" onclick="flickr_go();" />
</td>
</tr>
<tr>
<th>Usage Restriction:</th>
<td colspan="3">
<select name="flkLicense" id="flkLicense" onchange="flickr_go();">
<?php
foreach($lics as $usage => $licid)
{
?>
<option value="<?php echo $licid ?>" <?php if(flickr_is_default_license($licid)) echo 'selected="selected"' ?>> <?php echo $licid ?> <?php echo htmlspecialchars($usage) ?></li>
<?php
}
?>
</select>
</td>
<td><a href="http://flickr.com/" target="_blank">flickr.com</a></td>
</tr>
</table>
<div id="messages" style="display: none;"><span id="message"></span><img SRC="<?php print $IMConfig['base_url']; ?>img/dots.gif" width="22" height="12" alt="..." /></div>
<iframe src="<?php print $IMConfig['backend_url']; ?>__function=flickr" name="flkManager" id="flkManager" class="imageFrame" scrolling="auto" title="Flickr Selection" frameborder="0"></iframe>
</div>
<?php
}
?>
</fieldset>
<!-- image properties -->
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<th style="text-align: left;">Description:</th>
<td colspan="6">
<input type="text" id="f_alt" style="width:95%"/>
</td>
<td rowspan="4" width="100" height="100" style="vertical-align: middle;" style="padding:4px;background-color:#CCC;border:1px inset;">
<img src="" id="f_preview" />
</td>
</tr>
<tr>
<th style="text-align: left;">Width:</th>
<td >
<input id="f_width" type="text" name="f_width" size="4" onchange="javascript:checkConstrains('width');" />
</td>
<td rowspan="2">
<div style="position:relative">
<img src="<?php print $IMConfig['base_url']; ?>img/locked.gif" id="imgLock" width="25" height="32" alt="Constrained Proportions" style="vertical-align: middle;" /><input type="checkbox" id="constrain_prop" checked="checked" onclick="javascript:toggleConstrains(this);" style="position:absolute;top:8px;left:0px;" value="on" />
</div>
</td>
<th style="text-align: left;" class="fullOptions">Margin:</th>
<td colspan="3" class="fullOptions">
<?php
if(@$IMConfig['UseHSpaceVSpace'])
{
?>
<input name="f_hspace" type="text" id="f_hspace" size="3" />
x <input name="f_vspace" type="text" id="f_vspace" size="3" />
<?php
}
else
{
?>
<input name="f_margin" type="text" id="f_margin" size="3" />
<?php
}
?>
px </td>
</tr>
<tr>
<th style="text-align: left;">Height:</th>
<td>
<input name="f_height" type="text" id="f_height" size="4" />
</td>
<th style="text-align: left;" class="fullOptions">Padding:</th>
<td class="fullOptions">
<input name="f_padding" type="text" id="f_padding" size="3" />
px </td>
<th style="text-align: left;" class="fullOptions">Color:</th>
<td class="fullOptions">
<input name="f_backgroundColor" type="text" id="f_backgroundColor" size="7" />
</td>
</tr>
<tr class="fullOptions">
<th style="text-align: left;">Alignment:</th>
<td colspan="2">
<select size="1" id="f_align" title="Positioning of this image">
<option value="" >Not set</option>
<option value="left" >Left</option>
<option value="right" >Right</option>
<option value="texttop" >Texttop</option>
<option value="absmiddle" >Absmiddle</option>
<option value="baseline" selected="selected" >Baseline</option>
<option value="absbottom" >Absbottom</option>
<option value="bottom" >Bottom</option>
<option value="middle" >Middle</option>
<option value="top" >Top</option>
</select>
</td>
<th style="text-align: left;">Border:</th>
<td>
<input name="f_border" type="text" id="f_border" size="3" />
px </td>
<th style="text-align: left;">Color:</th>
<td>
<input name="f_borderColor" type="text" id="f_borderColor" size="7" />
</td>
</tr>
</table>
<div style="text-align: right;">
<hr />
<button type="button" class="buttons" onclick="return refresh();">Refresh</button>
<button type="button" class="buttons" onclick="return onOK();">OK</button>
<button type="button" class="buttons" onclick="return onCancel();">Cancel</button>
</div>
<!--// image properties -->
<input type="hidden" id="orginal_width" />
<input type="hidden" id="orginal_height" />
<input type="hidden" id="f_url" class="largelWidth" value="" />
</form>
</body>
</html>