Make the admin/graphics UI mimic admin/themes with a single selected

toolkit above, and other available ones below.
This commit is contained in:
Bharat Mediratta
2009-01-13 04:56:29 +00:00
parent ac59df2395
commit 16bebdca06
6 changed files with 113 additions and 94 deletions

View File

@@ -21,8 +21,20 @@ class Admin_Graphics_Controller extends Admin_Controller {
public function index() {
$view = new Admin_View("admin.html");
$view->content = new View("admin_graphics.html");
$view->content->tk = new ArrayObject(graphics::detect_toolkits(), ArrayObject::ARRAY_AS_PROPS);
$view->content->active = module::get_var("core", "graphics_toolkit");
$tk = new ArrayObject(graphics::detect_toolkits(), ArrayObject::ARRAY_AS_PROPS);
$active = module::get_var("core", "graphics_toolkit");
foreach (array("gd", "imagemagick", "graphicsmagick") as $id) {
if ($id == $active) {
$view->content->active = new View("admin_graphics_$id.html");
$view->content->active->tk = $tk;
} else {
$v = new View("admin_graphics_$id.html");
$v->tk = $tk;
$view->content->available .= $v;
}
}
print $view;
}
@@ -38,7 +50,8 @@ class Admin_Graphics_Controller extends Admin_Controller {
site_status::clear("missing_graphics_toolkit");
message::success(t("Updated Graphics Toolkit"));
log::success("graphics", t("Changed graphics toolkit to: {{toolkit}}", array("toolkit" => $toolkit)));
log::success("graphics", t("Changed graphics toolkit to: {{toolkit}}",
array("toolkit" => $toolkit)));
}
url::redirect("admin/graphics");

View File

@@ -2,91 +2,29 @@
<script type="text/javascript">
$(document).ready(function() {
select_toolkit = function(el) {
if (!$(this).hasClass("selected")) {
if (!$(this).hasClass("unavailable")) {
window.location = '<?= url::site("admin/graphics/choose/__TK__?csrf=" . access::csrf_token()) ?>'
.replace("__TK__", $(this).attr("id"));
}
};
$("#gAdminGraphics table tr").click(select_toolkit);
$("#gAvailableToolkits div.gBlock").click(select_toolkit);
});
</script>
<div id="gAdminGraphics">
<h1> <?= t("Graphics Settings") ?> </h1>
<p>
<?= t("Gallery needs a graphics toolkit in order to manipulate your photos. Please choose one from the list below.") ?>
</p>
<h1> <?= t("Graphics Settings") ?> </h1>
<p>
<?= t("Gallery needs a graphics toolkit in order to manipulate your photos. Please choose one from the list below.") ?>
</p>
<div id="gSelectedToolkit">
<h2> <?= t("Active Toolkit") ?> </h2>
<?= $active ?>
</div>
<h2> <?= t("Graphics Toolkits") ?> </h2>
<div id="gAvailableToolkits">
<h2> <?= t("Available Toolkits") ?> </h2>
<?= $available ?>
</div>
</div>
<table id="gAdminGraphics">
<tr id="gd" <?= ($active == "gd") ? "class=\"selected\"" : "" ?>>
<td valign="top">
<img width="170" height="110" src="http://www.libgd.org/skins/libgd/gdlogosmall.png" alt="<? t("Visit the GD lib project site") ?>" />
</td>
<td>
<h3> <?= t("GD") ?> </h3>
<p>
<?= t("The GD graphics library is an extension to PHP commonly installed most webservers. Please refer to the <a href=\"{{url}}\">GD website</a> for more information.",
array("url" => "http://www.boutell.com/gd")) ?>
</p>
<? if ($tk->gd["GD Version"] && function_exists('imagerotate')): ?>
<p class="gSuccess">
<?= t("You have GD version {{version}}.", array("version" => $tk->gd["GD Version"])) ?>
</p>
<? elseif ($tk->gd["GD Version"]): ?>
<p class="gWarning">
<?= t("You have GD version {{version}}, but it lacks image rotation.",
array("version" => $tk->gd["GD Version"])) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("You do not have GD installed.") ?>
</p>
<? endif ?>
</td>
</tr>
<tr id="imagemagick" <?= ($active == "imagemagick") ? "class=\"selected\"" : "" ?>>
<td valign="top">
<img width="114" height="118" src="http://www.imagemagick.org/image/logo.jpg" alt="<? t("Visit the ImageMagick project site") ?>" />
</td>
<td>
<h3> <?= t("ImageMagick") ?> </h3>
<p>
<?= t("ImageMagick is a standalone graphics program available on most Linux systems. Please refer to the <a href=\"{{url}}\">ImageMagick website</a> for more information.",
array("url" => "http://www.imagemagick.org")) ?>
</p>
<? if ($tk->imagemagick): ?>
<p class="gSuccess">
<?= t("You have ImageMagick installed in {{path}}", array("path" => $tk->imagemagick)) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("ImageMagick is not available on your system.") ?>
</p>
<? endif ?>
</td>
</tr>
<tr id="graphicsmagick" <?= ($active == "graphicsmagick") ? "class=\"selected\"" : "" ?>>
<td valign="top">
<img width="107" height="76" src="http://www.graphicsmagick.org/images/gm-107x76.png" alt="<? t("Visit the GraphicsMagick project site") ?>" />
</td>
<td>
<h3> <?= t("GraphicsMagick") ?> </h3>
<p>
<?= t("GraphicsMagick is a standalone graphics program available on most Linux systems. Please refer to the <a href=\"{{url}}\">GraphicsMagick website</a> for more information.",
array("url" => "http://www.graphicsmagick.org")) ?>
</p>
<? if ($tk->graphicsmagick): ?>
<p class="gSuccess">
<?= t("You have GraphicsMagick installed in {{path}}", array("path" => $tk->graphicsmagick)) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("GraphicsMagick is not available on your system.") ?>
</p>
<? endif ?>
</td>
</tr>
</table>

View File

@@ -0,0 +1,22 @@
<div id="gd" class="gBlock <?= $tk->gd["GD Version"] ? "" : "unavailable" ?>">
<img class="logo" width="170" height="110" src="http://www.libgd.org/skins/libgd/gdlogosmall.png" alt="<? t("Visit the GD lib project site") ?>" />
<h3> <?= t("GD") ?> </h3>
<p>
<?= t("The GD graphics library is an extension to PHP commonly installed most webservers. Please refer to the <a href=\"{{url}}\">GD website</a> for more information.",
array("url" => "http://www.boutell.com/gd")) ?>
</p>
<? if ($tk->gd["GD Version"] && function_exists('imagerotate')): ?>
<p class="gSuccess">
<?= t("You have GD version {{version}}.", array("version" => $tk->gd["GD Version"])) ?>
</p>
<? elseif ($tk->gd["GD Version"]): ?>
<p class="gWarning">
<?= t("You have GD version {{version}}, but it lacks image rotation.",
array("version" => $tk->gd["GD Version"])) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("You do not have GD installed.") ?>
</p>
<? endif ?>
</div>

View File

@@ -0,0 +1,17 @@
<div id="graphicsmagick" class="gBlock <?= $tk->graphicsmagick ? "" : "unavailable" ?>">
<h3> <?= t("GraphicsMagick") ?> </h3>
<img class="logo" width="107" height="76" src="http://www.graphicsmagick.org/images/gm-107x76.png" alt="<? t("Visit the GraphicsMagick project site") ?>" />
<p>
<?= t("GraphicsMagick is a standalone graphics program available on most Linux systems. Please refer to the <a href=\"{{url}}\">GraphicsMagick website</a> for more information.",
array("url" => "http://www.graphicsmagick.org")) ?>
</p>
<? if ($tk->graphicsmagick): ?>
<p class="gSuccess">
<?= t("GraphicsMagick is available in {{path}}", array("path" => $tk->graphicsmagick)) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("GraphicsMagick is not available on your system.") ?>
</p>
<? endif ?>
</div>

View File

@@ -0,0 +1,17 @@
<div id="imagemagick" class="gBlock <?= $tk->imagemagick ? "" : "unavailable" ?>">
<h3> <?= t("ImageMagick") ?> </h3>
<img class="logo" width="114" height="118" src="http://www.imagemagick.org/image/logo.jpg" alt="<? t("Visit the ImageMagick project site") ?>" />
<p>
<?= t("ImageMagick is a standalone graphics program available on most Linux systems. Please refer to the <a href=\"{{url}}\">ImageMagick website</a> for more information.",
array("url" => "http://www.imagemagick.org")) ?>
</p>
<? if ($tk->imagemagick): ?>
<p class="gSuccess">
<?= t("ImageMagick is available in {{path}}", array("path" => $tk->imagemagick)) ?>
</p>
<? else: ?>
<p class="gInfo">
<?= t("ImageMagick is not available on your system.") ?>
</p>
<? endif ?>
</div>

View File

@@ -7,7 +7,7 @@
/** *******************************************************************
* Reusable content blocks
**********************************************************************/
.gBlock {
border: 1px solid #e7e7e7;
margin-bottom: 1em;
@@ -102,16 +102,25 @@
* Stuff that needs a home or needs to be organized
*********************************************************************/
#gAdminGraphics #gSelectedToolkit img,
#gAdminThemes #gSelectedTheme img {
float: left;
float: right;
margin-right: 1em;
}
#gAdminGraphics #gSelectedToolkit div.gBlock {
width: 700px;
height: 140px;
background: #cfc;
}
#gAdminGraphics .gBlock,
#gAdminThemes .gBlock {
background: #fff;
padding: 1em;
}
#gAdminGraphics #gAvailableToolkits .gBlock,
#gAdminThemes #gAvailableThemes .gBlock {
clear: none;
cursor: pointer;
@@ -121,23 +130,26 @@
width: 250px;
}
#gAdminGraphics #gAvailableToolkits .gBlock {
width: 328px;
height: 300px;
}
#gAdminGraphics #gAvailableToolkits .unavailable {
background-color: #fee !important;
cursor: default !important;
}
#gAdminGraphics #gAvailableToolkits .gBlock:hover,
#gAdminThemes #gAvailableThemes .gBlock:hover {
background: #eee;
}
#gAdminGraphics a,
#gAdminThemes a {
color: #333;
}
#gAdminGraphics tr {
#gAdminGraphics #gAvailableToolkits .gBlock {
cursor: pointer;
}
#gAdminGraphics tr.selected {
background-color: #cfc !important;
cursor: default;
}
#gAdminGraphics tr:hover {
background-color: #eee;
}