Set.prototype.isSuperset = function(subset) { let this_set = this subset.forEach (function(elem) { if (!this_set.has(elem)) { return false; } }) return true; } Set.prototype.union = function(setB) { let union = Set.from_iterable(this); let this_set = this setB.forEach(function(elem) { union.add(elem); }) return union; } Set.prototype.intersection = function(setB) { var intersection = new Set(); let this_set = this setB.forEach(function(elem) { if (this_set.has(elem)) { intersection.add(elem); } }) return intersection; } Set.prototype.difference = function(setB) { var difference = Set.from_iterable(this); setB.forEach( function (elem) { difference.delete(elem); }) return difference; } Set.from_iterable = function(arr) { if(typeof Set.prototype.values == 'undefined'){ var new_set = new Set() arr.forEach(function(v,i,t){ new_set.add(v) }) }else{ var new_set = new Set(arr) } return new_set } var initHooch = function(){ hooch = { Emptier: Class.extend({ init: function($emptier){ var $target = $($emptier.data('target')); var emptier = this var scroll_to_selector = $emptier.data('scroll-to') if($(scroll_to_selector).length > 0){ this.scroll_to = $(scroll_to_selector) } $emptier.click(function(e){ $target.empty(); if(emptier.scroll_to){ if($('[data-hooch-offset]').length > 0){ extra_offset = $('[data-hooch-offset]').outerHeight() } $('html, body').animate({ scrollTop: emptier.scroll_to.offset().top - extra_offset }, 300); } }) } }), Toggler: Class.extend({ init: function(jq_obj){ this.jq_obj = jq_obj; this.label = jq_obj.data('toggler'); this.value = jq_obj.val(); this.targets = $('[data-toggle_trigger="' + this.label + '"]'); this.targets.hide(); this.targets.filter('[data-toggle_value="' + this.value + '"]').show(); } }), HideShow: Class.extend({ init: function($trigger){ this.$trigger = $trigger this.$target = $($trigger.data('target')) var trigger = this if($trigger.data('any-click-closes')){ $(window).on('click',function(e){ if(trigger.$target.is(':visible') && ($(e.target).data('target') != trigger.$trigger.data('target'))){ trigger.$target.hide() } }) } $trigger.on('click', function(e){ trigger.$target.toggle() }) } }), HoverOverflow: Class.extend({ init: function(jq_obj){ this.old_border = jq_obj.css('border-right'); this.old_z_index = jq_obj.css('z-index'); var hoverable = this; jq_obj.bind('mouseover',function(){ hoverable.jq_obj.css({'overflow':'visible','z-index':'10000','border-right':'1px solid white'}); }); jq_obj.bind('mouseout',function(){ hoverable.jq_obj.css({'overflow':'hidden','z-index':hoverable.old_z_index,'border-right':hoverable.old_border}); }); } }), HoverReveal: Class.extend({ init: function($hover_revealer){ var $revealable = $hover_revealer.data('revealable') $hover_revealer.bind('mouseover',function(){ $revealable.show(); }); $hover_revealer.bind('mouseout',function(){ $revealable.hide(); }); } }), HideyButton: Class.extend({ init: function($hidey_button){ $hidey_button.hide(); this.form = $hidey_button.parents('form'); this.$hidey_button = $hidey_button; this.bindInputs(); }, bindInputs: function(){ this.inputs = this.form.find('input,select,textarea'); var hidey_button = this; this.cache_input_values(); this.inputs.each(function(){ $(this).bind("propertychange keyup input paste datechange change",function(){ if(hidey_button.form_changed()){ hidey_button.$hidey_button.show(); } else { hidey_button.$hidey_button.hide(); } }) }); }, cache_input_values: function(){ this.inputs.each(function(){ if($(this).is(":checkbox")){ $(this).data('oldstate',$(this).is(':checked')); } else { $(this).data('oldval',$(this).val()); } }) }, form_changed: function(){ var changed = false; this.inputs.each(function(){ if($(this).is(":checkbox")){ if($(this).data('oldstate') != $(this).is(':checked')){ changed = true; return false; } }else{ if($(this).data('oldval') != $(this).val()){ changed = true; return false; } } }) return changed; } }), ModalTrigger: Class.extend({ init: function($modal_trigger){ this.$modal_content = $($modal_trigger.data('content-target')) var modal_trigger = this $modal_trigger.on('click', function(){ new hooch.Modal(modal_trigger.$modal_content) }) } }), ModalDismisser: Class.extend({ init: function($dismisser,modal_mask){ var dismisser = this this.$dismisser = $dismisser; hooch.dismisser = this this.modal_mask = modal_mask $dismisser.css({cursor: 'pointer'}) $dismisser.on('click', function(){ dismisser.dismissModal() }) }, dismissModal: function(){ hooch.dismisser = null this.modal_mask.close() } }), Modal: Class.extend({ init: function($modal_content){ this.$modal_content = $modal_content this.getMask() this.getDismisser() this.getContentWrapper() this.attachDismisser() this.disableScroll() this.$modal_content.trigger('modalInitialized') this.$modal_mask.show() this.$modal_content.trigger('modalVisible') }, getMask: function(){ this.mask_top = $(window).scrollTop() this.mask_height = $(window).height() this.$modal_mask = $('#hooch-mask') this.$modal_mask.css({height: this.mask_height + 'px', top: this.mask_top + 'px', position: 'absolute', 'z-index': 100000, left: 0, right: 0, bottom: 0 }) }, getContentWrapper: function(){ this.$modal_wrapper = this.$modal_mask.find('#hooch-modal') this.$modal_element = $('
', {id: 'hooch_content', style: 'position: relative; float: left;'}) this.$modal_wrapper.html(this.$modal_element) this.$modal_element.html(this.$modal_content) this.$modal_content.show() }, getDismisser: function(){ this.$dismisser = this.$modal_mask.find('#hooch-dismiss') }, attachDismisser: function(){ this.$modal_wrapper.append(this.$dismisser) this.dismisser = new hooch.ModalDismisser(this.$dismisser,this) }, close: function(){ this.$modal_mask.hide() this.$modal_content.hide() this.enableScroll() this.$modal_content.trigger('modalClosed') }, disableScroll: function(){ var modal = this modal.old_height = $('body')[0].style.height modal.old_overflow = $('body')[0].style.overflow $('body').css({height: '100%',overflow: 'hidden'}) $('body').on({ 'mousewheel.hoochModalScroll DOMMouseScroll.hoochModalScroll': function(e) { if(($(e.target).attr('id') == 'hooch-content') || ($(e.target).parents('#hooch-content').length > 0)){ var delta = e.originalEvent.wheelDelta new_scrolltop = $('#hooch-content').scrollTop() - delta $('#hooch-content').scrollTop(new_scrolltop) } e.preventDefault(); } }) if (window.addEventListener){ // older FF window.addEventListener('DOMMouseScroll', hooch.preventDefault, false) } window.onwheel = hooch.preventDefault; // modern standard window.onmousewheel = document.onmousewheel = hooch.preventDefault; // older browsers, IE window.ontouchmove = hooch.preventDefault; // mobile document.onkeydown = hooch.preventDefaultForScrollKeys; }, enableScroll: function(){ $('body').css({height: this.old_height, overflow: this.old_overflow}) $('body').off('.hoochModalScroll') if (window.removeEventListener){ window.removeEventListener('DOMMouseScroll', hooch.preventDefault, false); } window.onmousewheel = document.onmousewheel = null; window.onwheel = null; window.ontouchmove = null; document.onkeydown = null; } }), closeModal: function(){ if(hooch.dismisser){ hooch.dismisser.dismissModal() } }, Expandable: Class.extend({ init: function($expandable){ var expandable = this; this.expand_class = $expandable.data('expand-class'); this.collapse_class = $expandable.data('collapse-class'); this.$expandable = $expandable; $expandable.data('expandable',this); this.collapsers = [] this.$collapser = $('[data-expand-id="' + $expandable.data('expand-id') + '"][data-collapser]'); if(this.$collapser.length > 0){ this.$collapser.each(function(){ if($(this).data('hooch_collapser')){ var hooch_collapser = $(this).data('hooch_collapser') expandable.collapsers.push(hooch_collapser) hooch_collapser.addExpandable(expandable) } else{ expandable.collapsers.push(new hooch.Collapser($(this),expandable)) } }) } this.$expander = $('[data-expand-id="' + $expandable.data('expand-id') + '"][data-expander]'); this.expanders = [] this.$expander.each(function(){ if($(this).data('hooch_expander')){ var hooch_expander = $(this).data('hooch_expander') expandable.expanders.push(hooch_expander) hooch_expander.addExpandable(expandable) } else{ expandable.expanders.push(new hooch.Expander($(this),expandable)) } }) this.initial_state = $expandable.data('expand-state'); if(this.initial_state == 'expanded'){ this.expand(); } else { this.collapse(); } }, hide_expanders: function(){ $.each(this.expanders, function(){ this.hide(); }) }, hide_collapsers: function(){ $.each(this.collapsers, function(){ this.hide(); }) }, show_expanders: function(){ $.each(this.expanders, function(){ this.show(); }) }, show_collapsers: function(){ $.each(this.collapsers, function(){ this.show(); }) }, expand: function(){ if(this.collapsers.length > 0){ this.show_collapsers(); } this.hide_expanders(); if(this.expand_class){ this.$expandable.addClass(this.expand_class) this.$expandable.removeClass(this.collapse_class) }else{ this.$expandable.show(); } this.state = 'expanded' }, collapse: function(){ if(this.collapsers.length > 0){ this.hide_collapsers(); } this.show_expanders(); if(this.collapse_class || this.expand_class){ this.$expandable.addClass(this.collapse_class) this.$expandable.removeClass(this.expand_class) }else{ this.$expandable.hide(); } this.state = 'collapsed' }, toggle: function(){ if(this.state == 'collapsed'){ this.expand(); } else { this.collapse(); } } }), Expander: Class.extend({ init: function($expander,target){ this.$expander = $expander; this.$expander.data('hooch_expander', this); this.targets = [target]; this.expand_class = $expander.data('expand-class') this.collapse_class = $expander.data('collapse-class') this.bindTarget(target); }, addExpandable: function(target){ this.targets.push(target) this.bindTarget(target) }, bindTarget: function(target){ if(this.$expander.data('fake-dropdown')){ target.$expandable.on('click',function(){ target.toggle(); }) target.$expandable.on('mouseleave',function(){ target.collapse(); }) } this.$expander.bind('click',function(){ target.toggle(); }) }, hide: function(){ if(this.expand_class || this.collapse_class){ if(this.expand_class){ this.$expander.addClass(this.expand_class) } if(this.collapse_class){ this.$expander.removeClass(this.collapse_class) } } else if(this.targets[0].collapsers.length > 0) { this.$expander.hide(); } }, show: function(){ if(this.expand_class || this.collapse_class){ if(this.expand_class){ this.$expander.removeClass(this.expand_class) } if(this.collapse_class){ this.$expander.addClass(this.collapse_class) } } else if(this.targets[0].collapsers.length > 0) { this.$expander.show(); } } }), Collapser: Class.extend({ init: function($collapser,target){ this.$collapser = $collapser; this.$collapser.data('hooch_collapser', this); $collapser.bind('click',function(){ target.collapse(); }) }, addExpandable: function(target){ this.$collapser.bind('click',function(){ target.collapse(); }) }, hide: function(){ this.$collapser.hide(); }, show: function(){ this.$collapser.show(); } }), DisableForms: Class.extend({ init: function($disable_container){ $disable_container.find('input, select').each(function(){ $(this).prop('disabled',true); }); } }), Revealer: Class.extend({ init: function($revealer){ var revealer = this; this.$revealer = $revealer; this.children_id = this.$revealer.data('revealer-children-id'); this.$all_children = $('[data-revealer-id="' + this.children_id + '"]'); this.bindEvent(); revealer.reveal(); }, reveal: function(){ var sanitized_value = this.getSanitizedValue(); if('true' == sanitized_value){ sanitized_value = true } if('false' == sanitized_value){ sanitized_value = false } this.$children = []; var revealer = this; this.$all_children.each(function(){ var triggers = $(this).data('revealer-triggers'); if(triggers){ trigger_prototype = typeof(triggers) if(trigger_prototype.toLowerCase() == 'string'){ var revelation_triggers = eval('(' + triggers + ')'); } else { revelation_triggers = triggers } if($.inArray(sanitized_value,revelation_triggers) > -1){ revealer.$children.push($(this)); } } else { if(sanitized_value == $(this).data('revealer-trigger')){ revealer.$children.push($(this)); } } }); this.hideChildren(); this.revealChosenOnes(); }, getSanitizedValue: function(){ if(this.$revealer[0].nodeName.toLowerCase() == "select"){ var sanitized_value = this.$revealer.val(); } else if(this.$revealer[0].nodeName.toLowerCase() == "input" && this.$revealer.attr('type') == "checkbox"){ var sanitized_value = this.$revealer.is(':checked'); } return sanitized_value; }, hideChildren: function(){ this.$all_children.hide(); }, revealChosenOnes: function(){ $.each(this.$children,function(){ $(this).show(); }); }, bindEvent: function(){ var revealer = this; this.$revealer.bind('change',function(){ revealer.reveal(); }); } }), TabGroup: Class.extend({ init: function($tab_group){ this.$tab_group = $tab_group; this.getStateBehavior(); this.getName(); this.tab_triggers = []; this.tab_triggers_by_id = {}; this.getTabTriggerClass(); this.createTabs(); this.getConentParent(); this.hideAll(); this.handleDefault(); hooch.TabGroup.addGroup(this); }, createTabs: function(){ var tab_group = this; this.$tab_group.find("[data-tab-trigger]").each(function(){ var new_tab = new tab_group.tab_trigger_class($(this),tab_group); tab_group.tab_triggers.push(new_tab); tab_group.tab_triggers_by_id[new_tab.tab_id] = new_tab; }) }, getTabByPushState: function(state_value){ var selected_tab = null; $.each(this.tab_triggers,function(index,trigger){ if(trigger.push_state == state_value){ selected_tab = trigger; } }) return selected_tab; }, getName: function(){ this.name = this.$tab_group.data('tab-group'); }, getConentParent: function(){ this.$content_parent = this.tab_triggers[0].getParent(); }, handleDefault: function(){ if(this.$tab_group.data('default-tab')){ this.default_tab = this.tab_triggers_by_id[this.$tab_group.data('default-tab')]; this.default_tab.toggleTarget(this.state_behavior); } }, hideAll: function(trigger){ $.each(this.tab_triggers,function(){ this.hideTarget(); }) }, getTabTriggerClass: function(){ this.tab_trigger_class = hooch.TabTrigger; }, deactivateTabTriggers: function(){ $.each(this.tab_triggers,function(){ this.$tab_trigger.removeClass('active'); }) }, setActiveTab: function(tab_trigger){ if(this.active_tab){ var parent_height = this.$content_parent.height(); this.$content_parent.css({'height': parent_height, 'overflow': 'hidden'}); } this.hideAll(); this.deactivateTabTriggers(); this.active_tab = tab_trigger; tab_trigger.revealTarget(); }, resize: function(){ this.$content_parent.css({'height': 'auto', 'overflow': 'visible'}); }, getActiveTab: function(){ return this.active_tab; }, getStateBehavior: function(){ if(this.$tab_group.data('no-history')){ this.state_behavior = 'no history' } else { this.state_behavior = 'replace' } } }), TabTrigger: Class.extend({ init: function($tab_trigger,tab_group){ this.$tab_trigger = $tab_trigger; this.tab_group = tab_group; this.state_behavior = this.tab_group.state_behavior this.tab_group_name = tab_group.name; this.tab_id = $tab_trigger.data('tab-target-id'); this.getPushState(); this.getTarget(); var tab_trigger = this; $tab_trigger.on('click', function(e){ e.preventDefault(); tab_trigger.$tab_trigger.trigger('tabTriggerClicked') tab_trigger.toggleTarget() tab_trigger.$tab_trigger.trigger('tabLoaded') }) }, getTarget: function(){ this.$target = $('[data-tab-id="' + this.tab_id + '"]'); }, getPushState: function(){ if(this.$tab_trigger.data('push-state') != null && this.$tab_trigger.data('push-state') != ""){ this.push_state = this.$tab_trigger.data('push-state') } }, toggleTarget: function(requested_state_behavior){ var was_visible = this.$target.is(':visible'); if(!was_visible){ this.tab_group.setActiveTab(this); this.resize(); var change_history = true; var history_method = 'pushState' if('no history' == requested_state_behavior || 'no history' == this.state_behavior){ change_history = false } else if('replace' == requested_state_behavior){ history_method = 'replaceState' } if (this.push_state && change_history) { var current_query = jQuery.extend(true, {}, hooch.beginning_params); current_query = jQuery.extend(true, current_query, history.state); var current_state = new hooch.IhHistoryState(current_query) current_state.addState(this.tab_group_name, this.push_state); history[history_method](current_state.state, null, current_state.toUrl()); } } }, hideTarget: function(){ this.$target.hide(); }, revealTarget: function(){ this.$target.show(); this.$tab_trigger.addClass('active'); }, getParent: function(){ return this.$target.parent(); }, resize: function(){ this.tab_group.resize(); } }), IhHistoryState: Class.extend({ init: function(state){ this.state = jQuery.extend(true, {}, state); }, toQueryString: function(){ return $.param(this.state) }, toUrl: function(){ return [location.protocol, '//', location.host, location.pathname, '?', this.toQueryString()].join(''); }, addState: function(key,value){ var new_state = {} new_state[key] = value this.state = $.extend(true, this.state, new_state); }, addPath: function(new_path){ this.new_path = new_path }, newPath: function(){ return [location.protocol, '//', location.host, this.new_path].join(''); }, addKeyValue: function(key,value){ this.addState(key,value) this.setNewParams() }, setNewParams: function(){ history['replaceState'](this.state, null, this.toUrl()); }, replacePath: function(new_path){ this.addPath(new_path) history['replaceState']({}, null, this.newPath()); } }), HistoryPusher: Class.extend({ init: function($history_pusher){ this.$history_pusher = $history_pusher this.getPusherType() var history_pusher = this this.bindPusher() }, bindPusher: function(){ var bind_method = 'bind' + this.pusher_type this[bind_method]() }, bindLink: function(){ var history_pusher = this this.$history_pusher.on('click apiclick', function(){ history_pusher.pushIt() }) }, bindForm: function(){ var history_pusher = this this.$history_pusher.on('submit apisubmit', function(){ history_pusher.pushIt() }) }, getPusherType: function(){ switch(this.$history_pusher.get(0).nodeName.toLowerCase()){ case 'form': this.pusher_type = 'Form' break; case 'a': default: this.pusher_type = 'Link' break; } }, getNewParams: function(){ var get_params_method = 'get' + this.pusher_type + 'Params' this[get_params_method]() }, getFormParams: function(){ this.new_params = this.$history_pusher.serializeArray(). reduce( function(obj, item) { obj[item.name] = item.value; return obj; }, {} ); }, getLinkParams: function(){ this.new_params = {} this.new_params[this.$history_pusher.data('key')] = this.$history_pusher.data('value') }, pushIt: function(){ this.getNewParams() var history_pusher = this history_pusher.current_state = new hooch.IhHistoryState(history.state) $.each(this.new_params,function(new_key,new_value){ history_pusher.current_state.addState(new_key,new_value) }) history_pusher.current_state.setNewParams() } }), HistoryReplacer: Class.extend({ init: function($history_replacer){ this.new_path = $history_replacer.data('new-path') var history_replacer = this $history_replacer.on('click', function(){ history_replacer.replaceIt() }) }, replaceIt: function(){ this.current_state = new hooch.IhHistoryState(history.state) this.current_state.replacePath(this.new_path) } }), GoProxy: Class.extend({ init: function($proxy){ this.first_submit = true; var go_proxy = this; go_proxy.$proxy = $proxy; go_proxy.target = go_proxy.getTarget(); go_proxy.prevent_double_submit = $proxy.data('prevent-double-submit') switch($proxy.get(0).nodeName.toLowerCase()){ case 'input': switch($proxy.attr('type')){ case 'checkbox': default: $proxy.on('change',function(){ go_proxy.doItNow(); }) break; } break; case 'select': $proxy.on('change',function(){ go_proxy.doItNow(); }) break; case 'a': default: $proxy.on('click',function(e){ e.preventDefault(); go_proxy.doItNow(); return false; }); break; } }, doable: function(){ return(this.first_submit || !this.prevent_double_submit) } }), FieldFiller: Class.extend({ init: function($field_filler){ this.$field_filler = $field_filler this.value = $field_filler.data('value'); this.target = $($field_filler.data('target')); var field_filler = this this.$field_filler.bind('click', function(e){field_filler.fill(e)}) }, fill: function(e){ e.preventDefault(); this.target.val(this.value); return false; } }), CheckboxProxy: Class.extend({ init: function($proxy){ this.$proxy = $proxy; this.target = $($proxy.data('target')); var checkbox_proxy = this; if(checkbox_proxy.target.prop('checked')){ this.$proxy.html("✓"); } $proxy.on('click',function(){ if(checkbox_proxy.target.prop('checked')){ checkbox_proxy.uncheck(); }else{ checkbox_proxy.check(); } }) }, uncheck: function(){ this.target.prop('checked', false); this.$proxy.html(""); }, check: function(){ this.target.prop('checked', true); this.$proxy.html("✓"); } }), Remover: Class.extend({ init: function($remover){ var $target = $($remover.data('target')); $remover.click(function(e){ $target.remove(); }) } }), Link: Class.extend({ init: function($link){ $link.click(function(){ window.location = $link.attr('href'); }) } }), CheckboxHiddenProxy: Class.extend({ init: function($checkbox){ this.checked_value = $checkbox.data('checked-value'); this.unchecked_value = $checkbox.data('unchecked-value'); var target_selector = $checkbox.data('target'); this.target = $(target_selector); var checkbox = this; $checkbox.click(function(){ if ($(this).is(':checked')) { checkbox.target.val(checkbox.checked_value); } else { checkbox.target.val(checkbox.unchecked_value); } }) } }), PreventDoubleSubmit: Class.extend({ init: function($clickable){ this.$clickable = $clickable; var double_click_preventer = this; switch($clickable.get(0).nodeName.toLowerCase()){ case 'form': $clickable.submit(function(e){ double_click_preventer.preventItNow(); }); break; case 'input': default: $clickable.click(function() { setTimeout(function(){ $clickable.attr("disabled", "disabled"); }, 10); }); break; } }, preventItNow: function(){ this.$clickable.submit(function(e){ e.preventDefault(); return false; }); } }), PreventDoubleLinkClick: Class.extend({ init: function($clickable){ $clickable.click(function(e) { if($clickable.data('clicked')) { e.preventDefault(); return false; } else { $clickable.data('clicked',true); return true; } }); } }), ReloadPage: Class.extend({ init: function(reload_page){ window.location.href = reload_page; } }), PageReloader: Class.extend({ init: function($reloader){ $reloader.on('click', function(){ window.location.reload(true) }) } }), FakeCheckbox: Class.extend({ init: function($fake_checkbox){ this.$fake_checkbox = $fake_checkbox this.$form = this.getForm() this.prepDeselectors() this.$field = this.getField() var fake_checkbox = this this.$fake_checkbox.click(function(){ fake_checkbox.change() }) }, change: function(){ if(this.$fake_checkbox.hasClass('checked')){ this.deselect() } else { this.select() } }, deselect: function(){ this.$fake_checkbox.removeClass('checked') this.removeCheckedFromForm() this.removeValue() }, select: function(){ this.$fake_checkbox.addClass('checked') this.addCheckedToForm() this.addValue() }, getField: function(){ this.field_name = this.$fake_checkbox.data('field-name') this.value = this.$fake_checkbox.data('field-value') this.field_selector = '[name="' + this.field_name +'"][value="' + this.value + '"]' var $field if(this.$form.find(this.field_selector).length > 0){ $field = this.$form.find(this.field_selector) this.$fake_checkbox.addClass('checked') this.addCheckedToForm() } else { $field = $('') } return $field }, getForm: function(){ var form_selector = this.$fake_checkbox.data('form-selector') var $form = $(form_selector) if($form.length == 0){ console.log("WARNING: hooch.FakeCheckbox could not find the form with the selector '" + form_selector + "'") } var toggleable_selector = this.$fake_checkbox.data('toggle-form') if(toggleable_selector == true || toggleable_selector == 'true'){ this.$toggle_form = $form } else { var $toggleable = $(toggleable_selector) if($toggleable.length > 0){ this.$toggle_form = $toggleable } else { this.$toggle_form = false } } return $form }, prepDeselectors: function(){ var $deselector = this.$form.find('[data-fake-deselector]') var fake_checkbox = this $deselector.on('click', function(){ if(fake_checkbox.$fake_checkbox.hasClass('checked')){ fake_checkbox.deselect() } }) }, addValue: function(){ this.$form.append(this.$field) this.possiblyShowForm() }, removeValue: function(){ this.$field.detach() this.possiblyHideForm() }, possiblyShowForm: function(){ if(this.$toggle_form && this.$toggle_form.is(':hidden')){ this.$toggle_form.show() } }, possiblyHideForm: function(){ if(this.$toggle_form && this.$toggle_form.is(':visible') && this.formNoCheckedBoxes()){ this.$toggle_form.hide() } }, addCheckedToForm: function(){ if(this.$toggle_form){ var form_checkbox_list = this.$form.data('checked_fake_checkboxes') if(form_checkbox_list){ form_checkbox_list.push(this.field_selector) this.$form.data('checked_fake_checkboxes',form_checkbox_list) } else { this.$form.data('checked_fake_checkboxes',[this.field_selector]) } } }, removeCheckedFromForm: function(){ if(this.$toggle_form){ var form_checkbox_list = this.$form.data('checked_fake_checkboxes') var fake_checkbox = this var new_list = $.grep(form_checkbox_list, function(fs){return fs != fake_checkbox.field_selector}) this.$form.data('checked_fake_checkboxes',new_list) } }, formNoCheckedBoxes: function(){ return (!this.$form.data('checked_fake_checkboxes') || this.$form.data('checked_fake_checkboxes').length == 0) } }), FakeSelect: Class.extend({ init: function($fake_select){ this.all_options = [] this.select_display = $fake_select.find('[data-select-display]') this.real_select = $fake_select.find('input') var fake_select = this $fake_select.find('[data-select-value][data-select-name]').each(function(){ fake_select.all_options.push(new hooch.FakeOption($(this), fake_select)); }) if(this.real_select.val() != "" && typeof(this.real_select.val()) != "undefined"){ this.initial_select(this.findOptionForValue(this.real_select.val())); } }, initial_select: function(fake_option){ this.select_display.html(fake_option.select_name); this.real_select.val(fake_option.select_value); }, select: function(fake_option){ this.initial_select(fake_option); this.select_display.trigger('click'); }, findOptionForValue: function(value){ var selected_option $.each(this.all_options, function(i, option){ if(option.select_value == value){ selected_option = option } }); return selected_option; } }), FakeOption: Class.extend({ init: function($fake_option,$fake_select){ this.select_value = $fake_option.data('select-value') this.select_name = $fake_option.data('select-name') this.$fake_option = $fake_option var fake_option = this $fake_option.on('click', function(){ $fake_select.select(fake_option) }) } }), Sorter: Class.extend({ init: function($sorter){ this.$sorter = $sorter this.$jq_obj = $sorter $sorter.data('hooch.Sorter',this) ////////////////////////////////////////// // Helpful for debugging in the browser // var new_uuid = new UUID // this.uniq_id = new_uuid.value // this.created_at = new Date() ////////////////////////////////////////// this.is_visible = $sorter.is(':visible') if(this.is_visible){ this.setWidth() this.setBoundaries() this.getSortElements() } this.getSendSort() this.startInactivityRefresh() var sorter = this $(window).on('mouseup touchend touchcancel', function(e){ sorter.onMouseup(e) }); $sorter.on('scroll', function(){ sorter.handleScroll() }) $sorter.parents().on('scroll', function(){ sorter.handleScroll() }) var observer = new MutationObserver(function(mutations) { sorter.onMutation(mutations) }); var config = { childList: true, subtree: true, attributes: true } observer.observe($sorter[0], config); }, usePolymorphicId: function(){ if(this.$sorter.data('polymorphic-id')){ return true } else { return false } }, setWidth: function(){ this.width = this.$sorter[0].getBoundingClientRect().width this.$sorter.css({width: this.width}) }, onMutation: function(mutations){ if(this.disabled) return let sorter = this; let actually_changed_nodes = false mutations.forEach(function(mutation) { if(mutation.addedNodes.length > 0){ let added_node = $(mutation.addedNodes[0]) if((!added_node.attr('id') || !added_node.attr('id').startsWith('thin_man_ajax_progress')) && !added_node.data('hooch-sorter-managed')){ actually_changed_nodes = true } } if(mutation.removedNodes.length > 0){ let removed_node = $(mutation.removedNodes[0]) if((!removed_node.attr('id') || !removed_node.attr('id').startsWith('thin_man_ajax_progress')) && !removed_node.data('hooch-sorter-managed')){ actually_changed_nodes = true } } if(actually_changed_nodes){ //updating sorter for changed element list sorter.getSortElements() sorter.setBoundaries() sorter.getSendSort() } }); }, onMouseup: function(e){ // If some user action caused a sorter to become visible, set things up if(this.disabled) return var sorter = this setTimeout(function(){ if(!sorter.is_visible){ if(sorter.$sorter.is(':visible')){ sorter.is_visible = true sorter.setWidth(); sorter.getSortElements(); } } },1000) }, handleScroll: function(){ var sorter = this if(this.scroll_finished){ clearTimeout(this.scroll_finished); } this.scroll_finished = setTimeout(function(){ sorter.setBoundaries() sorter.refreshGrid() }, 100); }, getPressedElement: function(){ if(this.sort_elements){ var possible_pressed_element = $.grep(this.sort_elements, function(sort_element,i){return sort_element.pressed}) if(possible_pressed_element.length > 0){ return possible_pressed_element[0] } } return false }, getSortElements: function(){ this.$sort_elements = this.$sorter.children() this.sort_elements = [] var sorter = this; this.$sort_elements.each(function(){ if($(this).data('hooch.SortElement')){ tmp_sort_element = $(this).data('hooch.SortElement') // if(tmp_sort_element.is_placeholder){ // var sort_element = tmp_sort_element.sort_element // } else { var sort_element = tmp_sort_element // } } else { var sort_element = new hooch.SortElement($(this),sorter) } sorter.sort_elements.push(sort_element) }) if(this.sort_elements.length > 0){ this.row_height = this.sort_elements[0].height; var elem_widths = this.sort_elements.map(function(sort_element,i,arr){return sort_element.width}) this.min_elem_width = Math.min.apply(null,elem_widths); this.refreshGrid(); if((this.min_elem_width * 2) <= this.width){ this.mode = 'Grid' } else { this.mode = 'Vertical' } } else if(this.height > 0){ this.min_elem_width = this.width; this.refreshGrid(); this.mode = 'Vertical' } }, setBoundaries: function(){ this.offset = this.$sorter[0].getBoundingClientRect() this.top_boundary = this.offset.top + window.pageYOffset this.left_boundary = this.offset.left + window.pageXOffset this.right_boundary = this.left_boundary + this.width this.height = this.$sorter[0].getBoundingClientRect().height this.bottom_boundary = this.top_boundary + this.height }, handleDrag: function(){ this.refreshSequence() this.refreshGrid() }, handleRemoval: function(){ }, refreshGrid: function(){ this.rows = {} var sorter = this $.each(this.sort_elements,function(i,sort_element){ let this_element if(sort_element != sorter.dragging_element){ this_element = sort_element } else { this_element = sort_element.placeholder } if(this_element){ var elem_top = this_element.getOffset().top; if(!sorter.rows[elem_top]){ sorter.rows[elem_top] = [] } sorter.rows[elem_top].push(this_element) } }) this.row_keys = Object.keys(this.rows).map(function(val,i){return parseFloat(val)}).sort(sorter.numberSort) if('Horizontal' == this.mode){ $.each(this.rows, function(row_key,row){row.sort(sorter.elementHorizontalSort)}) } }, draggingElementForGrid: function(){ if(this.dragging_element){ if(this.dragging_element.dragging){ return this.dragging_element.placeholder } else { return this.dragging_element } } return nil }, refreshSequence: function(){ var target_location = this.dragging_element.getCenter() var refresh_method = this['refreshSequence' + this.mode] refresh_method.call(this, target_location) }, insertDraggingElement: function(element,e){ this.dragging_element = element this.refreshSequence() this.getSortElements() this.refreshGrid() }, refreshSequenceGrid: function(target_location){ var dragging_element = this.dragging_element if(!this.withinCurrentRow(target_location.y)){ this.seekCurrentRow(target_location) } if('end' == this.current_row_key){ var last_element = this.getLastElement(); if(!last_element.is_placeholder){ last_element.$sort_element.after(dragging_element.placeholder.$sort_element) } } else if('begin' == this.current_row_key){ var first_element = this.getFirstElement(); if(!first_element.is_placeholder){ first_element.$sort_element.before(dragging_element.placeholder.$sort_element) } } else { var hovered_element = this.getHoveredElementHorizontal(target_location); if(hovered_element){ if('leftmost' == hovered_element){ var leftmost_element = this.current_row[0] leftmost_element.$sort_element.before(dragging_element.placeholder.$sort_element) } else { hovered_element.$sort_element.after(dragging_element.placeholder.$sort_element); } } } }, refreshSequenceVertical: function(target_location){ var dragging_element = this.dragging_element var hovered_element = this.getHoveredElementVertical(target_location) if(hovered_element){ if('first' == hovered_element){ var first_key = this.row_keys[0] var first_element = this.rows[first_key][0] first_element.$sort_element.before(dragging_element.placeholder.$sort_element) } else if('empty' == hovered_element){ this.$sorter.html(dragging_element.placeholder.$sort_element) } else { hovered_element.$sort_element.after(dragging_element.placeholder.$sort_element) } } }, rowAfter: function(row){ return this.row_keys[this.row_keys.indexOf[row] + 1] }, elemAfter: function(row, elem){ return row[row.indexOf(elem) + 1] }, seekCurrentRow: function(target_location){ var sorter = this var row_key = $.grep(this.row_keys,function(rowY,i){ var nextRowY = sorter.rowAfter(rowY) var below_top_edge = target_location.y >= rowY if(nextRowY){ var above_bottom_edge = target_location.y < nextRowY } else { var above_bottom_edge = target_location.y < (rowY + sorter.row_height) } return (below_top_edge && above_bottom_edge) })[0] if(row_key){ this.current_row_key = row_key; this.current_row = this.rows[row_key]; } else if(target_location.y > this.rows[Math.max.apply(null,this.row_keys)][0].getOffset().top) { this.current_row_key = 'end'; this.current_row = undefined; } else { this.current_row_key = 'begin'; this.current_row = undefined; } }, getHoveredElementHorizontal: function(target_location){ var current_element = false; var sorter = this current_element = $.grep(this.current_row, function(sort_element,i){ if(!sort_element.is_placeholder){ var elem_center = sort_element.getCenter(); var slot_left = elem_center.x; var past_left_edge = target_location.x >= slot_left var next_elem = sorter.elemAfter(sorter.current_row, sort_element) var before_right_edge if(next_elem){ if(!next_elem.is_placeholder){ var next_elem_center = next_elem.getCenter(); before_right_edge = target_location.x < next_elem_center.x } } else { before_right_edge = past_left_edge } return (past_left_edge && before_right_edge) } return false })[0] if(current_element){ return current_element } else { var first_elem = this.current_row[0] if(first_elem && !first_elem.is_placeholder && first_elem.getCenter().x > target_location.x){ return 'leftmost' } } }, getHoveredElementVertical: function(target_location){ if(this.$sort_elements.length == 0){ return 'empty' } else { var sorter = this current_element_key = $.grep(sorter.row_keys, function(row_key,i){ var this_elem = sorter.rows[row_key][0] if(!this_elem.is_placeholder){ var elem_center = this_elem.getCenter() var slot_top = elem_center.y var below_top_edge = target_location.y >= slot_top var next_row = sorter.rows[sorter.row_keys[i+1]] var above_bottom_edge var next_elem if(next_row){ next_elem = next_row[0] if(next_elem && !next_elem.is_placeholder){ var next_elem_center = next_elem.getCenter() above_bottom_edge = target_location.y < next_elem_center.y } } if(!next_elem){ above_bottom_edge = below_top_edge } return(below_top_edge && above_bottom_edge) } return false })[0] if(current_element_key){ return this.rows[current_element_key][0] } else { var first_key = this.row_keys[0] var first_elem = this.rows[first_key][0] if(first_elem && !first_elem.is_placeholder && first_elem.getCenter().y > target_location.y){ return 'first' } } } }, getLastElement: function(){ var last_row_key = this.row_keys[this.row_keys.length-1] var last_row = this.rows[last_row_key]; return last_row[last_row.length-1] }, getFirstElement: function(){ var first_row_key = this.row_keys[0] var first_row = this.rows[first_row_key] return first_row[0] }, elementHorizontalSort: function(a,b){ if(a.getOffset().left < b.getOffset().left){ return -1 } if(b.getOffset().left < a.getOffset().left){ return 1 } return 0 }, numberSort: function(a,b){ if(parseInt(a) < parseInt(b)){return -1} if(parseInt(b) < parseInt(a)){return 1} return 0 }, withinCurrentRow: function(y_value){ if(this.current_row_key){ var top_edge = this.current_row_key var bottom_edge = top_edge + this.row_height; var in_current_row = (top_edge < y_value) && (y_value < bottom_edge) if(in_current_row){ this.current_row = this.rows[this.current_row_key] } return in_current_row } return false }, setDraggingElement: function(sort_element){ this.dragging_element = sort_element; var current_row = this.rows[sort_element.starting_offset.top] drag_index = current_row.indexOf(sort_element) if(drag_index > -1){ current_row.splice(drag_index, 1) } current_row.push(sort_element.placeholder) this.refreshGrid(); }, giveUpDraggingElement: function(){ let sorter = this $.each(this.rows, function(row_key, row){ let placeholder_index = sorter.rows[row_key].indexOf(sorter.dragging_element.placeholder) if(placeholder_index > -1){ sorter.rows[row_key].splice(placeholder_index,1) } }) delete this.dragging_element this.getSortElements() }, dropDraggingElement: function(){ this.reinsertDraggingElement() this.sendSort() }, reinsertDraggingElement: function(){ if(this.dragging_element){ this.rows[this.placeholderRowKey()].push(this.dragging_element) this.dragging_element.drop() delete this.dragging_element this.refreshGrid(); } }, sendSort: function(){ $.ajax({ url: this.$sorter.attr('href'), method: 'PATCH', data: this.getFormData() }) }, getFormData: function(){ var id_array = $.map(this.$sorter.children(),function(e,i){return $(e).attr('id')}) var form_data = {} if(this.usePolymorphicId()){ form_data['polymorphic_items'] = id_array } else { var first_id = id_array[0] var last_underscore_location = first_id.lastIndexOf('_') var array_name = first_id.slice(0,last_underscore_location) form_data[array_name] = id_array.map(function(id){ return id.slice((last_underscore_location + 1)) }) } if(this.$sorter.data('sort-field')){ form_data['sort_field'] = this.$sorter.data('sort-field') } var csrf_token = $('[name="csrf-token"]').attr('content') if(csrf_token){ form_data['authenticity_token'] = csrf_token } return form_data }, placeholderRowKey: function(){ var sorter = this return $.grep(this.row_keys, function(row_key,i){ var placeholder_index = sorter.rows[row_key].indexOf(sorter.dragging_element.placeholder) if(placeholder_index > -1){ sorter.rows[row_key].splice(placeholder_index,1) return true } return false })[0] }, containsPoint: function(point){ let contains_horizontal = this.left_boundary <= point.x && point.x <= this.right_boundary let contains_vertical = this.top_boundary <= point.y && point.y <= this.bottom_boundary return contains_horizontal && contains_vertical }, matchesFilters: function(element_filters){ let recipient_filters = this.$sorter.data('recipient-filters') if(typeof element_filters.any == 'object'){ // At least one of these is required to match let any = true for(var key in element_filters.any){ if(!recipient_filters.hasOwnProperty(key)){ any = false break } let include_source = Set.from_iterable(recipient_filters[key]) let include_test = Set.from_iterable(element_filters.any[key]) if(include_source.intersection(include_test).size == 0){ any = false break } } if(!any) return false } // All of these are required to match let all = true for(var key in element_filters.all){ if(!recipient_filters.hasOwnProperty(key)){ all = false break } let include_source = Set.from_iterable(recipient_filters[key]) let include_test = Set.from_iterable(element_filters.all[key]) if(!include_source.isSuperset(include_test)){ all = false break } } if(!all) return false // None of these can be present to match var none = true for(var key in element_filters.none){ if(!recipient_filters.hasOwnProperty(key)){continue} let exclude_source = Set.from_iterable(recipient_filters[key]) let exclude_test = Set.from_iterable(element_filters.none[key]) if(exclude_source.intersection(exclude_test).size != 0){ none = false break } } if(!none) return false return true }, maskMe: function(){ this.mask = $('