aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorcash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544>2010-11-20 22:19:11 +0000
committercash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544>2010-11-20 22:19:11 +0000
commitb827319a8b0c17ea362bf55548557862a04f0ba9 (patch)
treeea5873d2fa2ca427323dc6ca9d1e8dff8450f8d8
parent96f880d1e535aaf47d0c67cfe3da8fca638dc00d (diff)
downloadelgg-b827319a8b0c17ea362bf55548557862a04f0ba9.tar.gz
elgg-b827319a8b0c17ea362bf55548557862a04f0ba9.tar.bz2
added collapsible state to widgets
git-svn-id: http://code.elgg.org/elgg/trunk@7392 36083f99-b078-4883-b0ff-0f9b5a30f544
-rw-r--r--js/lib/ui.widgets.js24
-rw-r--r--languages/en.php2
-rw-r--r--views/default/css.php36
-rw-r--r--views/default/widgets/controls.php17
-rw-r--r--views/default/widgets/wrapper.php10
5 files changed, 59 insertions, 30 deletions
diff --git a/js/lib/ui.widgets.js b/js/lib/ui.widgets.js
index a26be4154..93de96407 100644
--- a/js/lib/ui.widgets.js
+++ b/js/lib/ui.widgets.js
@@ -32,6 +32,7 @@ elgg.ui.widgets.init = function() {
$('a.widget_delete_button').click(elgg.ui.widgets.remove);
$('a.widget_edit_button').click(elgg.ui.widgets.editToggle);
$('.widget_edit > form ').submit(elgg.ui.widgets.saveSettings);
+ $('a.widget_collapse_button').click(elgg.ui.widgets.collapseToggle);
elgg.ui.widgets.equalHeight(".widget_column");
};
@@ -65,8 +66,11 @@ elgg.ui.widgets.add = function(event) {
},
success: function(json) {
$('#widget_col_1').prepend(json.output);
- $('#widget_col_1').children(":first").find('a.widget_delete_button').bind('click', elgg.ui.widgets.remove);
- $('#widget_col_1').children(":first").find('a.widget_edit_button').bind('click', elgg.ui.widgets.editToggle);
+ var $widget = $('#widget_col_1').children(":first");
+ $widget.find('a.widget_delete_button').click(elgg.ui.widgets.remove);
+ $widget.find('a.widget_edit_button').click(elgg.ui.widgets.editToggle);
+ $widget.find('a.widget_collapse_button').click(elgg.ui.widgets.collapseToggle);
+ $widget.find('.widget_edit > form ').submit(elgg.ui.widgets.saveSettings);
}
});
event.preventDefault();
@@ -108,7 +112,7 @@ elgg.ui.widgets.move = function(event, ui) {
* @return void
*/
elgg.ui.widgets.remove = function(event) {
- var $widget = $(this).parent().parent().parent().parent();
+ var $widget = $(this).parent().parent();
// if widget type is single instance type, enable the add buton
var type = $widget.attr('class');
@@ -146,7 +150,19 @@ elgg.ui.widgets.remove = function(event) {
* @return void
*/
elgg.ui.widgets.editToggle = function(event) {
- $(this).parent().parent().parent().parent().find('.widget_edit').slideToggle('medium');
+ $(this).parent().parent().find('.widget_edit').slideToggle('medium');
+ event.preventDefault();
+}
+
+/**
+ * Toogle the collapse state of the widget
+ *
+ * @param {Object} event
+ * @return void
+ */
+elgg.ui.widgets.collapseToggle = function(event) {
+ $(this).toggleClass('widget_collapsed');
+ $(this).parent().parent().find('.widget_container').slideToggle('medium');
event.preventDefault();
}
diff --git a/languages/en.php b/languages/en.php
index 09c025f29..3d166789e 100644
--- a/languages/en.php
+++ b/languages/en.php
@@ -224,7 +224,7 @@ $english = array(
*/
'dashboard' => "Dashboard",
- 'dashboard:nowidgets' => "Your dashboard lets you track activity and content on this site that matters to you.",
+ 'dashboard:nowidgets' => "Your dashboard lets you track the activity and content on this site that matters to you.",
'widgets:add' => 'Add widgets',
'widgets:add:description' => "Click on any widget button below to add it to your page.",
diff --git a/views/default/css.php b/views/default/css.php
index 4e38aadc0..97748b7ab 100644
--- a/views/default/css.php
+++ b/views/default/css.php
@@ -870,7 +870,7 @@ li.navigation_more ul li {
width: 50%;
}
.widget_3_columns {
- width: 33.3%;
+ width: 33%;
}
.widget_4_columns {
width: 25%;
@@ -911,6 +911,7 @@ li.navigation_more ul li {
background-color: #dedede;
padding: 2px;
margin: 0 5px 15px;
+ position: relative;
}
.widget:hover {
background-color: #cccccc;
@@ -919,35 +920,38 @@ li.navigation_more ul li {
background-color: #dedede;
height: 30px;
line-height: 30px;
+ overflow: hidden;
}
.widget_title h3 {
float: left;
- padding: 0 5px;
+ padding: 0 45px 0 20px;
}
-.widget_title ul, .widget_title li {
- float: right;
- margin: 0;
- padding: 0;
- list-style: none;
-}
-.widget_title li {
- margin: 5px 2px;
-}
-.widget_title li a {
+.widget_controls a {
+ position: absolute;
+ top: 5px;
display: block;
width: 18px;
height: 18px;
border: 1px solid transparent;
}
-.widget_title li a:hover {
- border: 1px solid #cccccc;
+a.widget_collapse_button {
+ left: 5px;
+ background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat 0px -385px;
}
-a.widget_edit_button {
- background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -300px -1px;
+.widget_controls a.widget_collapsed {
+ background-position: 0px -365px;
}
a.widget_delete_button {
+ right: 5px;
background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -198px 3px;
}
+a.widget_edit_button {
+ right: 25px;
+ background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -300px -1px;
+}
+a.widget_edit_button:hover, a.widget_delete_button:hover {
+ border: 1px solid #cccccc;
+}
.widget_container {
background-color: white;
width: 100%;
diff --git a/views/default/widgets/controls.php b/views/default/widgets/controls.php
index 4336a3506..bd4af97a6 100644
--- a/views/default/widgets/controls.php
+++ b/views/default/widgets/controls.php
@@ -10,6 +10,14 @@ $widget = $vars['widget'];
$params = array(
'text' => ' ',
+ 'href' => "#",
+ 'class' => 'widget_collapse_button',
+ 'internalid' => "widget_collapse_button_$widget->guid"
+);
+$collapse_link = elgg_view('output/url', $params);
+
+$params = array(
+ 'text' => ' ',
'title' => elgg_echo('widget:delete', array($widget->getTitle())),
'href' => elgg_get_site_url() . "action/widgets/delete?guid=$widget->guid",
'is_action' => true,
@@ -28,8 +36,9 @@ $params = array(
$edit_link = elgg_view('output/url', $params);
echo <<<___END
-<ul>
- <li>$delete_link</li>
- <li>$edit_link</li>
-</ul>
+<div class="widget_controls">
+ $collapse_link
+ $delete_link
+ $edit_link
+</div>
___END;
diff --git a/views/default/widgets/wrapper.php b/views/default/widgets/wrapper.php
index 8d589aabd..20faf85a8 100644
--- a/views/default/widgets/wrapper.php
+++ b/views/default/widgets/wrapper.php
@@ -27,12 +27,12 @@ $widget_instance = "widget_instance_$handler";
<div class="widget draggable <?php echo $widget_instance?>" id="<?php echo $widget_id; ?>">
<div class="widget_title drag_handle">
<h3><?php echo $title; ?></h3>
- <?php
- if ($can_edit) {
- echo elgg_view('widgets/controls', array('widget' => $widget));
- }
- ?>
</div>
+ <?php
+ if ($can_edit) {
+ echo elgg_view('widgets/controls', array('widget' => $widget));
+ }
+ ?>
<div class="widget_container">
<?php
if ($can_edit) {