var g_listQueuedYouth = new Array();

function doPublish()
{
    clearActive();

    if ( ! isOnline() )
    {
        openLightBox( { text: "You must be on-line to publish record sheets.", canClose: true } );
        return;
    }

    if ( ! confirm( "Re-publish record sheets before viewing them?" ) )
    {
        addPage( "#record-sheets" );        // just go to the page
        return;
    }

    $('#record-sheets-youth li[youthid]').html("Generating...").removeClass( "arrow" ).addClass( "noaccess" );
    $('#record-sheets-section li').html("Generating...").removeClass( "arrow" ).addClass( "noaccess" );
    addPage( "#record-sheets" );

    scorecardAllYouth( function() {
        g_listQueuedYouth = new Array();
        for ( var youthID in g_mapYouthNames )
            g_listQueuedYouth.push( youthID );

        g_listQueuedYouth.push( -1 );  // do the summary last

        // start with the first, a successful ajax publish will trigger the next 
        doPublishYouth( g_listQueuedYouth.shift() );
    } );
};

function _renderCreole( strText )
{
    var temp = $( '#creole-temp' );
    temp.empty();

    g_creole.parse( temp[0], strText );
    temp.each( function() {
        $(this).children( 'ul' ).addClass( 'simple' );
    });

    return temp.html();
};

function _addOutingDetails( outingID, s )
{
    var outing = getOuting( outingID );

    // aoeu TODO this has to NOT use data-uri's
    var htmlOuting = buildEventReportRow( outing.labels, false );

    var html = "";
    html += s + "<table class='award-section' style='border: none;'>\n";
    html += s + "  <thead>\n";
    html += s + "    <tr><th style='text-align:left;'>" + htmlOuting + getOutingName( outing ) + "</th></tr>\n";
    html += s + "  </thead>\n";
    html += s + "  <tbody>\n";
    html += s + "    <tr>\n";
    html += s + "      <td>\n";

    html += s + "        <span class='label'>Date:</span>" + formatOutingDateRange( outing ) + "<br/>";
    if ( outing.youth.length > 0 )
    {
        var listYouth = new Array();
        var listOverrides = new Array();
        var mapOverrides = new Array();
        var mapFootnotes = new Array();

        $.each( outing.youth, function( i, youth ) {
            if ( g_dbTables['Youth'][youth.id] !== undefined && g_dbTables['Youth'][youth.id].active )
            {
                listYouth.push( htmlEncode( g_mapYouthNames[youth.id] ) );
                var overrides = getYouthOverrides( youth, false );
                if ( overrides ) 
                {
                    if ( mapOverrides[overrides] === undefined )
                    {
                        listOverrides.push( overrides );
                        mapOverrides[overrides] = new Array();
                        mapFootnotes[overrides] = listOverrides.length;
                    }
                    mapOverrides[overrides].push( youth.id );
                }
            }
        });

        var htmlYouth = "";
        $.each( outing.youth, function( i, youth ) {
            if ( g_dbTables['Youth'][youth.id] !== undefined && g_dbTables['Youth'][youth.id].active )
            {
                if ( htmlYouth != "" )
                    htmlYouth += ", ";
                htmlYouth += htmlEncode( g_mapYouthNames[youth.id] );

                var overrides = getYouthOverrides( youth, false );
                if ( mapOverrides[overrides] !== undefined )
                    htmlYouth += "<sup>" + mapFootnotes[overrides] + "</sup>";
            }
        });
        html += s + "        <span class='label'>Participants:</span>" + htmlYouth + "<br/>";

        var htmlFootnotes = "";
        $.each( listOverrides, function( i, overrides ) {
            htmlFootnotes += "<p class='footnote'><sup>" + (i+1) + "</sup><span>Overridden labels:</span>&nbsp;" + overrides + "</p>";
        });
        if ( htmlFootnotes != "" )
            html += htmlFootnotes;
    }

    if ( outing.leaders !== undefined && outing.leaders.length > 0 )
    {
        var htmlLeaders = "";
        $.each( outing.leaders, function( i, leader ) {
            if ( g_dbTables['Leaders'][leader.id] !== undefined && g_dbTables['Leaders'][leader.id].active )
            {
                if ( htmlLeaders != "" )
                    htmlLeaders += ", ";
                htmlLeaders += htmlEncode( g_mapLeaderNames[leader.id] );
            }
        });
        html += s + "        <span class='label'>Leaders:</span>" + htmlLeaders + "<br/>";
    }

    if ( outing.cost !== undefined && outing.cost.total > 0 )
    {
        html += "        <span class='label'>Cost:</span>$" + outing.cost.total + (outing.cost.program > 0 ? " <span style='color:#621;margin-left:5px;font-weight:normal;font-size:12px;'>($" + outing.cost.program + " program-related)</span>" : "" ) + "<br/>";
    }
    if ( outing.notes != "" )
        html += "        <span class='label'>Description:</span><div class='creole'>" + _renderCreole( outing.notes ) + "<div>";

    if ( outing.leadernotes !== undefined && outing.leadernotes != "" )
        html += "        <span class='label'>Leaders' Notes:</span><div class='creole'>" + _renderCreole( outing.leadernotes ) + "<div>";

    html += s + "      </td>\n";
    html += s + "    </tr>\n";
    html += s + "  </tbody>\n";
    html += s + "</table> <!-- end award-section -->\n";

    return html;
};

