{{#Config settings that will change for different views, e.g. for AT, trail2016, etc. These are stored in the setup_params dictionary
#UI_layer->page        The name of the UI layer view file
#UI_layer->tabs        A name or array of names of tabs to use (names are in OZglobals:tab_definitions and the linkouts() 
#                       function in tree.py as key names in the url dict) or 'default' for the default set or 'all' for all. 
#                       Tabs (if they exist) will be shown in this order when popping up linkouts to other pages.
#UI_layer->vars->links Can be 'none' for no links, 'newtab' for all links (except the OZ logo) in new tab, or 'default' (or unset) to leave.
#UI_layer->vars->no_external_links
#                      If true, hide any links to external pages (e.g. opening wikipedia pages in a new tab)
#popups->vars          Passed to pic_info.load, about.load, how.load, data_sources.load, and the 
#                       internal linkouts urls. You will usually want to define 'popup':1 or 'popup':3 (see popup.html). 
#                       It's also sensible to set 'form_reservation_code' to a UID so that re-opening sponsor tabs remembers who you are
#partner               (Optional): if it matches a partner_identifier in the partners table, we will automatically fill out 
#                       the popups and UI_layer params to make am automatically created sponsorship site
#locations_json        Partners can provide their own json string of locations to use, but if not is provided
#                       or there is no partner, the json here is used. This is an array whose items are strings (headers) or 
#                       dicts (each turned into a clickable items) with at least one key labelled 'OTT', and then any other optional 
#                       names keyed by language, e.g. {"OTT":1012685, "en":"Mushrooms", "":"Always use this instead of default VN"}.
#pre_ui_setup          An array of javascript calls to make before Setup_UI, mostly to override global config, for example:
#                       "onezoom.config.projection.draw_sponsors = false"
setup_params = {
  'UI_layer': {
    'page':'UI_layer.load', 
    'vars':{'tabs':'default', 'links':'newtab'} },
  'popups': {
    'vars':{'popup':1, 'form_reservation_code': form_reservation_code} },
  'partner':page_info.get('partner'),
  'locations_json':('[' 
      '"Popular places",' 
      '{"OTT":244265},'  #Mammals - should get looked up automatically: this also allows the correct language to be used
      '{"OTT":770315},'  #Human - ditto
      '{"OTT":81461},'   #Birds
      '{"OTT":991547},'  #Frogs and toads
      '{"OTT":801601},'  #Vertebrates
      '{"OTT":1062253},' #Insects
      '{"OTT":691846},'  #Animals
      '{"OTT":361838},'  #Green plants
      '{"OTT":99252},'   #Flowering plants
      '{"OTT":1012685, "en":"Mushrooms"},' #the default OZ english name is bad for menus here, so we replace it
      '{"OTT":304358}'   #Complex life (eukaryotes)
      ']'
    )
  }
}}
{{extend ('treeviewer/layout_popuped_viewer.html' if request.vars.popup else 'treeviewer/layout.html')}}
<!-- bespoke css file for treasure hunt -->
<link rel="stylesheet" type="text/css" href="{{=URL('static', 'css/tree_treasure.css')}}" />
<div id="treasure_list">
<h3>{{=T('Checklist')}}</h3>
<ul>
{{for ott, id in treasure_id_by_ott.items():}}
<li><label><input class="treasure_check ott{{=ott}} OZid{{=id}}" type="checkbox" disabled="disabled" /><span><span></span></span> {{=XML(formatted_name_by_ott[ott])}}</label></li>
{{pass}}
</ul>
</div>
<script type="text/javascript">
<!-- could define js variables (specifically: pagetitle_func, tree_config, screensaver_config, tutorial_config) here -->
var pagetitle_func = function(nm) {return (nm)?{{=XML(__import__('json').dumps(str(T('OneZoom Treasure Hunt: '))))}}+ nm:{{=XML(__import__('json').dumps(str(T('OneZoom Treasure Hunt game'))))}}};

OLD_openLinkouts = UI_callbacks.openLinkouts;
found_one = function() {
    var left_to_find = $('#treasure_list .treasure_check').not(":checked").length
    if (left_to_find == 0) {
        alert({{=XML(__import__('json').dumps(str(T('Well done, you found them all!'))))}});        
    } else {
        alert({{=XML(__import__('json').dumps(str(T('You found one. {remaining} left'))))}}.replace('{remaining}', String(left_to_find)));
    }
};

UI_callbacks.openLinkouts = function(id, IDtype) {
    var target_otts = [{{=",".join([str(ott) for ott in treasure_id_by_ott.keys()])}}];
    var target_OZids = [{{=",".join([str(oz) for oz in treasure_id_by_ott.values()])}}];
    if ((IDtype=='ott') && (target_otts.includes(id))) {
        if ($('#treasure_list .treasure_check.ott' + id).not(':checked')) {
            $('#treasure_list .treasure_check.ott' + id).attr('checked','checked');
            found_one();
        }
    } else if ((IDtype=='OZid') && (target_OZids.includes(id))) {
        if ($('#treasure_list .treasure_check.OZid' + id).not(':checked')) {
            $('#treasure_list .treasure_check.OZid' + id).attr('checked','checked');
            found_one();
        }
    } else {
        OLD_openLinkouts();
    }
};
</script>