diff options
| -rw-r--r-- | js/lib/ui.widgets.js | 24 | ||||
| -rw-r--r-- | languages/en.php | 2 | ||||
| -rw-r--r-- | views/default/css.php | 36 | ||||
| -rw-r--r-- | views/default/widgets/controls.php | 17 | ||||
| -rw-r--r-- | views/default/widgets/wrapper.php | 10 |
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) { |