Skip to content

Commit

Permalink
Improved performance of rendering large index pages, by replacing ima…
Browse files Browse the repository at this point in the history 
…ges in the tables by spans
  • Loading branch information
Dimitri van Heesch committed Jan 2, 2014
1 parent d5fb697 commit 956a7fb
Show file tree
Hide file tree
Showing 4 changed files with 136 additions and 115 deletions.
80 changes: 77 additions & 3 deletions src/doxygen.css
View file
Expand Up @@ -670,12 +670,12 @@ span.mlabel {

/* @end */

/* these are for tree view when not used as main index */
/* these are for tree view inside a (index) page */

div.directory {
margin: 10px 0px;
border-top: 1px solid #A8B8D9;
border-bottom: 1px solid #A8B8D9;
border-top: 1px solid ##AA;
border-bottom: 1px solid ##AA;
width: 100%;
}

Expand Down Expand Up @@ -734,6 +734,80 @@ div.directory {
color: ##50;
}

.arrow {
color: ##AA;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: pointer;
font-size: 80%;
display: inline-block;
width: 16px;
height: 22px;
}

.icon {
font-family: Arial, Helvetica;
font-weight: bold;
font-size: 12px;
height: 14px;
width: 16px;
display: inline-block;
background-color: ##88;
color: white;
text-align: center;
border-radius: 4px;
margin-left: 2px;
margin-right: 2px;
}

.icona {
width: 24px;
height: 22px;
display: inline-block;
}

.iconfopen {
width: 24px;
height: 18px;
margin-bottom: 4px;
background-image:url('ftv2folderopen.png');
background-position: 0px -4px;
background-repeat: repeat-y;
vertical-align:top;
display: inline-block;
}

.iconfclosed {
width: 24px;
height: 18px;
margin-bottom: 4px;
background-image:url('ftv2folderclosed.png');
background-position: 0px -4px;
background-repeat: repeat-y;
vertical-align:top;
display: inline-block;
}

.icondoc {
width: 24px;
height: 18px;
margin-bottom: 4px;
background-image:url('ftv2doc.png');
background-position: 0px -4px;
background-repeat: repeat-y;
vertical-align:top;
display: inline-block;
}

table.directory {
font: 400 14px Roboto,sans-serif;
}

/* @end */

div.dynheader {
margin-top: 8px;
-webkit-touch-callout: none;
Expand Down
54 changes: 27 additions & 27 deletions src/dynsections.js
View file
Expand Up @@ -24,19 +24,20 @@ function updateStripes()
$('table.directory tr').
removeClass('even').filter(':visible:even').addClass('even');
}

function toggleLevel(level)
{
$('table.directory tr').each(function(){
$('table.directory tr').each(function() {
var l = this.id.split('_').length-1;
var i = $('#img'+this.id.substring(3));
var a = $('#arr'+this.id.substring(3));
if (l<level+1) {
i.attr('src','ftv2folderopen.png');
a.attr('src','ftv2mnode.png');
i.removeClass('iconfopen iconfclosed').addClass('iconfopen');
a.html('&#9660;');
$(this).show();
} else if (l==level+1) {
i.attr('src','ftv2folderclosed.png');
a.attr('src','ftv2pnode.png');
i.removeClass('iconfclosed iconfopen').addClass('iconfclosed');
a.html('&#9658;');
$(this).show();
} else {
$(this).hide();
Expand All @@ -47,34 +48,33 @@ function toggleLevel(level)

function toggleFolder(id)
{
//The clicked row
// the clicked row
var currentRow = $('#row_'+id);
var currentRowImages = currentRow.find("img");

//All rows after the clicked row
// all rows after the clicked row
var rows = currentRow.nextAll("tr");

//Only match elements AFTER this one (can't hide elements before)
var childRows = rows.filter(function() {
var re = new RegExp('^row_'+id+'\\d+_$', "i"); //only one sub
return this.id.match(re);
});
var re = new RegExp('^row_'+id+'\\d+_$', "i"); //only one sub

//First row is visible we are HIDING
if (childRows.filter(':first').is(':visible')===true) {
currentRowImages.filter("[id^=arr]").attr('src', 'ftv2pnode.png');
currentRowImages.filter("[id^=img]").attr('src', 'ftv2folderclosed.png');
rows.filter("[id^=row_"+id+"]").hide();
} else { //We are SHOWING
//All sub images
var childImages = childRows.find("img");
var childImg = childImages.filter("[id^=img]");
var childArr = childImages.filter("[id^=arr]");
// only match elements AFTER this one (can't hide elements before)
var childRows = rows.filter(function() { return this.id.match(re); });

currentRow.find("[id^=arr]").attr('src', 'ftv2mnode.png'); //open row
currentRow.find("[id^=img]").attr('src', 'ftv2folderopen.png'); //open row
childImg.attr('src','ftv2folderclosed.png'); //children closed
childArr.attr('src','ftv2pnode.png'); //children closed
// first row is visible we are HIDING
if (childRows.filter(':first').is(':visible')===true) {
// replace down arrow by right arrow for current row
var currentRowSpans = currentRow.find("span");
currentRowSpans.filter(".iconfopen").removeClass("iconfopen").addClass("iconfclosed");
currentRowSpans.filter(".arrow").html('&#9658;');
rows.filter("[id^=row_"+id+"]").hide(); // hide all children
} else { // we are SHOWING
// replace right arrow by down arrow for current row
var currentRowSpans = currentRow.find("span");
currentRowSpans.filter(".iconfclosed").removeClass("iconfclosed").addClass("iconfopen");
currentRowSpans.filter(".arrow").html('&#9660;');
// replace down arrows by right arrows for child rows
var childRowsSpans = childRows.find("span");
childRowsSpans.filter(".iconfopen").removeClass("iconfopen").addClass("iconfclosed");
childRowsSpans.filter(".arrow").html('&#9658;');
childRows.show(); //show all children
}
updateStripes();
Expand Down
115 changes: 31 additions & 84 deletions src/ftvhelp.cpp
View file
Expand Up @@ -234,6 +234,7 @@ static unsigned char doc_a_png[528] =
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
};

#if 0
static unsigned char module_png[528] =
{
255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,
Expand Down Expand Up @@ -338,6 +339,7 @@ static unsigned char letter_a_png[528] =
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
};
#endif


static unsigned char arrow_right_png[352] =
Expand Down Expand Up @@ -507,6 +509,7 @@ struct FTVImageInfo

//extern FTVImageInfo image_info[];

#if 0
#define FTVIMG_blank 0
#define FTVIMG_doc 1
#define FTVIMG_folderclosed 2
Expand Down Expand Up @@ -553,16 +556,17 @@ static FTVImageInfo image_info[] =
{ "M", "ftv2mo.png", 0 /*ftv2vertline_png*/ /*,352*/,24,22 },
{ 0, 0, 0 /*, 0*/, 0, 0 }
};
#endif

static ColoredImgDataItem ftv_image_data[] =
{
{ "ftv2blank.png", 16, 22, blank_png, blank_png },
{ "ftv2doc.png", 24, 22, doc_png, doc_a_png },
{ "ftv2folderclosed.png", 24, 22, folderclosed_png, folderclosed_a_png },
{ "ftv2folderopen.png", 24, 22, folderopen_png, folderopen_a_png },
{ "ftv2ns.png", 24, 22, namespace_png, letter_a_png },
{ "ftv2mo.png", 24, 22, module_png, letter_a_png },
{ "ftv2cl.png", 24, 22, class_png, letter_a_png },
// { "ftv2ns.png", 24, 22, namespace_png, letter_a_png },
// { "ftv2mo.png", 24, 22, module_png, letter_a_png },
// { "ftv2cl.png", 24, 22, class_png, letter_a_png },
{ "ftv2lastnode.png", 16, 22, blank_png, blank_png },
{ "ftv2link.png", 24, 22, doc_png, doc_a_png },
{ "ftv2mlastnode.png", 16, 22, arrow_down_png, arrow_down_a_png },
Expand Down Expand Up @@ -784,64 +788,23 @@ QCString FTVHelp::generateIndentLabel(FTVNode *n,int level)
return result;
}

void FTVHelp::generateIndent(FTextStream &t, FTVNode *n,int level, bool opened)
void FTVHelp::generateIndent(FTextStream &t, FTVNode *n,bool opened)
{
if (n->parent)
int indent=0;
FTVNode *p = n->parent;
while (p) { indent++; p=p->parent; }
if (n->isDir)
{
generateIndent(t,n->parent,level+1,opened);
QCString dir = opened ? "&#9660;" : "&#9658;";
t << "<span style=\"width:" << (indent*16) << "px;display:inline-block;\">&#160;</span>"
<< "<span id=\"arr_" << generateIndentLabel(n,0) << "\" class=\"arrow\" ";
t << "onclick=\"toggleFolder('" << generateIndentLabel(n,0) << "')\"";
t << ">" << dir
<< "</span>";
}
// from the root up to node n do...
if (level==0) // item before a dir or document
else
{
if (n->isLast)
{
if (n->isDir)
{
t << "<img id=\"arr_" << generateIndentLabel(n,0)
<< "\" ";
if (opened)
t << FTV_IMGATTRIBS(mlastnode);
else
t << FTV_IMGATTRIBS(plastnode);
t << "onclick=\"toggleFolder('"
<< generateIndentLabel(n,0)
<< "')\"/>";
}
else
{
t << "<img " << FTV_IMGATTRIBS(lastnode) << "/>";
}
}
else
{
if (n->isDir)
{
t << "<img id=\"arr_" << generateIndentLabel(n,0)
<< "\" ";
if (opened)
t << FTV_IMGATTRIBS(mnode);
else
t << FTV_IMGATTRIBS(pnode);
t << "onclick=\"toggleFolder('"
<< generateIndentLabel(n,0)
<< "')\"/>";
}
else
{
t << "<img " << FTV_IMGATTRIBS(node) << "/>";
}
}
}
else // item at another level
{
if (n->isLast)
{
t << "<img " << FTV_IMGATTRIBS(blank) << "/>";
}
else
{
t << "<img " << FTV_IMGATTRIBS(vertline) << "/>";
}
t << "<span style=\"width:" << ((indent+1)*16) << "px;display:inline-block;\">&#160;</span>";
}
}

Expand Down Expand Up @@ -912,7 +875,7 @@ void FTVHelp::generateTree(FTextStream &t, const QList<FTVNode> &nl,int level,in
index++;
t << "><td class=\"entry\">";
bool nodeOpened = level+1<maxLevel;
generateIndent(t,n,0,nodeOpened);
generateIndent(t,n,nodeOpened);
if (n->isDir)
{
if (n->def && n->def->definitionType()==Definition::TypeGroup)
Expand All @@ -925,29 +888,19 @@ void FTVHelp::generateTree(FTextStream &t, const QList<FTVNode> &nl,int level,in
}
else if (n->def && n->def->definitionType()==Definition::TypeNamespace)
{
t << "<img ";
t << FTV_IMGATTRIBS(ns);
t << "/>";
t << "<span class=\"icona\"><span class=\"icon\">N</span></span>";
}
else if (n->def && n->def->definitionType()==Definition::TypeClass)
{
t << "<img ";
t << FTV_IMGATTRIBS(cl);
t << "/>";
t << "<span class=\"icona\"><span class=\"icon\">C</span></span>";
}
else
{
t << "<img ";
t << "id=\"img_" << generateIndentLabel(n,0)
<< "\" ";
if (nodeOpened)
t << FTV_IMGATTRIBS(folderopen);
else
t << FTV_IMGATTRIBS(folderclosed);
t << "onclick=\"toggleFolder('"
<< generateIndentLabel(n,0)
<< "')\"";
t << "/>";
t << "<span id=\"img_" << generateIndentLabel(n,0)
<< "\" class=\"iconf"
<< (nodeOpened?"open":"closed")
<< "\" onclick=\"toggleFolder('" << generateIndentLabel(n,0)
<< "')\">&#160;</span>";
}
generateLink(t,n);
t << "</td><td class=\"desc\">";
Expand Down Expand Up @@ -983,21 +936,15 @@ void FTVHelp::generateTree(FTextStream &t, const QList<FTVNode> &nl,int level,in
}
else if (n->def && n->def->definitionType()==Definition::TypeNamespace)
{
t << "<img ";
t << FTV_IMGATTRIBS(ns);
t << "/>";
t << "<span class=\"icona\"><span class=\"icon\">N</span></span>";
}
else if (n->def && n->def->definitionType()==Definition::TypeClass)
{
t << "<img ";
t << FTV_IMGATTRIBS(cl);
t << "/>";
t << "<span class=\"icona\"><span class=\"icon\">C</span></span>";
}
else
{
t << "<img ";
t << FTV_IMGATTRIBS(doc);
t << "/>";
t << "<span class=\"icondoc\"></span>";
}
if (srcRef)
{
Expand Down
2 changes: 1 addition & 1 deletion src/ftvhelp.h
View file
Expand Up @@ -64,7 +64,7 @@ class FTVHelp : public IndexIntf
//bool generateJSTree(FTextStream &tidx,FTextStream &t,const QList<FTVNode> &nl,int level,bool &first);
//bool generateJSTreeTopLevel(FTextStream &tidx,FTextStream &t,const QList<FTVNode> &nl,int level,bool &first);
QCString generateIndentLabel(FTVNode *n,int level);
void generateIndent(FTextStream &t,FTVNode *n,int level,bool opened);
void generateIndent(FTextStream &t,FTVNode *n,bool opened);
void generateLink(FTextStream &t,FTVNode *n);
//void generateJSLink(FTextStream &t,FTVNode *n);
QList<FTVNode> *m_indentNodes;
Expand Down

0 comments on commit 956a7fb

Please sign in to comment.