function doPublishSummary()
{
    var html = "<!DOCTYPE html>\n";
    html += "<html>\n";
    html += "<head>\n";
    html += "  <meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\">\n";
    html += "  <meta http-equiv='cache-control' content='no-cache, no-store'>\n";
    html += "  <meta http-equiv='expires' content='-1'>\n";
    html += "  <title>" + STR_SECTION + " Record Sheet</title>\n";
    html += "  <meta http-equiv=\"X-UA-Compatible\" content=\"IE=9; IE=8; IE=7\" >\n";

    html += _addCSS( 9 );

    html += "</head>\n";
    html += "<body onload='var re=new RegExp(\"MSIE ([0-9]{1,}[\.0-9]{0,})\"); if(re.exec(navigator.userAgent)!=null){var ver=parseFloat(RegExp.$1);if(ver<8.0)alert(\"This report is optimized for display in IE8, IE9, Firefox, Chrome or Safari.\");}'>\n";
    html += "  <table class=\"wrapper\" width=100%><tbody><tr><td>\n";
    html += "  <div class='title'>" + STR_SECTION + " Record Sheet&nbsp;<span style='color:#ccc;font-size:80%;'>by</span>&nbsp;<span style='color:#a43;'>" + STR_PRODUCT + "</span><div class=\"print\" onclick=\"if(navigator.userAgent.toLowerCase().indexOf('chrome') > -1){if(confirm('Printing in Chrome is still not reliable.  More consistent results will be achieved in Firefox, IE8/9, or Safari.')){window.print();}}else if(confirm('Reports will look best when you select &quot;Shrink to Fit Page Width&quot;, and &quot;Print Background Colors &amp; Images&quot; from Page Setup before printing.')){window.print();}\">Print</div></div>\n";

    html += _addTroopMetaData( "  " );
    html += "  <div class='group-header'>All Events</div>\n";

    var mapOutings = {};
    for ( var key in g_mapOutings )
    {
        var outing = g_mapOutings[key];
        if ( outing === undefined || outing == null )
            continue;       // could be gaps in what looks like an array

        if ( isReminder(outing) )
            continue;

        if ( getOutingMode( outing ) != g_mode )
            continue;

        mapOutings[outing.id] = outing;
    }

    // Insert Outings
    var listOutingIDs = sortOutingsByDate( mapOutings );
    for ( var iOuting = 0; iOuting < listOutingIDs.length; )
    {
        html += "  <table class='main awards outing-details'>\n";
        html += "    <tbody>\n";

        html += "      <tr>\n";
        html += "        <td class='border'> <!-- left column -->\n\n";

        html += _addOutingDetails( listOutingIDs[iOuting++], "          " );

        html += "        </td> <! -- END left column -->\n\n"; 
        html += "        <td></td>\n\n"; 
        html += "        <td " + (iOuting < listOutingIDs.length?"class='border'":"") + "> <!-- right column -->\n\n";

        if ( iOuting < listOutingIDs.length ) 
            html += _addOutingDetails( listOutingIDs[iOuting++], "          " );
        else
            html += "&nbsp;";

        html += "        </td> <! -- END right column -->\n\n"; 
        html += "      </tr> <!-- END first row of awards -->\n\n";

        html += "    </tbody>\n";
        html += "  </table>\n";
    }

    html += "  </td></tr></tbody></table>\n";

    var listSortedYouth = sortMembersByName( "Youth", g_dbTables['Youth'] );
    for ( var iName = 0; iName < listSortedYouth.length; iName++ )
        html += "  <!-- youthid=" + listSortedYouth[iName] + " -->\n";

    html += "</body>\n";
    html += "</html>";

    ajaxPublishReport( -1, html, 3 );
}

