Online location filter

Developing with LiveWhale
1

Hi folks,

Is it possible to have any events that are marked as online events to be grouped into an event “location” called online?

2

I don’t know if this is helpful, but I wrote a backend.js customization that enters “Virtual” in the location field and locks that field so it can’t be changed. Seems like that would accomplish what you are wanting.

3 
// Add extra functionality to the online event selector in the Event editor
if ($('body').attr('id') == 'events_edit') {
    function lockLocation(){
        $('.places-remove').click(); // remove location map if one was added
        $('#places_location').prop('readonly',true).css({'opacity':'.5','pointer-events':'none'}); // disable location field
        $('.places-add-new-checkbox').prop('disabled',true); // disable new location checkbox
        $('.places-select-existing, .places-options .checkbox').addClass('disabled'); // disable all locations button
    };
    function unlockLocation(){
        $('#places_location').prop('readonly',false).css({'opacity':'','pointer-events':''}); // enable location field
        $('.places-add-new-checkbox').prop('disabled',false); // enable new location checkbox
        $('.places-select-existing, .places-options .checkbox').removeClass('disabled'); // enable all locations button
    };
    $(window).on('load',function(){
        // If loading an event with the online event box checked and the online only option chosen
        if ( $('#is_online').prop('checked') && $('[name="online_type"]:checked').val() == 1 ) {
            lockLocation(); // just lock the location fields (location should have already been saved as "virtual")
        }
    })
    $('#is_online').on('change',function(){
        // when the online event checkbox is checked and online type is not 2 (hybrid) 
        if ( $('#is_online').prop('checked') && $('[name="online_type"]:checked').val() != 2 ) {
            $('#places_location').val('Virtual'); // set the location field to "Virtual"
            lockLocation(); // and lock the location fields
        }
        // otherwise, means the online checkbox was unchecked OR hybrid is chosen
        else {
            if ($('#places_location').val() == 'Virtual') {
                $('#places_location').val(''); // if location field has a value of "virtual", clear it
            }
            unlockLocation(); // unlock the location fields
        }
    });
    $('[name="online_type"]').on('change',function(){
        // when the online type option is set to online only
        if ( $('[name="online_type"]:checked').val() == 1 ) {
            $('#places_location').val('Virtual'); // set the location field to "Virtual"
            lockLocation(); // and lock the location fields
        }
        // otherwise, means it is set to hybrid
        else {
            if ($('#places_location').val() == 'Virtual') {
                $('#places_location').val(''); // if location field has a value of "virtual", clear it
            }
            unlockLocation(); // unlock the location fields
        }
    });
}
4

Hi folks,

Another way of approaching this is: we do have a standalone “is this event online” filter checkbox that you can see referenced in /livewhale/theme/core/components/calendar/lw_cal_categories.html:

<div id="lw_cal_online_selector" class="lw_cal_selector"></div>

That online selector we typically theme inside of the “categories” dropdown, but actually it doesn’t need to live there, it could go anywhere. (The checkbox itself is themed using the calendar component lw_cal_online_selector.html if you want to redesign or reword it.)

So, Rob, if your theming already has a component filtering by location, you could add or move that lw_cal_online_selector into the top of that, and the Online events checkbox would go there instead. Hope this may help!

5

Thank you both so much!