aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--js/lib/ui.widgets.js53
-rw-r--r--views/default/css.php60
-rw-r--r--views/default/layouts/widgets.php373
-rw-r--r--views/default/widgets/wrapper.php90
4 files changed, 113 insertions, 463 deletions
diff --git a/js/lib/ui.widgets.js b/js/lib/ui.widgets.js
index bce5aea0f..cf13d6e95 100644
--- a/js/lib/ui.widgets.js
+++ b/js/lib/ui.widgets.js
@@ -1,45 +1,14 @@
elgg.provide('elgg.ui.widgets');
elgg.ui.widgets.init = function() {
- // COLLAPSABLE WIDGETS (on Dashboard & Profile pages)
- $('a.toggle_box_contents').live('click', elgg.ui.widgets.toggleContent);
- $('a.toggle_box_edit_panel').live('click', elgg.ui.widgets.toggleEditPanel);
- $('a.toggle_customise_edit_panel').live('click', elgg.ui.widgets.toggleCustomizeEditPanel);
-
- // WIDGET GALLERY EDIT PANEL
- // Sortable widgets
- var els = [
- '#leftcolumn_widgets',
- '#middlecolumn_widgets',
- '#rightcolumn_widgets',
- '#widget_picker_gallery'
- ].join(',');
-
- $(els).sortable({
- items: '.draggable_widget',
- handle: '.drag_handle',
+ $(".widget_column" ).sortable({
+ items: 'div.widget',
+ connectWith: '.widget_column',
+ handle: 'div.drag_handle',
forcePlaceholderSize: true,
- placeholder: 'ui-state-highlight',
- cursor: 'move',
- opacity: 0.9,
- appendTo: 'body',
- connectWith: els,
- stop: function(e, ui) {
- // refresh list before updating hidden fields with new widget order
- $(this).sortable("refresh");
-
- var widgetNamesLeft = elgg.ui.widgets.outputList('#leftcolumn_widgets'),
- widgetNamesMiddle = elgg.ui.widgets.outputList('#middlecolumn_widgets'),
- widgetNamesRight = elgg.ui.widgets.outputList('#rightcolumn_widgets');
-
- $('#debugField1').val(widgetNamesLeft);
- $('#debugField2').val(widgetNamesMiddle);
- $('#debugField3').val(widgetNamesRight);
- }
+ placeholder: 'widget_placeholder'
});
- // bind more info buttons - called when new widgets are created
- elgg.ui.widgets.moreinfo();
};
//List active widgets for each page column
@@ -109,18 +78,6 @@ elgg.ui.widgets.toggleContent = function(e) {
return false;
};
-// toggle widget box edit panel
-elgg.ui.widgets.toggleEditPanel = function () {
- $(this.parentNode.parentNode).children(".collapsable_box_editpanel").slideToggle("fast");
- return false;
-};
-
-// toggle customise edit panel
-elgg.ui.widgets.toggleCustomizeEditPanel = function () {
- $('#customise_editpanel').slideToggle("fast");
- return false;
-};
-
/**
* @deprecated Use elgg.ui.widgets.*
*/
diff --git a/views/default/css.php b/views/default/css.php
index 923d7c958..8409ceb8b 100644
--- a/views/default/css.php
+++ b/views/default/css.php
@@ -17,6 +17,7 @@
SUBMENU current page/tool submenu in sidebar
PAGINATION re-usable default page navigation
ELGG TABBED NAVIGATION re-usable tabbed navigation
+ WIDGETS
LOGIN / REGISTER login box, register, and lost password page styles
CONTENT HEADER
DEFAULT COMMENTS
@@ -25,7 +26,7 @@
GENERAL FORM ELEMENTS default styles for all elgg input/form elements
FRIENDS PICKER
LIKES
-
+ MISC
*/
/* Colors:
@@ -855,6 +856,54 @@ li.navigation_more ul li {
background: white;
}
+/* ***************************************
+ WIDGETS
+*************************************** */
+.widget_column {
+ float: right;
+ min-height: 15px;
+}
+.widget_col_1 {
+ width: 100%;
+}
+.widget_col_2 {
+ width: 48%;
+ margin-right: 4%;
+}
+.widget_col_3 {
+ width: 32%;
+ margin-right: 2%;
+}
+.widget_col_4 {
+ width: 23.5%;
+ margin-right: 2%;
+}
+.widget_first_col {
+ margin-right: 0;
+}
+.widget {
+ background-color: #dedede;
+ padding: 2px;
+ margin-bottom: 15px;
+}
+.widget_title {
+ height: 30px;
+ line-height: 30px;
+}
+.widget_title h3 {
+ padding: 0 5px;
+}
+.widget_content {
+ background-color: #ffffff;
+ padding: 10px;
+}
+.drag_handle {
+ cursor: move;
+}
+.widget_placeholder {
+ border: 2px dashed #dedede;
+ margin-bottom: 15px;
+}
/* ***************************************
LOGIN / REGISTER
@@ -1653,3 +1702,12 @@ p.elgg_likes_owner {
.user_picker_entry .delete_button {
margin-right:10px;
}
+
+/* ***************************************
+ MISC
+*************************************** */
+#dashboard_info {
+ float: left;
+ width: 66%;
+ margin-bottom: 15px;
+} \ No newline at end of file
diff --git a/views/default/layouts/widgets.php b/views/default/layouts/widgets.php
index d114edfcf..21d942080 100644
--- a/views/default/layouts/widgets.php
+++ b/views/default/layouts/widgets.php
@@ -1,337 +1,44 @@
<?php
-
- /**
- * Elgg widget layout
- */
-
- $widgettypes = get_widget_types();
-
- $owner = elgg_get_page_owner();
-
- $area1widgets = get_widgets(elgg_get_page_owner_guid(), elgg_get_context(), 1);
- $area2widgets = get_widgets(elgg_get_page_owner_guid(), elgg_get_context(), 2);
- $area3widgets = get_widgets(elgg_get_page_owner_guid(), elgg_get_context(), 3);
-
- if (empty($area1widgets) && empty($area2widgets) && empty($area3widgets)) {
-
- if (isset($vars['area3'])) $vars['area1'] = $vars['area3'];
- if (isset($vars['area4'])) $vars['area2'] = $vars['area4'];
-
- }
-
- if (is_array($widgettypes) && sizeof($widgettypes) > 0 && $owner && $owner->canEdit()) {
-
-
-
- if(get_loggedin_userid() == elgg_get_page_owner_guid() || ($owner instanceof ElggGroup && $owner->canEdit())){
-
- if (elgg_get_context() == "profile") {
- ?>
- <!-- add remove widget button -->
- <div class="add_widgets" style="margin:-18px 0 10px;">
- <a href="javascript:void(0);" class="action_button toggle_customise_edit_panel"><?php echo(elgg_echo('dashboard:configure')); ?></a>
- </div><div class="clearfloat"></div>
- <?php
- }
- }
- ?>
-
-<div id="customise_editpanel" class="hidden">
-
-<div id="customise_editpanel_rhs">
-<h2><?php echo elgg_echo("widgets:gallery"); ?></h2>
-<div id="widget_picker_gallery">
-
-
-<?php
-
- foreach($widgettypes as $handler => $widget) {
-
-?>
-
-<table class="draggable_widget" cellspacing="0"><tr><td>
- <h3>
- <?php echo $widget->name; ?>
- <input type="hidden" name="multiple" value="<?php if ((isset($widget->handler)) && (isset($widgettypes[$widget->handler]->multiple))) echo $widgettypes[$widget->handler]->multiple; ?>" />
- <input type="hidden" name="side" value="<?php if ((isset($widget->handler)) && (isset($widgettypes[$widget->handler])) && (is_array($widgettypes[$widget->handler]->positions))) echo in_array('side',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="main" value="<?php if ((isset($widget->handler)) && (isset($widgettypes[$widget->handler])) && (is_array($widgettypes[$widget->handler]->positions))) echo in_array('main',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="handler" value="<?php echo htmlentities($handler); ?>" />
- <input type="hidden" name="description" value="<?php echo htmlentities($widget->description, null, 'UTF-8'); ?>" />
- <input type="hidden" name="guid" value="0" />
- </h3>
-</td>
-<td width="17px" align="right"></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="14" height="14" class="more_info" /></a></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="15" height="15" class="drag_handle" /></a></td>
-</tr></table>
-
-<?php
- }
-?>
-
-<br /><!-- bit of space at the bottom of the widget gallery -->
-
-</div><!-- /#customise_editpanel_rhs -->
-</div><!-- /#widget_picker_gallery -->
-
-
-<div class="customise_editpanel_instructions">
-<h2><?php echo elgg_echo('widgets:add'); ?></h2>
-<?php echo elgg_view('output/longtext', array('value' => elgg_echo('widgets:add:description'))); ?>
-</div>
-
-
-<div id="customise_page_view">
-
-<table cellspacing="0">
- <tr>
- <td colspan="2" align="left" valign="top">
-
- <?php
-if (elgg_get_context() != "profile") { /* on groups */
- ?>
-
- <h2 class="profile_box"><?php echo elgg_echo("widgets:profilebox"); ?></h2>
- <div id="profile_box_widgets">
- <p><small><?php echo elgg_echo('widgets:position:fixed'); ?></small></p>
- </div>
-
- <?php
- }
- ?>
-
- </td>
-
-
- <td rowspan="2" align="left" valign="top">
- <h2><?php echo elgg_echo("widgets:rightcolumn"); ?></h2>
- <div id="rightcolumn_widgets" <?php if (elgg_get_context() != "profile") echo "class=\"long\""; ?> >
- <?php
- $rightcolumn_widgets = "";
- if (is_array($area3widgets) && sizeof($area3widgets) > 0) {
- foreach($area3widgets as $widget) {
- if (!empty($rightcolumn_widgets)) {
- $rightcolumn_widgets .= "::";
- }
- $rightcolumn_widgets .= "{$widget->handler}::{$widget->getGUID()}";
- ?>
-
- <table class="draggable_widget" cellspacing="0"><tr><td width="149px">
- <h3>
- <?php echo $widgettypes[$widget->handler]->name; ?>
- <input type="hidden" name="handler" value="<?php
- echo $widget->handler;
- ?>" />
- <input type="hidden" name="multiple" value="<?php echo $widgettypes[$widget->handler]->multiple; ?>" />
- <input type="hidden" name="side" value="<?php echo in_array('side',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="main" value="<?php echo in_array('main',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="description" value="<?php echo htmlentities($widgettypes[$widget->handler]->description); ?>" />
- <input type="hidden" name="guid" value="<?php echo $widget->getGUID(); ?>" />
- </h3>
- </td>
- <td width="17px" align="right"></td>
- <td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="14" height="14" class="more_info" /></a></td>
- <td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="15" height="15" class="drag_handle" /></a></td>
- </tr></table>
-
- <?php
-
- }
- }
- ?>
-
- </div>
- </td><!-- /rightcolumn td -->
-
- </tr>
-
- <tr>
-
-<td>
-<h2><?php echo elgg_echo("widgets:leftcolumn"); ?></h2>
-<div id="leftcolumn_widgets">
-
-<?php
- $leftcolumn_widgets = "";
- if (is_array($area1widgets) && sizeof($area1widgets) > 0) {
- foreach($area1widgets as $widget) {
- if (!empty($leftcolumn_widgets)) {
- $leftcolumn_widgets .= "::";
- }
- $leftcolumn_widgets .= "{$widget->handler}::{$widget->getGUID()}";
-?>
-
-<table class="draggable_widget" cellspacing="0"><tr><td width="149px">
- <h3>
- <?php echo $widgettypes[$widget->handler]->name; ?>
- <input type="hidden" name="handler" value="<?php
- echo $widget->handler;
- ?>" />
- <input type="hidden" name="multiple" value="<?php echo $widgettypes[$widget->handler]->multiple; ?>" />
- <input type="hidden" name="side" value="<?php echo in_array('side',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="main" value="<?php echo in_array('main',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="description" value="<?php echo htmlentities($widgettypes[$widget->handler]->description); ?>" />
- <input type="hidden" name="guid" value="<?php echo $widget->getGUID(); ?>" />
- </h3>
-</td>
-<td width="17px" align="right"></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="14" height="14" class="more_info" /></a></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="15" height="15" class="drag_handle" /></a></td>
-</tr></table>
-
-<?php
-
+/**
+ * Elgg widgets layout
+ *
+ * @uses $vars['box'] Optional display box at the top of layout
+ * @uses $vars['num_columns'] Number of widget columns for this layout
+ */
+
+$owner = elgg_get_page_owner();
+$context = elgg_get_context();
+elgg_push_context('widgets');
+
+if (isset($vars['box'])) {
+ echo $vars['box'];
+}
+
+$num_columns = 3;
+if (isset($vars['num_columns'])) {
+ $num_columns = $vars['num_columns'];
+}
+
+$widget_class = "widget_col_$num_columns";
+for ($column_index = 1; $column_index <= $num_columns; $column_index++) {
+ $widgets = get_widgets($owner->guid, $context, $column_index);
+
+ // test code during design and implementation
+ $widget1 = new ElggWidget();
+ $widget1->handler = 'test';
+ $widget2 = new ElggWidget();
+ $widget2->handler = 'test';
+ $widgets = array($widget1, $widget2);
+
+ $first = ($column_index == 1) ? 'widget_first_col' : '';
+
+ echo "<div class=\"widget_column $widget_class $first\">";
+ if (is_array($widgets) && sizeof($widgets) > 0) {
+ foreach ($widgets as $widget) {
+ echo elgg_view_entity($widget);
}
}
-?>
-</div>
-</td>
-
-<td>
-
-<h2><?php echo elgg_echo("widgets:middlecolumn"); ?></h2>
-<div id="middlecolumn_widgets">
-
-<?php
- $middlecolumn_widgets = "";
- if (is_array($area2widgets) && sizeof($area2widgets) > 0) {
- foreach($area2widgets as $widget) {
- if (!empty($middlecolumn_widgets)) {
- $middlecolumn_widgets .= "::";
- }
- $middlecolumn_widgets .= "{$widget->handler}::{$widget->getGUID()}";
-?>
-
-<table class="draggable_widget" cellspacing="0"><tr><td width="149px">
- <h3>
- <?php echo $widgettypes[$widget->handler]->name; ?>
- <input type="hidden" name="handler" value="<?php
- echo $widget->handler;
- ?>" />
- <input type="hidden" name="multiple" value="<?php echo $widgettypes[$widget->handler]->multiple; ?>" />
- <input type="hidden" name="side" value="<?php echo in_array('side',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="main" value="<?php echo in_array('main',$widgettypes[$widget->handler]->positions); ?>" />
- <input type="hidden" name="description" value="<?php echo htmlentities($widgettypes[$widget->handler]->description); ?>" />
- <input type="hidden" name="guid" value="<?php echo $widget->getGUID(); ?>" />
- </h3>
-</td>
-<td width="17px" align="right"></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="14" height="14" class="more_info" /></a></td>
-<td width="17px" align="right"><a href="#"><img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" width="15" height="15" class="drag_handle" /></a></td>
-</tr></table>
-
-<?php
-
- }
- }
-?>
-
-</div>
-</td>
-
-
-
-
-
-
-</tr>
-</table>
-
-</div><!-- /#customise_page_view -->
-
-<form action="<?php echo elgg_get_site_url(); ?>action/widgets/reorder" method="post">
-<?php echo elgg_view('input/securitytoken'); ?>
-<textarea type="textarea" value="Left widgets" style="display:none" name="debugField1" id="debugField1" /><?php echo $leftcolumn_widgets; ?></textarea>
-<textarea type="textarea" value="Middle widgets" style="display:none" name="debugField2" id="debugField2" /><?php echo $middlecolumn_widgets; ?></textarea>
-<textarea type="textarea" value="Right widgets" style="display:none" name="debugField3" id="debugField3" /><?php echo $rightcolumn_widgets; ?></textarea>
-
-<input type="hidden" name="context" value="<?php echo elgg_get_context(); ?>" />
-<input type="hidden" name="owner" value="<?php echo elgg_get_page_owner_guid(); ?>" />
-<input type="submit" onfocus="blur()" value="<?php echo elgg_echo('save'); ?>" class="submit_button" onclick="$('a.Action_Button.toggle_customise_edit_panel').click();" />
-<input type="button" onfocus="blur()" value="<?php echo elgg_echo('cancel'); ?>" class="cancel_button" onclick="$('a.Action_Button.toggle_customise_edit_panel').click();" />
-
-</form>
-</div><!-- /customise_editpanel -->
-
-<?php
-
- }
-
-?>
-
-
-
-<table cellspacing="0" id="widget_table">
- <tr>
- <td colspan="2" align="left" valign="top" height="1px">
- <!-- profile box or 'dashboard info' notice -->
- <?php if (isset($vars['area1'])) echo $vars['area1']; ?>
- </td>
- <td rowspan="2" align="left" valign="top" height="100%">
-
- <?php
- if(get_loggedin_userid() == elgg_get_page_owner_guid() || ($owner instanceof ElggGroup && $owner->canEdit())){
-
- if (elgg_get_context() != "profile") {
- ?>
- <!-- customise page button appears in different place on groups widgets -->
- <div class="add_widgets">
- <a href="javascript:void(0);" class="action_button toggle_customise_edit_panel"><?php echo(elgg_echo('dashboard:configure')); ?></a>
- </div>
- <?php
- }
- }
- ?>
-
-
- <div id="widgets_right">
- <?php
-
- if (is_array($area3widgets) && sizeof($area3widgets) > 0)
- foreach($area3widgets as $widget) {
- echo elgg_view_entity($widget);
- }
-
- ?>
-
- </div><!-- /#widgets_right -->
- </td>
- </tr>
- <tr>
- <td align="left" valign="top">
-
- <!-- left widgets -->
- <div id="widgets_left">
-
- <?php
-
- if (is_array($area1widgets) && sizeof($area1widgets) > 0)
- foreach($area1widgets as $widget) {
- echo elgg_view_entity($widget);
- }
-
- ?>
-
- </div><!-- /#widgets_left -->
-
- </td>
- <td align="left" valign="top">
-
- <!-- widgets middle -->
- <div id="widgets_middle">
-
- <?php if (isset($vars['area2'])) echo $vars['area2']; ?>
- <?php
-
- if (is_array($area2widgets) && sizeof($area2widgets) > 0)
- foreach($area2widgets as $widget) {
- echo elgg_view_entity($widget);
- }
-
- ?>
-
- </div><!-- /#widgets_middle -->
+ echo '</div>';
+}
- </td>
- </tr>
-</table>
+elgg_pop_context(); \ No newline at end of file
diff --git a/views/default/widgets/wrapper.php b/views/default/widgets/wrapper.php
index c89a878ca..13d8da50e 100644
--- a/views/default/widgets/wrapper.php
+++ b/views/default/widgets/wrapper.php
@@ -6,13 +6,7 @@
* @subpackage Core
*/
-static $widgettypes;
-
-$callback = get_input('callback');
-
-if (!isset($widgettypes)) {
- $widgettypes = get_widget_types();
-}
+$widgettypes = get_widget_types();
if ($vars['entity'] instanceof ElggObject && $vars['entity']->getSubtype() == 'widget') {
$handler = $vars['entity']->handler;
@@ -25,78 +19,12 @@ if ($vars['entity'] instanceof ElggObject && $vars['entity']->getSubtype() == 'w
$title = elgg_echo("error");
}
-if ($callback != "true") {
-
- ?>
-
- <div id="widget<?php echo $vars['entity']->getGUID(); ?>">
- <div class="collapsable_box">
- <div class="collapsable_box_header">
- <a href="javascript:void(0);" class="toggle_box_contents">-</a><?php if ($vars['entity']->canEdit()) { ?><a href="javascript:void(0);" class="toggle_box_edit_panel"><?php echo elgg_echo('edit'); ?></a><?php } ?>
- <h1><?php echo $title; ?></h1>
+?>
+<div class="widget draggable">
+ <div class="widget_title drag_handle">
+ <h3>Widget Title</h3>
+ </div>
+ <div class="widget_content">
+ <p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
</div>
- <?php
-
- if ($vars['entity']->canEdit()) {
- ?>
- <div class="collapsable_box_editpanel"><?php
-
- echo elgg_view('widgets/editwrapper',
- array(
- 'body' => elgg_view("widgets/{$handler}/edit",$vars),
- 'entity' => $vars['entity']
- )
- );
-
- ?></div><!-- /collapsable_box_editpanel -->
- <?php
- }
-
- ?>
- <div class="collapsable_box_content">
- <?php
-
- echo "<div id=\"widgetcontent{$vars['entity']->getGUID()}\">";
-} else { // end if callback != "true"
- if (elgg_view_exists("widgets/{$handler}/view")) {
- echo elgg_view("widgets/{$handler}/view",$vars);
- } else {
- echo elgg_echo('widgets:handlernotfound');
- }
-
- ?>
-
- <script language="javascript">
- $(document).ready(function(){
- setup_avatar_menu();
- });
-
- </script>
- <?php
-}
-
-if ($callback != "true") {
- echo elgg_view('ajax/loader');
- echo "</div>";
-
- ?>
- </div><!-- /.collapsable_box_content -->
- </div><!-- /.collapsable_box -->
- </div>
-
-<script type="text/javascript">
-$(document).ready(function() {
-
- $("#widgetcontent<?php echo $vars['entity']->getGUID(); ?>").load("<?php echo elgg_get_site_url(); ?>pg/view/<?php echo $vars['entity']->getGUID(); ?>?shell=no&username=<?php echo elgg_get_page_owner()->username; ?>&context=widget&callback=true");
-
- // run function to check for widgets collapsed/expanded state
- var forWidget = "widget<?php echo $vars['entity']->getGUID(); ?>";
- widget_state(forWidget);
-
-
-});
-</script>
-
-<?php
-
-} \ No newline at end of file
+</div>
generated by cgit v1.2.3 (git 2.39.1) at 2024-06-27 11:17:19 +0000