function publishMe( bNavigate )
{
    clearActive();
    $('#my-reports-wait').show();
    $('#my-reports-body').hide();
    $('#my-reports-body').empty();

    if ( ! isOnline() )
    {
        openLightBox( { text: "You must be on-line to see your record sheet.", canClose: true } );
        return;
    }

    if ( bNavigate )
        addPage( "#my-reports" );

    g_listQueuedYouth = new Array();
    doPublishYouth( g_currentUser );
};

function ajaxPublishReport( youthID, htmlReport, nTries )
{
    htmlReport = htmlReport.replace( /\s+</g, "<" );

    jQuery.ajax( {
        type: 'POST',
        url: BADGES_PUBLISH,
        data: "sectionid=" + getURLSection() + "&uid=" + getLoginID() + "&youthid=" + youthID + "&dest=record-sheets&report=" + encodeURIComponent( htmlReport ),
        dataType: "json",
        async: true,
        cache: false,
        error: function( request, textStatus, errorThrown ) {
            console_warn( "Error connecting to publisher servlet: '" + textStatus + "', " + errorThrown );
            //openLightBox( { text: "Error publishing record sheet", canClose: true } );
            if ( nTries-- > 0 )
                ajaxPublishReport( youthID, htmlReport, nTries )

            else
            {
                if ( youthID == -1 )
                    $('#record-sheets-section li').html( "Error publishing" ).addClass( "noaccess" ).removeClass( "arrow" );
                else
                    $('#record-sheets-youth li[youthid=' + youthID + ']').html( "Error publishing" ).addClass( "noaccess" ).removeClass( "arrow" );

                publishNextYouth();
            }
        },
        success: function( data ) 
        {
            if ( data.report_url === undefined )
                openLightBox( { text: "Could not publish your Record Sheet.  Please contact support@dakemi.com", canClose: true } );

            else if ( youthID == -1 )
                $('#record-sheets-section li').html( getRecordSheetLink( youthID ) ).removeClass( "noaccess" ).addClass( "arrow" );
            else 
            {
                if ( youthID == g_currentUser )
                {
                    $('#my-reports-body').append( "<li class=\"arrow\"><a href=\"" + data.report_url + "\" target=_blank style='background-image:none;'>Personal Record Sheet<img style='margin-left:5px;' src='section-theme/img/external-link.gif'></a></li>" );
                    $('#my-reports-wait').hide();
                    $('#my-reports-body').show();
                }

                $('#record-sheets-youth li[youthid=' + youthID + ']').html( getRecordSheetLink( youthID ) ).removeClass( "noaccess" ).addClass( "arrow" );
                publishNextYouth();
            }
        }
    });
};

function publishNextYouth()
{

    if ( g_listQueuedYouth.length > 0 )
    {
        youthID = g_listQueuedYouth.shift();
        if ( youthID != -1 )
            doPublishYouth( youthID );
        else
            doPublishSummary();
    }
};

