gTemplatePack = {} ; gDefaultNationalities = {} ; gValidTemplateIds = [] ; gVehicleOrdnanceListings = {} ; gWebChannelHandler = null ; gEmSize = null ; var _NATIONALITY_SPECIFIC_BUTTONS = { "russian": [ "mol", "mol-p" ], "german": [ "pf", "psk", "atmm" ], "american": [ "baz" ], "british": [ "piat" ], } ; // -------------------------------------------------------------------- $(document).ready( function () { // initialize the PyQt web channel if ( getUrlParam( "pyqt" ) ) { $.getScript( "qrc:///qtwebchannel/qwebchannel.js", function() { // connect to the web channel new QWebChannel( qt.webChannelTransport, function(channel) { gWebChannelHandler = channel.objects.handler ; } ) ; } ) ; } // initialize the menu var $menu = $("#menu input") ; $menu.popmenu( { new_scenario: { label: "New scenario", action: function() { on_new_scenario() ; } }, load_scenario: { label: "Load scenario", action: on_load_scenario }, save_scenario: { label: "Save scenario", action: on_save_scenario }, separator: { type: "separator" }, template_pack: { label: "Load template pack", action: on_template_pack }, separator2: { type: "separator" }, show_help: { label: "Help", action: show_help }, } ) ; // nb: we only show the popmenu on left click (not the normal right-click) $menu.off( "contextmenu" ) ; $menu.click( function() { $(this).blur() ; var pos = $(this).offset() ; $(this).data( "PopMenu.contextmenu" ).data( "PopMenu.instance" ).show( pos.left+$(this).width(), pos.top+$(this).height()+2, "fade", 200 ) ; } ) ; // nb: we dismiss the popmenu and any notifications on ESCAPE $(document).keydown( function(evt) { if ( evt.keyCode == 27 ) { $menu.popmenu( "hide" ) ; $(".growl-close").each( function() { $(this).trigger( "click" ) ; } ) ; } } ) ; // add a handler for when the "load scenario" file has been selected $("#load-scenario").change( on_load_scenario_file_selected ) ; // add a handler for when the "load template pack" file has been selected $("#load-template-pack").change( on_template_pack_file_selected ) ; // all done - we can show the menu now $("#menu").show() ; // dynamically create the OB2 tab from OB1 var $ob2 = $("#tabs-ob1").clone() ; var adjustAttr = function( $elem, attrName ) { var val = $elem.attr( attrName ) ; if ( val && val.substring(val.length-1) === "1" ) $elem.attr( attrName, val.substring(0,val.length-1)+"2" ) ; } ; function fixupOB2( $elem ) { adjustAttr( $elem, "id" ) ; adjustAttr( $elem, "name" ) ; adjustAttr( $elem, "data-id" ) ; adjustAttr( $elem, "for" ) ; $elem.children().each( function() { fixupOB2( $(this) ) ; } ) ; } fixupOB2( $ob2 ) ; $("#tabs-ob2").html( $ob2.html() ).addClass( "tabs-ob" ) ; // initialize the tabs $("#tabs").tabs( { heightStyle: "fill", disabled: [1, 2], // nb: we enable these when the page has finished loading activate: on_tab_activate, } ).show() ; var navHeight = $("#tabs .ui-tabs-nav").height() ; $("#tabs .ui-tabs-nav a").click( function() { $(this).blur() ; } ) ; // initialize the scenario theater $( "select[name='SCENARIO_THEATER']" ).selectmenu( { classes: { "ui-selectmenu-button": "scenario_theater" }, } ) ; // initialize the scenario date picker $("input[name='SCENARIO_DATE']").datepicker( { showAnim: "slideDown", changeMonth: true, changeYear: true, defaultDate: "01/01/1940", onClose: on_scenario_date_change, } ) ; // initialize the SSR's $("#ssr-sortable").sortable2( "init", { add: add_ssr, edit: edit_ssr } ) ; $("fieldset[name='vc']").fadeIn( 2*1000 ) ; $("fieldset[name='ssr']").fadeIn( 2*1000 ) ; // initialize the scenario notes $("#scenario_notes-sortable").sortable2( "init", { add: add_scenario_note, edit: edit_scenario_note, } ) ; $("fieldset[name='scenario_notes']").fadeIn( 2*1000 ) ; // initialize the OB setups $("#ob_setups-sortable_1").sortable2( "init", { add: function() { add_ob_setup(1) ; }, edit: edit_ob_setup } ) ; $("#ob_setups-sortable_2").sortable2( "init", { add: function() { add_ob_setup(2) ; }, edit: edit_ob_setup } ) ; // initialize the OB notes $("#ob_notes-sortable_1").sortable2( "init", { add: function() { add_ob_note(1) ; }, edit: edit_ob_note } ) ; $("#ob_notes-sortable_2").sortable2( "init", { add: function() { add_ob_note(2) ; }, edit: edit_ob_note } ) ; // initialize the OB vehicles $("#ob_vehicles-sortable_1").sortable2( "init", { add: function() { add_vo( "vehicles", 1 ) ; }, } ) ; $("#ob_vehicles-sortable_2").sortable2( "init", { add: function() { add_vo( "vehicles", 2 ) ; }, } ) ; // initialize the OB ordnance $("#ob_ordnance-sortable_1").sortable2( "init", { add: function() { add_vo( "ordnance", 1 ) ; }, } ) ; $("#ob_ordnance-sortable_2").sortable2( "init", { add: function() { add_vo( "ordnance", 2 ) ; }, } ) ; // handle ENTER and double-clicks in the "select vehicle/ordnance" dialog function auto_select_vo( evt ) { if ( $("#select-vo select").val() ) { $(".ui-dialog.select-vo button:contains('OK')").click() ; evt.preventDefault() ; } } $("#select-vo").keydown( function(evt) { if ( evt.keyCode == 13 ) auto_select_vo( evt ) ; } ) ; $("#select-vo").dblclick( function(evt) { auto_select_vo(evt) ; } ) ; // add player change handlers $("select[name='PLAYER_1']").selectmenu( { width: "7em", open: function() { $(this).data("prev-val",$(this).val()) ; }, select: function() { on_player_change_with_confirm( 1 ) ; }, } ) ; $("select[name='PLAYER_2']").selectmenu( { width: "7em", open: function() { $(this).data("prev-val",$(this).val()) ; }, select: function() { on_player_change_with_confirm( 2 ) ; }, } ) ; // load the ELR's and SAN's var buf = [] ; for ( var i=0 ; i <= 5 ; ++i ) // nb: A19.1: ELR is 0-5 buf.push( "" ) ; buf = buf.join( "" ) ; for ( var player_no=1 ; player_no <= 2 ; ++player_no ) { $( "select[name='PLAYER_" + player_no + "_ELR']" ).html( buf ).selectmenu( { classes: { "ui-selectmenu-button": "player" + player_no + "_elr" }, width: "3em" } ) ; } buf = [ "" ] ; // nb: allow scenarios that have no SAN for ( i=2 ; i <= 7 ; ++i ) // nb: A14.1: SAN is 2-7 buf.push( "" ) ; buf = buf.join( "" ) ; for ( player_no=1 ; player_no <= 2 ; ++player_no ) { $( "select[name='PLAYER_" + player_no + "_SAN']" ).html( buf ).selectmenu( { classes: { "ui-selectmenu-button": "player" + player_no + "_san" }, width: "3em" } ) ; } // get the vehicle/ordnance listings $.getJSON( gVehicleListingsUrl, function(data) { gVehicleOrdnanceListings.vehicles = data ; update_page_load_status( "vehicle-listings" ) ; } ).fail( function( xhr, status, errorMsg ) { showErrorMsg( "Can't get the vehicle listings:
Do you want to change this player's nationality?
You will lose changes made to their OB.", { ok: function() { on_player_change( player_no ) ; }, cancel: function() { $select.val( $select.data("prev-val") ).selectmenu( "refresh" ) ; }, } ) ; } } function on_player_change( player_no ) { // update the tab label var player_nat = update_ob_tab_header( player_no ) ; // show/hide the nationality-specific buttons for ( var nat in _NATIONALITY_SPECIFIC_BUTTONS ) { for ( var i=0 ; i < _NATIONALITY_SPECIFIC_BUTTONS[nat].length ; ++i ) { var button_id = _NATIONALITY_SPECIFIC_BUTTONS[nat][i] ; var $elem = $( "#panel-ob_notes_" + player_no + " div.snippet-control[data-id='" + button_id + "']" ) ; $elem.css( "display", nat == player_nat ? "inline-block" : "none" ) ; } } // reset the OB params $( "#ob_setups-sortable_" + player_no ).sortable2( "delete-all" ) ; $("input[name='OB_SETUP_WIDTH_"+player_no+"']").val( "" ) ; $( "#ob_notes-sortable_" + player_no ).sortable2( "delete-all" ) ; $( "#ob_vehicles-sortable_" + player_no ).sortable2( "delete-all" ) ; $("input[name='OB_VEHICLES_WIDTH_"+player_no+"']").val( "" ) ; $( "#ob_ordnance-sortable_" + player_no ).sortable2( "delete-all" ) ; $("input[name='OB_ORDNANCE_WIDTH_"+player_no+"']").val( "" ) ; } // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - function update_ob_tab_header( player_no ) { // update the OB tab header for the specified player var player_nat = $( "select[name='PLAYER_" + player_no + "']" ).val() ; var display_name = get_nationality_display_name( player_nat ) ; var image_url = gImagesBaseUrl + "/flags/" + player_nat + ".png" ; var $elem = $( "#tabs .ui-tabs-nav a[href='#tabs-ob" + player_no + "']" ) ; $elem.html( " " + "" + escapeHTML(display_name) + " OB" ) ; return player_nat ; } // -------------------------------------------------------------------- function on_tab_activate( evt, ui ) { function set_colors( tab_id, bgd, border ) { var $elem = $("#tabs .ui-tabs-tab[aria-controls='" + tab_id + "']" ) ; $elem.css( { background: bgd, border: "1px solid "+border, "border-bottom": "none", } ) ; $( "#"+tab_id ).css( "border", "1px solid "+border ) ; } // style the tab being de-activated var tab_id = ui.oldPanel.prop( "id" ) ; set_colors( tab_id, "#f6f6f6", "#c5c5c5" ) ; // set the tab being activated function set_colors_for_player( tab_id, player_no ) { var colors = get_player_colors( player_no ) ; set_colors( tab_id, colors[0], colors[2] ) ; } tab_id = ui.newPanel.prop( "id" ) ; var $tab = $( "#"+tab_id ) ; if ( tab_id === "tabs-ob1" ) set_colors_for_player( tab_id, 1 ) ; else if ( tab_id === "tabs-ob2" ) set_colors_for_player( tab_id, 2 ) ; else set_colors( tab_id, "#ddd", "#ccc" ) ; // adjust the layout $tab.find( ".sortable" ).each( function() { $(this).sortable2( "adjust-entry-heights" ) ; } ) ; adjust_footer_vspacers() ; } // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - function adjust_footer_vspacers() { // FUDGE! Different browsers have different ideas about how big 100% of a fieldset is :-/ // To work-around this, we compare where the bottom of each footer is, relative to // its parent fieldset, and adjust a vertical spacer element to compensate. Sigh... $("fieldset").each( function() { // check if the next fieldset has a footer $footer = $(this).find( ".footer" ) ; if ( $footer.length === 0 ) return ; // check if we've already adjusted this fieldset if ( $(this).find( ".vspacer" ).length !== 0 ) return ; // locate the bottom of the fieldset var $fieldset = $(this) ; var fieldset_bottom = $fieldset.position().top + $fieldset.height() ; if ( fieldset_bottom < 0 ) return ; // locate the bottom of the footer var footer_bottom = $footer.position().top + $footer.height() ; var delta = footer_bottom - fieldset_bottom ; delta -= 4 ; // add a vertical spacer after the footer (to push it up a bit) $footer.after( "
" ) ; } ) ; } // -------------------------------------------------------------------- function show_help() { // check if we need to load the HELP tab var $iframe = $("#tabs-help iframe") ; if ( ! $iframe.attr( "src" ) ) { // yup - make it so // NOTE: We show the help in an iframe so that we can use the same files elsewhere e.g. on the web site or Github. var url = gHelpUrl + "?version=" + gAppVersion + "&embedded=1&tab=userguide" ; if ( getUrlParam( "pyqt" ) ) url += "&pyqt=1" ; $iframe.attr( "src", url ) ; $("#tabs .ui-tabs-tab[aria-controls='tabs-help']").show() ; } // show the HELP tab $("#tabs a[href='#tabs-help']").click() ; }