![[tokkee]](http://tokkee.org/images/avatar.png){kind=avatar}
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 7865b09)
raw | patch | inline | side by side (parent: 7865b09)
| author | hickert <hickert@594d385d-05f5-0310-b6e9-bd551577e9d8> | |
| Wed, 5 May 2010 14:31:48 +0000 (14:31 +0000) | ||
| committer | hickert <hickert@594d385d-05f5-0310-b6e9-bd551577e9d8> | |
| Wed, 5 May 2010 14:31:48 +0000 (14:31 +0000) |
git-svn-id: https://oss.gonicus.de/repositories/gosa/trunk@18148 594d385d-05f5-0310-b6e9-bd551577e9d8
diff --git a/gosa-core/html/include/tooltip-v0.2.js b/gosa-core/html/include/tooltip-v0.2.js
--- /dev/null
@@ -0,0 +1,208 @@
+/*
+ * Copyright (c) 2006 Jonathan Weiss <jw@innerewut.de>
+ *
+ * Permission to use, copy, modify, and distribute this software for any
+ * purpose with or without fee is hereby granted, provided that the above
+ * copyright notice and this permission notice appear in all copies.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+ * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+ * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+ * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+ */
+
+
+/* tooltip-0.2.js - Small tooltip library on top of Prototype
+ * by Jonathan Weiss <jw@innerewut.de> distributed under the BSD license.
+ *
+ * This tooltip library works in two modes. If it gets a valid DOM element
+ * or DOM id as an argument it uses this element as the tooltip. This
+ * element will be placed (and shown) near the mouse pointer when a trigger-
+ * element is moused-over.
+ * If it gets only a text as an argument instead of a DOM id or DOM element
+ * it will create a div with the classname 'tooltip' that holds the given text.
+ * This newly created div will be used as the tooltip. This is usefull if you
+ * want to use tooltip.js to create popups out of title attributes.
+ *
+ *
+ * Usage:
+ * <script src="/javascripts/prototype.js" type="text/javascript"></script>
+ * <script src="/javascripts/tooltip.js" type="text/javascript"></script>
+ * <script type="text/javascript">
+ * // with valid DOM id
+ * var my_tooltip = new Tooltip('id_of_trigger_element', 'id_of_tooltip_to_show_element')
+ *
+ * // with text
+ * var my_other_tooltip = new Tooltip('id_of_trigger_element', 'a nice description')
+ *
+ * // create popups for each element with a title attribute
+ * Event.observe(window,"load",function() {
+ * $$("*").findAll(function(node){
+ * return node.getAttribute('title');
+ * }).each(function(node){
+ * new Tooltip(node,node.title);
+ * node.removeAttribute("title");
+ * });
+ * });
+ *
+ * </script>
+ *
+ * Now whenever you trigger a mouseOver on the `trigger` element, the tooltip element will
+ * be shown. On o mouseOut the tooltip disappears.
+ *
+ * Example:
+ *
+ * <script src="/javascripts/prototype.js" type="text/javascript"></script>
+ * <script src="/javascripts/scriptaculous.js" type="text/javascript"></script>
+ * <script src="/javascripts/tooltip.js" type="text/javascript"></script>
+ *
+ * <div id='tooltip' style="display:none; margin: 5px; background-color: red;">
+ * Detail infos on product 1....<br />
+ * </div>
+ *
+ * <div id='product_1'>
+ * This is product 1
+ * </div>
+ *
+ * <script type="text/javascript">
+ * var my_tooltip = new Tooltip('product_1', 'tooltip')
+ * </script>
+ *
+ * You can use my_tooltip.destroy() to remove the event observers and thereby the tooltip.
+ */
+
+var Tooltip = Class.create();
+Tooltip.prototype = {
+ initialize: function(element, tool_tip) {
+ var options = Object.extend({
+ default_css: false,
+ margin: "0px",
+ padding: "5px",
+ backgroundColor: "#d6d6fc",
+ min_distance_x: 5,
+ min_distance_y: 5,
+ delta_x: 0,
+ delta_y: 0,
+ zindex: 1000
+ }, arguments[2] || {});
+
+ this.element = $(element);
+
+ this.options = options;
+
+ // use the supplied tooltip element or create our own div
+ if($(tool_tip)) {
+ this.tool_tip = $(tool_tip);
+ } else {
+ this.tool_tip = $(document.createElement("div"));
+ document.body.appendChild(this.tool_tip);
+ this.tool_tip.addClassName("tooltip");
+ this.tool_tip.appendChild(document.createTextNode(tool_tip));
+ }
+
+ // hide the tool-tip by default
+ this.tool_tip.hide();
+
+ this.eventMouseOver = this.showTooltip.bindAsEventListener(this);
+ this.eventMouseOut = this.hideTooltip.bindAsEventListener(this);
+ this.eventMouseMove = this.moveTooltip.bindAsEventListener(this);
+
+ this.registerEvents();
+ },
+
+ destroy: function() {
+ Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
+ Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
+ Event.stopObserving(this.element, "mousemove", this.eventMouseMove);
+ },
+
+ registerEvents: function() {
+ Event.observe(this.element, "mouseover", this.eventMouseOver);
+ Event.observe(this.element, "mouseout", this.eventMouseOut);
+ Event.observe(this.element, "mousemove", this.eventMouseMove);
+ },
+
+ moveTooltip: function(event){
+ Event.stop(event);
+ // get Mouse position
+ var mouse_x = Event.pointerX(event);
+ var mouse_y = Event.pointerY(event);
+
+ // decide if wee need to switch sides for the tooltip
+ var dimensions = Element.getDimensions( this.tool_tip );
+ var element_width = dimensions.width;
+ var element_height = dimensions.height;
+
+ if ( (element_width + mouse_x) >= ( this.getWindowWidth() - this.options.min_distance_x) ){ // too big for X
+ mouse_x = mouse_x - element_width;
+ // apply min_distance to make sure that the mouse is not on the tool-tip
+ mouse_x = mouse_x - this.options.min_distance_x;
+ } else {
+ mouse_x = mouse_x + this.options.min_distance_x;
+ }
+
+ if ( (element_height + mouse_y) >= ( this.getWindowHeight() - this.options.min_distance_y) ){ // too big for Y
+ mouse_y = mouse_y - element_height;
+ // apply min_distance to make sure that the mouse is not on the tool-tip
+ mouse_y = mouse_y - this.options.min_distance_y;
+ } else {
+ mouse_y = mouse_y + this.options.min_distance_y;
+ }
+
+ // now set the right styles
+ this.setStyles(mouse_x, mouse_y);
+ },
+
+
+ showTooltip: function(event) {
+ Event.stop(event);
+ this.moveTooltip(event);
+ new Element.show(this.tool_tip);
+ },
+
+ setStyles: function(x, y){
+ // set the right styles to position the tool tip
+ Element.setStyle(this.tool_tip, { position:'absolute',
+ top:y + this.options.delta_y + "px",
+ left:x + this.options.delta_x + "px",
+ zindex:this.options.zindex
+ });
+
+ // apply default theme if wanted
+ if (this.options.default_css){
+ Element.setStyle(this.tool_tip, { margin:this.options.margin,
+ padding:this.options.padding,
+ backgroundColor:this.options.backgroundColor,
+ zindex:this.options.zindex
+ });
+ }
+ },
+
+ hideTooltip: function(event){
+ new Element.hide(this.tool_tip);
+ },
+
+ getWindowHeight: function(){
+ var innerHeight;
+ if (navigator.appVersion.indexOf('MSIE')>0) {
+ innerHeight = document.body.clientHeight;
+ } else {
+ innerHeight = window.innerHeight;
+ }
+ return innerHeight;
+ },
+
+ getWindowWidth: function(){
+ var innerWidth;
+ if (navigator.appVersion.indexOf('MSIE')>0) {
+ innerWidth = document.body.clientWidth;
+ } else {
+ innerWidth = window.innerWidth;
+ }
+ return innerWidth;
+ }
+
+}
index aa06d7f380673ad230c658773966c03feaad357a..4fef2a0c8f44e63c31e6e3fa45a908d1c5926efe 100644 (file)
cursor:pointer;
}
+div.tooltip{
+ padding: 5px;
+ width: 500px;
+ border: 1px solid #000;
+ background-color: #F0F0F0;
+}
+
div.img{
display:inline-block;
display:-moz-inline-block;
diff --git a/gosa-core/plugins/addons/configViewer/class_configViewer.inc b/gosa-core/plugins/addons/configViewer/class_configViewer.inc
index 7cc728a0877932899363c61d449e07776bb5c48b..c52f32aa89bea4413a8b427767c8fbc49e853696 100644 (file)
{
// Walk trough all properties and check if there posts for us.
$all = $this->config->configRegistry->getAllProperties();
+
+ $htmlTooltips = "";
+ $jsTooltips = "";
foreach($all as $prop){
$modified = in_array($prop->getStatus(),array('modified','removed'));
if($modified) break;
$smarty = get_smarty();
$smarty->assign('is_modified', $modified);
+ $smarty->assign('htmlTooltips', $htmlTooltips);
+ $smarty->assign('jsTooltips', $jsTooltips);
return(management::renderList());
}
static function propertyGroup($group, $description = array())
{
- $title = _("No description");
- if(!empty($description[0])) $title=htmlentities($description[0], ENT_COMPAT, 'UTF-8');
- return("<span title=\"{$title}\">{$group[0]}</span>");
+ return($group[0]);
}
static function propertyClass($class, $description = array())
{
}else{
$class = $class[0];
}
- $title = _("No description");
- if(!empty($description[0])) $title=htmlentities($description[0], ENT_COMPAT, 'UTF-8');
- return("<span title=\"{$title}\">{$class}</span>");
+ return($class);
}
- static function propertyName($cn, $description = array())
+ static function propertyName($class,$cn, $description = array())
{
+ $id = "{$class[0]}_{$cn[0]}";
+
$title = _("No description");
- if(!empty($description[0])) $title=htmlentities($description[0], ENT_COMPAT, 'UTF-8');
- return("<span title=\"{$title}\">{$cn[0]}</span>");
+ if(isset($description[0])) $title = htmlentities($description[0],ENT_COMPAT, 'UTF-8');
+ $title = preg_replace("/\n/", "<br>", $title);
+ $tooltip = "<div id='tooltip_{$id}' class='tooltip'>".$title."</div>";
+ return($tooltip."<span title='tooltip_{$id}'>{$cn[0]}</span>");
}
static function propertyValue($class,$cn, $value,$type,$default,$description)
{
$name = "{$class[0]}:{$cn[0]}";
$value = htmlentities($value[0], ENT_COMPAT , 'UTF-8');
- $title = _("No description");
- if(!empty($description[0])) $title=htmlentities($description[0], ENT_COMPAT, 'UTF-8');
switch($type[0]){
case 'string':
case 'integer':
- $res = "<input style='width:97%' title=\"{$title}\" type='text' value=\"{$value}\" name={$name}>";
+ $res = "<input style='width:97%' type='text' value=\"{$value}\" name={$name}>";
break;
default: $res = "";
}
diff --git a/gosa-core/plugins/addons/configViewer/property-list.tpl b/gosa-core/plugins/addons/configViewer/property-list.tpl
index 785129092f6a261c79e1b1112f1c86231385404e..552db9178507f1f7a57958818748f998e3b3eac8 100644 (file)
+<script language="javascript" src="include/tooltip-v0.2.js" type="text/javascript"></script>
+
<div id="mainlist">
<div class="mainlist-header">
{$LIST}
</div>
+<script type="text/javascript">
+ Event.observe(window,"load",function() {
+ $$("*").findAll(function(node){
+ return node.getAttribute('title');
+ }).each(function(node){
+ var test = node.title;
+ new Tooltip(node,test);
+ node.removeAttribute("title");
+ });
+ });
+</script>
+
{if !$is_modified}
<input type="hidden" name="ignore">
{/if}
<button name='saveProperties'>{msgPool type='okButton'}</button>
<button name='cancelProperties'>{msgPool type='cancelButton'}</button>
</div>
+
diff --git a/gosa-core/plugins/addons/configViewer/property-list.xml b/gosa-core/plugins/addons/configViewer/property-list.xml
index 5bce280486ed737d6ee686452a92ff4e338dee8b..db88d6a99305c975c2b622b2911d30901e083d0e 100644 (file)
</definition>
<table>
- <layout>|20px;c|80px|100px|100px||60px;r|</layout>
+ <layout>|20px;c|80px|100px|200px||60px;r|</layout>
<column>
<value>%{filter:objectType(dn,objectClass)}</value>
<label>Name</label>
<sortAttribute>cn</sortAttribute>
<sortType>string</sortType>
- <value>%{filter:propertyName(cn,description)}</value>
+ <value>%{filter:propertyName(class,cn,description)}</value>
<export>true</export>
</column>