diff --git a/vasl_templates/webapp/static/css/main.css b/vasl_templates/webapp/static/css/main.css index cf61a26..22b7a83 100644 --- a/vasl_templates/webapp/static/css/main.css +++ b/vasl_templates/webapp/static/css/main.css @@ -50,6 +50,11 @@ button.edit-template img { height: 18px ; vertical-align: middle ; margin-right: .ui-dialog-buttonpane button.ok { background: #ddd ; } .ui-dialog-buttonpane button.ok:hover { background: #ccc ; } +/* spectrum color-picker */ +.sp-container { border-color: #aaa ; border-radius: 2px ; } +.sp-palette { max-width: 120px ; } +.sp-palette-row-selection { margin-top: 6px ; border-top: 1px solid #ccc ; padding-top: 6px ; } + .growl-title { display: none ; } .growl .pre { font-family: monospace ; } .growl div.pre { margin: 0 0 1em 1em ; font-size: 80% ; } diff --git a/vasl_templates/webapp/static/lfa.js b/vasl_templates/webapp/static/lfa.js index 8d24301..6a08004 100644 --- a/vasl_templates/webapp/static/lfa.js +++ b/vasl_templates/webapp/static/lfa.js @@ -470,7 +470,7 @@ function initHotnessPopup() closeAllPopupsAndDropLists() ; // NOTE: We have to re-generate the report each time it's shown, since the user // may have chosen a different set of log files. - $gHotnessPopup.html( makeReport() ).show() ; + $gHotnessPopup.html( makeReport() ).fadeIn( 50 ) ; var maxWidth = 0 ; $gHotnessPopup.find( "table" ).each( function() { maxWidth = Math.max( $(this).outerWidth() , maxWidth ) ; @@ -490,7 +490,7 @@ function initHotnessPopup() return false ; } ) ; gEventHandlers.addHandler( $("#lfa"), "click", function() { - $gHotnessPopup.hide() ; + $gHotnessPopup.fadeOut( 20 ) ; } ) ; } @@ -605,6 +605,27 @@ function initPlayerColorsConfig() // BEFORE SHOW ; HIDE ; SHOW ; ... var isBeforeShowActive = false ; + // NOTE: People want to use nationality colors in their graphs, so we provide them as a pre-defined palette. + var natColors=[], natNames=[] ; + var sortedNats = get_sorted_nats() ; + sortedNats.forEach( function( nat ) { + // NOTE: As always, two-tone counters cause us grief :-/ We probably want to use the background + // color here (index 0), but in general, they're just too weak :-( + natColors.push( gTemplatePack.nationalities[ nat ].ob_colors[2] ) ; + natNames.push( gTemplatePack.nationalities[ nat ].display_name ) ; + } ) ; + function fixupPaletteTooltips() { + // NOTE: It's possible to add custom color names (e.g. "german" = #d3edfc), and these custom names + // will appear as palette tooltips (if we set the preferred format to "name"): + // https://github.com/bgrins/spectrum/pull/356#issuecomment-149417882 + // Unfortunately, quite a few nationalities have the same color, so if the user selects e.g. "ANZAC", + // it might appear in the UI as "British" :-/ Instead, we provide this function that fixes up + // the tooltips. Sigh... + $( ".sp-palette-container .sp-thumb-el:visible" ).each( function( n ) { + $(this).attr( "title", natNames[n] ) ; + } ) ; + } + // initialize the color pickers function initColorPicker( colorPickerNo, playerId, caption, style ) { var buf = [ "