diff --git a/vasl_templates/webapp/data/default-template-pack/compass.j2 b/vasl_templates/webapp/data/default-template-pack/compass.j2 new file mode 100644 index 0000000..601197c --- /dev/null +++ b/vasl_templates/webapp/data/default-template-pack/compass.j2 @@ -0,0 +1,5 @@ + + + + + diff --git a/vasl_templates/webapp/data/default-template-pack/extras/compass.j2 b/vasl_templates/webapp/data/default-template-pack/extras/compass.j2 deleted file mode 100644 index 6cf91a2..0000000 --- a/vasl_templates/webapp/data/default-template-pack/extras/compass.j2 +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/vasl_templates/webapp/static/css/main.css b/vasl_templates/webapp/static/css/main.css index 7b41066..781e30e 100644 --- a/vasl_templates/webapp/static/css/main.css +++ b/vasl_templates/webapp/static/css/main.css @@ -7,7 +7,7 @@ body { font-family: Arial, Helvetica, sans-serif ; font-size: 16px ; } ul, ol { margin: 0.5em 0 0 1.25em ; } input[type="text"] { height: 20px ; border: 1px solid #c5c5c5 ; padding: 0 2px ; } -label { height: 1.25em ; margin-top: -3px ; } +label { height: 1.25em ; } /* -------------------------------------------------------------------- */ @@ -29,7 +29,7 @@ label { height: 1.25em ; margin-top: -3px ; } .select2-dropdown { color: #444 ; } -.snippet-control button.generate { height: 26px ; padding: 2px 10px 2px 5px ; color: #000 ; } +.snippet-control button.generate { height: 26px ; padding: 2px 0 2px 5px ; color: #000 ; } .snippet-control button.generate.inactive { color: #aaa ; } .snippet-control button.generate img { height: 20px ; margin-right: 5px ; vertical-align: middle ; } .snippet-control .ui-selectmenu-button { padding: 2px 10px ; } diff --git a/vasl_templates/webapp/static/css/tabs-scenario.css b/vasl_templates/webapp/static/css/tabs-scenario.css index 74447e7..7e96207 100644 --- a/vasl_templates/webapp/static/css/tabs-scenario.css +++ b/vasl_templates/webapp/static/css/tabs-scenario.css @@ -2,39 +2,32 @@ #panel-scenario { display: flex ; flex-direction: column ; } -#panel-scenario .row { display: flex ; align-items: center ; } +#panel-scenario .row { display: flex ; align-items: center ; margin-bottom: 2px ; } #panel-scenario input { flex-grow: 1 ; } #panel-scenario input[name='SCENARIO_ID'] { margin-left: 0.25em ; width: 80px ; flex-grow: 0 ; text-align: right ; } -#panel-scenario .scenario-search { width: 25px ; height: 22px ; margin: 0 0 0 0.25em ; padding: 0 ; margin-top:-4px; } +#panel-scenario .scenario-search { width: 25px ; height: 22px ; margin: 0 0 0 0.25em ; padding: 0 ; } #panel-scenario .scenario-search img { margin-top: 2px ; width: 16px ; } #panel-scenario input[name='SCENARIO_DATE'] { width: 6em ; flex-grow: 0 ; } -#panel-scenario label[for='TURN_TRACK_NTURNS'] { margin-top: 2px ; } #panel-scenario button#turn-track-settings { width: 25px ; height: 24px ; margin-right: 5px ; padding: 3px 2px 2px 2px ; } -#panel-scenario label[for='PLAYER_1'] { margin-top: 2px ; } #panel-scenario .select2[name="PLAYER_1"] { flex: 1 ; } -#panel-scenario label[for='PLAYER_2'] { margin-top: 2px ; } #panel-scenario .select2[name="PLAYER_2"] { flex: 1 ; } #panel-scenario input[name="PLAYER_1_DESCRIPTION"], #panel-scenario input[name="PLAYER_2_DESCRIPTION"] { - margin-left: 6.35em ; margin-top: 1px ; font-size: 75% ; + font-size: 75% ; } -#panel-scenario label { font-weight: bold ; width: 4.75em ; } +#panel-scenario label { margin-top: 2px ; font-weight: bold ; width: 4.75em ; } #panel-scenario label.header { font-weight: bold ; width: 3em ; text-align: center ; } -#panel-scenario input { margin-bottom: 0.25em ; } #panel-scenario .select2-container { margin-right: 2px ; } #panel-scenario .select2-selection__rendered { height: 23px ; line-height: 23px ; } #panel-scenario .select2-selection__arrow { margin-top: -2px ; } #panel-scenario .select2-selection { height: 24px !important ; border-radius: 0 !important ; } -#panel-scenario .select2[name="SCENARIO_THEATER"] { margin-left: 0.25em ; margin-right: 0 ; } -#panel-scenario .select2-container[name="SCENARIO_THEATER"] .select2-selection { height: 22px !important ; margin-top: -4px ; } -#panel-scenario .select2-container[name="SCENARIO_THEATER"] .select2-selection__rendered { height: 20px ; line-height: 20px ; } -#panel-scenario .select2-container[name="SCENARIO_THEATER"] .select2-selection__arrow { margin-top: -6px ; } +#panel-scenario .select2[name="SCENARIO_THEATER"] { margin-left: 0.25em ; margin-right: 0.25em ; } /* -------------------------------------------------------------------- */ diff --git a/vasl_templates/webapp/static/images/compass/none.png b/vasl_templates/webapp/static/images/compass/none.png new file mode 100644 index 0000000..a7a36dc Binary files /dev/null and b/vasl_templates/webapp/static/images/compass/none.png differ diff --git a/vasl_templates/webapp/static/main.js b/vasl_templates/webapp/static/main.js index 2ffcd7f..b080798 100644 --- a/vasl_templates/webapp/static/main.js +++ b/vasl_templates/webapp/static/main.js @@ -391,6 +391,23 @@ $(document).ready( function () { // replace all the "generate" buttons with "generate/edit" button/droplist's $("button.generate").each( function() { init_snippet_button( $(this) ) ; } ) ; + // add special options to the COMPASS snippet button menu + var $compassMenu = $( "select[data-id='compass']" ) ; + var compassDirns = [ "", "right", "left", "down", "up" ] ; + compassDirns.forEach( function( dirn ) { + var caption = (dirn === "") ? "-" : dirn[0].toUpperCase() + dirn.substring(1) ; + $compassMenu.prepend( + "" + ) ; + } ) ; + $( ".snippet-control[data-id='compass'] select" ).on( "selectmenuselect", function( evt, ui ) { + var dirn = ui.item.value ; + if ( ! compassDirns.includes( dirn ) ) + return ; + $( "input.param[name='COMPASS']" ).val( dirn ) ; + updateCompassImage() ; + } ) ; + // handle requests to edit the templates $("button.edit-template").click( function() { edit_template( $(this).data( "id" ) ) ; @@ -555,7 +572,9 @@ function init_snippet_button( $btn ) var fname="snippet.png", style="" ; if ( template_id.substring( 0, 9 ) === "nat_caps_" ) { fname = "nat-caps.png" ; - style = "height:15px;margin-right:0;" ; + style = "height:15px;" ; + } else if ( template_id == "compass" ) { + fname = "compass/none.png" ; } $newBtn.find( "button" ) .prepend( $( "" ) ) @@ -564,7 +583,7 @@ function init_snippet_button( $btn ) return false ; } ) .attr( "title", GENERATE_SNIPPET_HINT ) - .css( { "padding-right": $btn.text() !== "" ? "10px" : "0" } ) ; + .css( { "padding-right": $btn.text() !== "" ? "5px" : "0" } ) ; // add in the droplist $newBtn.controlgroup() ; @@ -591,6 +610,22 @@ function init_snippet_button( $btn ) $btn.replaceWith( $newBtn ) ; } +function updateCompassImage() { + // update the image in the COMPASS snippet button + var dirn = $( "input.param[name='COMPASS']" ).val() || "none" ; + var $btn = $( "button.generate[data-id='compass']" ) ; + var imagePadding = { + up: "2px 0 0 0", down: "0 0 2px 0", left: "0", right: "0", + none: "0" + } ; + $btn.find( "img" ).attr( "src", + make_app_url( "/static/images/compass/" + dirn + ".png" ) + ).css( { + padding: imagePadding[dirn] + } ) ; + $btn.button( dirn === "none" ? "disable" : "enable" ) ; +} + // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - gPageLoadStatus = [ diff --git a/vasl_templates/webapp/static/scenarios.js b/vasl_templates/webapp/static/scenarios.js index 7adf829..bad59ba 100644 --- a/vasl_templates/webapp/static/scenarios.js +++ b/vasl_templates/webapp/static/scenarios.js @@ -708,6 +708,10 @@ function doImportScenario( scenario ) $(this).prop( "checked", false ) ; } ) ; + // reset the compass + $( "#panel-scenario input[name='COMPASS']" ).val( "" ) ; + updateCompassImage() ; + // NOTE: We could reset the ELR/SAN here, but if the user is importing on top of an existing setup, // the most likely reason is because they want to connect it to an ASA scenario, not because // they want to import a whole set of new details, so clearing the ELR/SAN wouldn't make sense. diff --git a/vasl_templates/webapp/static/snippets.js b/vasl_templates/webapp/static/snippets.js index 1d6e8f3..894240d 100644 --- a/vasl_templates/webapp/static/snippets.js +++ b/vasl_templates/webapp/static/snippets.js @@ -1888,6 +1888,7 @@ function do_load_scenario_data( params ) gLastSavedScenario = unload_params_for_save( false ) ; // update the UI + updateCompassImage() ; $("#tabs").tabs( "option", "active", 0 ) ; on_scenario_date_change() ; update_scenario_status() ; diff --git a/vasl_templates/webapp/static/vassal.js b/vasl_templates/webapp/static/vassal.js index 053415e..69e9379 100644 --- a/vasl_templates/webapp/static/vassal.js +++ b/vasl_templates/webapp/static/vassal.js @@ -213,6 +213,8 @@ function _get_raw_content( snippet_id, $btn, params ) return get_values([ "VICTORY_CONDITIONS" ]) ; if ( snippet_id === "turn_track" ) return true ; + if ( snippet_id === "compass" && get_values(["COMPASS"]).length > 0 ) + return true ; if ( snippet_id === "players" ) { return [ "ELR:", "SAN:", diff --git a/vasl_templates/webapp/templates/tabs-scenario.html b/vasl_templates/webapp/templates/tabs-scenario.html index 094d714..68181d2 100644 --- a/vasl_templates/webapp/templates/tabs-scenario.html +++ b/vasl_templates/webapp/templates/tabs-scenario.html @@ -14,17 +14,19 @@ + +