function _addMetaData( youthID, addPatrol, s )
{
    var strSectionName = getGroupName( getSectionGroup(), getSectionSubGroup() );
    if ( strSectionName == null )
        strSectionName = "";

    var now = new Date();
    var youth = g_dbTables['Youth'][youthID];
    var html = "";

    var strYouthName = htmlEncode( g_mapYouthNames[youthID] );
    if ( youth.active == 0 )
        strYouthName += "&nbsp;<span class='inactive'>(Inactive)</span>";

    html += s + "<table id='metadata' class='border'>\n";
    html += s + "  <tbody>\n";

    if ( addPatrol )
        html += s + "    <tr><td class='label'>Name</td><td class='big-name'>" + strYouthName + "</td><td class='spacer'></td><td class='label'>" + STR_PATROL + "</td><td>" + getPatrolName( youth.patrolid ) + "</td></tr>\n";
    else
        //html += s + "    <tr><td class='label'>Name</td><td class='big-name' colspan=4>" + strYouthName + "</td></tr>\n";
        html += s + "    <tr><td class='label'>Name</td><td class='big-name'>" + strYouthName + "</td><td class='spacer'></td><td class='label'></td><td style='border:none;'></td></tr>\n";

    html += s + "    <tr><td class='label'>Group</td><td>" + strSectionName + "</td><td class='spacer'></td><td class='label'>Updated</td><td>" + formatTimestamp( now.getTime() ) + "</td></tr>\n";
    html += s + " </tbody>\n";
    html += s + "</table>\n";

    return html;
};

function _addTroopMetaData( s )
{
    var strSectionName = getGroupName( getSectionGroup(), getSectionSubGroup() );
    if ( strSectionName == null )
        strSectionName = "";

    var now = new Date();
    var html = "";

    html += s + "<table id='metadata' class='border'>\n";
    html += s + "  <tbody>\n";
    html += s + "    <tr><td class='label'>Group</td><td class='big-name'>" + strSectionName + "</td><td class='spacer'></td><td class='label'>Updated</td><td>" + formatTimestamp( now.getTime() ) + "</td></tr>\n";
    html += s + " </tbody>\n";
    html += s + "</table>\n";

    return html;
};

function _addOutings( youthID, nMarginTop, nRows, s )
{
    var html = "";

    var mapOutings = {};

    for ( var key in g_mapOutings )
    {
        var outing = g_mapOutings[key];
        if ( outing === undefined || outing == null )
            continue;       // could be gaps in what looks like an array

        outing = filterOutingByYouth( outing, youthID );
        if ( outing == null )
            continue;

        mapOutings["" + outing.id] = outing;
    }

    var listOutingIDs = sortOutingsByDate( mapOutings );
    var nLastYear = 2100;
    var now = getServerTimestamp();

    var listFoundOutings = new Array();
    var listFoundClasses = new Array();
    for ( var iOuting = 0; iOuting < listOutingIDs.length; iOuting++ )
    {
        var outingID = listOutingIDs[iOuting];
        var outing = mapOutings[outingID];

        if ( outing.date > now )
            continue;       // future events don't count

        // do we want this event (filter out meeting-only events)
        var isKeeper = false;
        for ( var iOutingLabel = 0; iOutingLabel < outing.labels.length; iOutingLabel++ )
        {
            var outingLabel = outing.labels[iOutingLabel];
            if ( outingLabel.id != g_meetingID )
            {
                isKeeper = true;
                break;
            }
        }

        if ( ! isKeeper )
            continue;       // skip this meeting

        var nYear = getOutingYear( outing );
        if ( nYear != nLastYear )
        {
            $('#list-events ul').append( $("<li class='divider'>" + nYear + "-" + (nYear+1) + "</li>" ) );
            nLastYear = nYear;
            listFoundOutings.push( "<div class=\"year\">" + nYear + "-" + (nYear+1) + "</div>" );
            listFoundClasses.push( "year" );
        }

        var htmlOuting = "";
        for ( var iLabel = 0; iLabel < g_listSortedLabelIDs.length; iLabel++ )
        {
            for ( var iOutingLabel = 0; iOutingLabel < outing.labels.length; iOutingLabel++ )
            {
                var outingLabel = outing.labels[iOutingLabel];
                if ( outingLabel.id != g_listSortedLabelIDs[iLabel] )
                    continue;

                var label = g_dbTables['Labels'][outingLabel.id];

                var image = "";
                if ( label.image !== undefined && label.image.length > 0 ) 
                    image = "<img src='../" + label.key + ".gif'/>";

                htmlOuting += image;
            }
        }

        htmlOuting += getOutingName( outing );

        //var htmlOuting = buildEventReportRow( outing, false );
        listFoundOutings.push( htmlOuting );
        listFoundClasses.push( "" );
    }

    html += s + "<td colspan=3 style='text-align: center;'>\n";
    html += s + "  <div class='group-header' style='margin-top:" + nMarginTop + "px;'>Completed Outings</div>\n";
    html += s + "  <table class='outings'>\n";
    html += s + "    <tbody>\n";

    var N_COLS = 4;
    for ( var iRow = 0; iRow < nRows; iRow++ )
    {
        html += s + "      <tr>\n" + s;
        for ( var iCol = 0; iCol < N_COLS; iCol++ )
        {

            if ( iCol > 0 )
                html += "<td class='spacer'></td>\n";
            var i = iRow + (iCol*nRows);
            if ( i < listFoundOutings.length )
                html += "<td class='" + listFoundClasses[i] + "'>" + listFoundOutings[i] + "</td>\n";
            else
                html += "<td></td>\n";
        }
        html += s + "      </tr>\n";
    }

    html += s + "    </tbody>\n";
    html += s + "  </table>\n";
    html += s + "</td>\n";

    return html + "\n";
};

