Dependency Graph
View Issue Details
| ID | Project | Category | View Status | Date Submitted | Last Update |
|---|---|---|---|---|---|
| 0020224 | mantisbt | code cleanup | public | 2015-10-25 06:05 | 2016-10-20 08:05 |
| Reporter | dregad | Assigned To | cproensa | ||
| Priority | normal | Severity | minor | Reproducibility | N/A |
| Status | closed | Resolution | won't fix | ||
| Summary | 0020224: Refactor collapse API | ||||
| Description | As reported by cproensa in 0019508:0051686, the collapse API's suffers from design issues, e.g.
It should be refactored to better handle these issues. | ||||
| Additional Information | cproensa's suggestions for improvements:
[div "frame"] inner.hide() / inner.show()
| ||||
| Tags | No tags attached. | ||||
| Attached Files | |||||
|
what timeframe do you suggest? i guess this would imply:
|
|
|
Given my lack of available time I am not suggesting any timeframe ;-) Your proposed plan is more or less what I had in mind. |
|
|
i am no expert in css stuff, but this is somehow what i had in mind: with that scheme, all the html could be done even without any call to a collapse_api. This can be retrofitted to the section tables like those in bug_view. altough, the ideal goal is to use table-less sections (there already exists the section-container class...) |
|
|
the updated skecth is this one, srry: |
|
|
I you can live without the alternating contents in header, and keep a strict structure, an almost transparent approach can be presented: This, however, requires rewrite the section as div containers (which may be a good point anyway) |
|
|
Thanks for your research.
This is a legacy from <= 1.2, and one of the things that need to be changed; a lot of this kind of cleanup has already been implemented in 1.3... Turning these into divs and only keeping html tables to display actual tabular data within the divs, would be the right thing to do IMO, even though it requires additional effort.
Both look like nice solutions, v17 seems cleaner.
Need to check how frequently this is actually used, and how important that actually is; if it's only Sponsorship, I'm pretty sure we can live without it.
Relying on an API has the advantage of ensuring consistency across the board, by abstracting the details of containers, classes, etc. |
|
of course, thats important. attached is a patch to test the concept: included in teh patch there is a rewrite of "view_user_page.php", which i think its an existing example of a section layout. As for the actual HTML, the only modification done in that page is: <div class="section-container"> to: <div class="section-container collapse"> and ultimately, using a function to recall user preference: <div class="section-container collapse <?php echo collapse_get_default_state()?>"> I tried to get this one to be simple and consistent with current formatting, and for the moment i see it nice.old code can be so enough with this, keep it as a possiblity. 0001-adding-collapseconcpet_adaptview_user_page.php.patch (2,181 bytes)
From c24c1d8e3f9bbfca6969e16de86a8088e5a611f7 Mon Sep 17 00:00:00 2001
From: Carlos Proensa <proensa@gmail.com>
Date: Tue, 27 Oct 2015 23:25:35 +0100
Subject: [PATCH] adding collapse concpet & adapt view_user_page.php
---
css/default.css | 6 ++++++
javascript/common.js | 8 ++++++++
view_user_page.php | 2 +-
3 files changed, 15 insertions(+), 1 deletion(-)
diff --git a/css/default.css b/css/default.css
index 48f219c..3d6377d 100644
--- a/css/default.css
+++ b/css/default.css
@@ -804,3 +804,9 @@ div.timeline * div.action { padding-top: 3px; }
/* bug_view_inc bug action buttons */
.details-footer { padding: 3px 10px 2px 0; }
.details-buttons { float: left; width: auto; }
+
+.js .collapse > h2:before { padding-right: 5px; content: url("../images/minus.png"); }
+.js .collapse.collapsed > h2:before { padding-right: 5px; content: url("../images/plus.png"); }
+.js .collapse.collapsed > *:not(h2) { display:none; }
+.js div.section-container.collapse { display: block; }
+.js div.section-container.collapse > h2 { float: none; }
\ No newline at end of file
diff --git a/javascript/common.js b/javascript/common.js
index 34c1f91..c842003 100644
--- a/javascript/common.js
+++ b/javascript/common.js
@@ -35,6 +35,14 @@ if (a!= -1) {
style_display = 'block';
$(document).ready( function() {
+ document.documentElement.className += " js "
+ $('.collapse > h2').click(function (event) {
+ $(this).parent('.collapse').toggleClass('collapsed');
+ });
+ $('.collapse > h2 > *').click(function (event) {
+ event.stopPropagation();
+ });
+
$('.collapse-open').show();
$('.collapse-closed').hide();
$('.collapse-link').click( function(event) {
diff --git a/view_user_page.php b/view_user_page.php
index 690e1f9..30c0328 100644
--- a/view_user_page.php
+++ b/view_user_page.php
@@ -74,7 +74,7 @@ $u_realname = user_get_realname( $u_id );
html_page_top();
?>
-<div class="section-container">
+<div class="section-container collapse">
<h2><?php echo lang_get( 'view_account_title' ) ?></h2>
<div class="field-container">
<span class="display-label"><span><?php echo lang_get( 'username' ) ?></span></span>
--
1.9.1
|
|
|
As this refers to v1.3, and this api has been already refactored for v2, i'm closing this as no change. |
|
related to
child of
duplicate of