function _addPlaceholderRequirement( youthID, reqID, label, s )
{
    var jsonCompletion = g_mapRequirementCompletion['illegal_bogus_value']; // force it to be undefined, for now
    if ( g_mapRequirementCompletion[youthID] !== undefined && g_mapRequirementCompletion[youthID][reqID] !== undefined )
        jsonCompletion = g_mapRequirementCompletion[youthID][reqID];

    var strClass = "y";
    var strText = YES;
    if ( jsonCompletion === undefined || jsonCompletion.complete < jsonCompletion.total )
    {
        strText = reqID.replace( /(.+)(\d+)$/, "$2" );
        strClass = "";
    }

    var html = "";

    html += s + "<table class='requirements'>\n";
    html += s + "  <tbody>\n";
    html += s + "    <tr>\n\n";
    html += s + "      <td><table class='reqs' width=100%><tbody><tr><td " + strClass +">" + strText + "</td></tr></tbody></table></td>\n";
    html += s + "      <td>&nbsp;</td>\n\n";
    html += s + "      <td>\n";

    html += s + "        <table width=100% style='margin-bottom:10px;margin-top:10px;'>\n";
    html += s + "          <tbody>\n";
    html += s + "            <tr>\n";
    html += s + "              <td style='white-space:nowrap;'>" + label + "</td>\n";
    html += s + "            </tr>\n";
    html += s + "          </tbody>\n";
    html += s + "        </table>\n";

    html += s + "      </td>\n";
    html += s + "    </tr>\n";
    html += s + "  </tbody>\n";
    html += s + "</table>\n";

    return html + "\n";
};

function _addRequirements( youthID, reqID, listBadges, s )
{
    var jsonCompletion = g_mapRequirementCompletion['illegal_bogus_value']; // force it to be undefined, for now
    if ( g_mapRequirementCompletion[youthID] !== undefined && g_mapRequirementCompletion[youthID][reqID] !== undefined )
        jsonCompletion = g_mapRequirementCompletion[youthID][reqID];

    var strClass = "y";
    var strText = YES;
    if ( jsonCompletion === undefined || jsonCompletion.complete < jsonCompletion.total )
    {
        strText = reqID.replace( /(.+)(\d+)$/, "$2" );
        strClass = "";
    }

    var html = "";

    html += s + "<table class='requirements'>\n";
    html += s + "  <tbody>\n";
    html += s + "    <tr>\n\n";
    html += s + "      <td><table class='reqs' width=100%><tbody><tr><td " + strClass +">" + strText + "</td></tr></tbody></table></td>\n";
    html += s + "      <td>&nbsp;</td>\n\n";
    html += s + "      <td>\n";

    for ( var iBadge = 0; iBadge < listBadges.length; iBadge++ )
        html += _addBadge( youthID, listBadges[iBadge], true, s + "          " );

    html += s + "      </td>\n";
    html += s + "    </tr>\n";
    html += s + "  </tbody>\n";
    html += s + "</table>\n";

    return html + "\n";
};

function _addBadge( youthID, badgeID, useColumns, s )
{
    var html = "";

    var isAwarded = isBadgeAwarded( youthID, badgeID );
    var isComplete = false;
    if ( ! isAwarded )
        isComplete = isBadgeComplete( youthID, badgeID );

    var imgClass = isComplete || isAwarded ? "y" : "";
    var imageID = deriveBadgeImage( badgeID, getYouthUniform( youthID ) );
    imageID = imageID.replace( /(.+)_(\d+)$/, "$2/$1" );        // convert "safety_1" to "1/safety"

    html += s + "<table class='badge'>\n";
    if ( useColumns )
        html += s + "  <colgroup><col/><col/></colgroup>\n";
    html += s + "  <tbody>\n";
    html += s + "    <tr>\n";
    html += s + "      <td><div class='img " + imgClass + "'><img src='" + IMG_BASE + imageID + (imgClass!=""?"":"-d") + ".gif'/></div></td>\n";
    html += s + "      <td>\n";
    html += s + "        <table>\n";
    html += s + "          <tr>\n";
    html += s + "            <td>" + getBadgeName(badgeID) + "</td>\n";
    html += s + "          </tr>\n";

    html += s + "          <tr>\n";
    html += s + "            <td>\n";
    html += s + "              <table class='reqs'>\n";
    html += s + "                <tbody>\n";
    html += s + "                  <tr>";

    if ( isAwarded )
    {
        var strDate = getAwardedDate( g_setAwardedBadges[youthID][badgeID] );
        html += "<td y awarded>Awarded" + strDate + "</td>";
    }
    else
    {
        var resultsRequirements = new Array();
        for ( var reqID in g_dbTables['Requirements'] )
        {
            var requirement = g_dbTables['Requirements'][reqID];
            if ( requirement['badgeid'] == badgeID )
                resultsRequirements.push( requirement );
        }
            
        var metadata = g_dbTables['MetaData'][badgeID];

        var json = getSortedBadgeRequirements( [badgeID] );

        var jsonHTML = renderSegments_HTML( segmentRequirements2( json.ids, json.classes, youthID, [badgeID] ), youthID, [badgeID], false, false );
        html += jsonHTML.reqs;

        if ( jsonHTML.captions != "" )
        {
            html += "</tr>\n";
            html += s + "                  <tr>" + jsonHTML.captions;
        }
    }

    html += "</tr>\n";
    html += s + "                </tbody>\n";
    html += s + "              </table>\n";
    html += s + "            </td>\n";
    html += s + "          </tr>\n";
    html += s + "        </table>\n";
    html += s + "      </td>\n";
    html += s + "    </tr>\n";
    html += s + "  </tbody>\n";
    html += s + "</table>\n";

    return html + "\n";
};

function _addCSS( nFontSize )
{
    var html = "";
    html += "  <style language='text/css'>\n";

    html += "body { font-family: helvetica, arial, verdana, tahoma; font-size: 10pt; }\n";
    html += "table { border-spacing: 0; }\n";
    html += ".next-page { page-break-before: always; }\n";
    html += "body table.wrapper.next-page:first-child { page-break-before: auto; }\n";
    html += "div.title { font-size: 200%; width: 100%; text-align: center; font-weight: bold; margin-bottom: 15px; }\n";
    html += "table.wrapper div.print { color: #fe3; cursor: pointer; font-size: 50%; padding: 5px 10px; float: right; border-color: #a43; background-color: #a43; border-style: outset; border-width: 1px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; display: none; }\n";
    html += "table.wrapper:first-child div.print { display: block; }\n";
    html += "td { font-size: " + nFontSize + "pt; padding: 0; margin: 0; border: none; }\n";

    html += ".main { border-spacing: 0 20px; border: none; width: 100%; }\n";
    html += ".main td { width: 100%; }\n";
    html += ".main > tbody > tr > td { vertical-align: top; padding: 0; width: 500px; }\n";
    html += ".main > tbody > tr > td:first-child + td { min-width: 2em; width: 2em; border: none; } /* space between awards */\n";

    html += "#metadata { table-layout: fixed; width: 100%; border: solid 1px black; padding: 10px 10px 15px; empty-cells: show; background-color: #eeb; }\n";
    html += "#metadata td { border: none; }\n";
    html += "#metadata td.label { font-weight: bold; width: 4.5em; margin-right: 10px; font-size: 110%; color: #621; }\n";
    html += "#metadata td.label + td { border-bottom: solid 1px #985; padding-left: 15px; font-size: 130%; }\n";
    html += "#metadata td.spacer { width: 2em; }\n";
    html += "#metadata tr:first-child + tr td { padding-top: 0.75em; }\n";

    html += "table.award-section { padding: 0; margin: 0; width: 100%; }\n";
    html += ".border { border: solid 1px #300; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }\n";
    html += "table.award-section > thead th { color: #300; background-color: #e8e0b8; padding: .2em; text-align: center; font-weight: bold; font-size: 110%; }\n";
    html += "div.vertical { -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); width: 1.5em; margin-bottom: 0.25em; }\n";
    html += ".badges table.award-section > thead th { padding: .2em; }\n";
    html += "table.award-section thead th { white-space: nowrap; border-bottom: solid 1px #999; -webkit-border-top-left-radius: 8px; border-top-left-radius: 8px; -moz-border-radius-topleft: 8px; -webkit-border-top-right-radius: 8px; border-top-right-radius: 8px; -moz-border-radius-topright: 8px; }\n";
    html += "table.main > tbody > td {}\n";
    html += "table.award-section > tbody td { border: none; }\n";
    html += "table.award-section > tbody > tr > td { padding: 10px; }\n";
    html += "table.award-section > tbody > tr > td.vertical { color: #300; background-color: #e8e0b8; padding: .2em; text-align: center; font-weight: bold; font-size: 110%; width: 1em; border-right: solid 1px #999; white-space: nowrap; }\n";

    html += "table.award-section table.reqs { table-layout: fixed; margin-bottom: 0px; border-spacing: 0; }\n";
    html += "table.award-section table.reqs td { color: #a43; width: 1.5em; border-color: #666; border-width: 1px; border-style: solid none solid solid; text-align: center; font-family: helvetica narrow, arial narrow, helvetica, arial, verdana, tahoma; }\n";
    html += "table.award-section table.reqs td:last-child { border-right-style: solid }\n";
    html += "table.award-section table.reqs td[y] { color: #090; font-weight: bold; padding-left:0; padding-right:0; }\n";
    html += "table.award-section table.reqs td[spacer] { border-style: none solid; width: 5px; }\n";
    html += "table.award-section table.reqs td[awarded] { width: auto; padding-left: 15px; padding-right: 15px; border-color: #393; background-color: #cfc; }\n";
    html += "table.award-section table.reqs td[caption] { border: none; font-size: 80%; color:#999; font-style:italic; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }\n";
    html += "table.award-section table.reqs td[or] { border-left-style: dashed; }\n";
    html += "table.award-section table.reqs tr:first-child + tr > td { height: 0; border: none; }\n";

    html += "td table.award-section:first-child { margin-top: 0 }\n";
    html += "td table.award-section { margin-top: 20px; }\n";
    html += ".main.badges td table.award-section { margin-top: 15px; }\n";

    html += "table.requirements > tbody > tr > td:first-child { width: 50px; padding-right: 10px; }\n";
    html += "table.requirements > tbody > tr > td:first-child + td { border-color: #a43; border-style: solid none solid solid; border-width: 2px; width: 10px; border-spacing 0; -webkit-border-top-left-radius: 15px; -webkit-border-bottom-left-radius: 15px; border-top-left-radius: 15px; border-bottom-left-radius: 15px; -moz-border-radius-topleft: 15px; -moz-border-radius-bottomleft: 15px;}\n";
    html += "table.requirements > tbody > tr > td:first-child + td + td { padding-left: 0; }\n";
    html += "table.requirements > tbody > tr > td:first-child > table td { width: 23px; }\n";

    html += "table.badge { table-layout: fixed; width: 100%; margin: 0; }\n";
    html += "table.badge > colgroup col:first-child { width: 60px; }\n";
    html += "table.badge > colgroup col:first-child + col { width: auto; }\n";

    html += "table.challenges { width: auto; }\n";
    html += "table.challenges td:first-child { width: 130px; white-space: nowrap; }\n";

    html += "table.award { table-layout: fixed; margin-left: auto; margin-right: auto; }\n";

    //html += "div.img { font-size: 11pt; opacity:0.3; filter:alpha(opacity=30); } \n";
    //html += "div.img.y { opacity:1.0; filter:alpha(opacity=100); }\n";
    html += "div.img { font-size: 110%; } \n";
    html += "div.img.y { }\n";
    html += "img[y] { }\n";
    html += "div.img img { width: 2.5em; }\n";
    html += ".small-badges div.img img { width: 2.5em; }\n";

    html += "span.check { display: none; font-size: 150%; vertical-align:-1px; }\n";
    html += ".main.badges table.badge > tbody > tr:first-child > td:first-child { width: 48px; }\n";

    html += "table.outings { width: 100%; empty-cells: show; table-layout: fixed; margin-top: 10px; }\n";
    html += "table.outings tr td { border-bottom: solid 1px #ccc; height: 25px; width: auto; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left; } \n";
    html += "table.outings tr td.spacer { width: 2%; border: none; }\n";
    html += "table.outings td img { vertical-align:-2px; }\n";
    html += "table.outings td img:last-child { padding-right:5px; }\n";
    html += "table.outings td.year { border-bottom: solid 1px #985; }\n";
    html += "table.outings div.year { background-color:#eeb; font-weight: bold; text-align: center; color: #300; width: 50%; padding-bottom: 2px; padding-top: 2px; 2adding-bottom: 5px; margin-bottom: 0px; border-style: solid; border-color; #985; border-width: 1px 1px 0; margin-bottom: -5px; margin-left: 8px; -webkit-border-top-left-radius: 8px; border-top-left-radius: 8px; -moz-border-radius-topleft: 8px; -webkit-border-top-right-radius: 8px; border-top-right-radius: 8px; -moz-border-radius-topright: 8px; }\n";
    html += ".main span { font-size: 120%; font-weight: bold; }\n";
    html += ".outing-details table.award-section thead th { padding-left: .5em; }\n";
    html += ".outing-details th span { font-size: 100%; }\n";
    html += ".outing-details th span img { vertical-align: -2px; }\n";
    html += ".main span.noaccess { font-size: 90%; color: #999; }\n";
    html += "span.label { margin-right: .5em; font-size: 100%; }\n";
    html += ".inactive { font-size: 90%; color: #999; }\n";
    html += ".outing-details a { margin-left: .25em; margin-right: .25em; }\n";
    html += ".big-name { font-size: 140%; font-weight: bold; color: #a43; }\n";
    html += "sup { font-size: 11px; color: #c00; font-weight: bold; }\n";
    html += "p.footnote { margin: 0; padding-left: 10px; font-size: 80%; }\n";
    html += "p.footnote:last-child { margin-bottom: 20px; }\n";
    html += "p.footnote sup { font-size: 11px; padding-right: 5px; }\n";
    html += "p.footnote img { vertical-align: -1px; }\n";
    html += "p.footnote span + span { vertical-align: -1px; color: #000; }\n";
    html += "p.footnote span { vertical-align: 0px; color: #666; font-weight: normal; }\n";
    html += "span[y] { font-size: 80%; color: #090; }\n";
    html += "div.group-header { margin-top: 10px;font-weight:bold;color:#621;font-size:120%;text-align:center }\n";
    html += ".creole p { margin-top: 0; margin-bottom: 3px; }\n";
    html += ".creole ul { margin-top: 0; margin-bottom: 3px; }\n";
    html += ".creole em, .creole strong { padding-left: 2px; }\n";
    html += ".creole h1, .creole h2, .creole h3, .creole h4, .creole h5, .creole h6 { margin-left: 0; color: #333; font-size: 14px; font-weight: bold; }\n";
    html += ".creole h2 { font-style: italic; font-size: 90%; color: #333; }\n";
    html += ".creole table { border-collapse: collapse; }\n";
    html += ".creole table > tbody th, .creole table > tbody td { padding-left: 5px; padding-right: 5px; border-bottom: solid 1px #e0e0e0; padding-top: 2px; }\n";
    html += ".creole table > tbody th { background-color: #e0e0e0; font-size: 90%; padding: 2px 5px; }\n";
    html += ".creole table > tbody td { background-color: white; width: auto; }\n";

    html += "/* Force a width in print media, so the scale-to-fit does something */\n";
    html += "@media print {\n";
    html += "   table.badge > colgroup col:first-child + col { width: 390px; }\n";
    html += "   table.wrapper:first-child div.print { display: none; }\n";
    html += "}\n";
   
    html += _addSectionCSS();

    html += "  </style>\n";

    return html + "\n";
};

