tab.coffee

This commit is contained in:
nitely 2017-11-09 12:22:50 -03:00
parent d17e6d7939
commit 1583f3ad4e
2 changed files with 28 additions and 43 deletions

View File

@ -7,17 +7,19 @@ class Tab
constructor: (el) ->
@el = el
@containerElm = @el.closest(".js-tabs-container")
@setUp()
setUp: ->
@el.on('click', @tabSwitch)
@el.on('click', @stopClick)
@el.addEventListener('click', @tabSwitch)
tabSwitch: =>
tabSwitch: (e) =>
e.preventDefault()
e.stopPropagation()
@hideAllTabsContent()
if @el.hasClass("is-selected")
@el.removeClass("is-selected")
if @el.classList.contains('is-selected')
@el.classList.remove('is-selected')
else
@unselectAllTabs()
@selectTab()
@ -26,33 +28,23 @@ class Tab
return
hideAllTabsContent: =>
$tabs_container = @el.closest(".js-tabs-container")
$tabs_content = $tabs_container.find(".js-tab-content")
$tabs_content.hide()
tabContentElms = @containerElm.querySelectorAll(".js-tab-content")
Array.from(tabContentElms).forEach((elm) ->
elm.style.display = 'none'
)
unselectAllTabs: =>
$tabs_container = @el.closest(".js-tabs-container")
$tabs = $tabs_container.find(".js-tab")
$tabs.removeClass("is-selected")
tabElms = @containerElm.querySelectorAll(".js-tab")
Array.from(tabElms).forEach((elm) ->
elm.classList.remove('is-selected')
)
selectTab: =>
@el.addClass("is-selected")
@el.classList.add('is-selected')
showTabContent: =>
tab_content = @el.data("related")
$(tab_content).show()
stopClick: (e) ->
e.preventDefault()
e.stopPropagation()
return
@containerElm.querySelector(@el.dataset.related).style.display = 'block'
stModules.tab = (elms) ->
$('.js-tab').each( ->
if not $(@).data('plugin_tab')
$(@).data('plugin_tab', new Tab(@))
)
$.tab.Tab = Tab
stModules.tab = (elms) -> Array.from(elms).map((elm) -> new Tab(elm))
stModules.Tab = Tab

View File

@ -15,31 +15,24 @@
<script src="{% static "spirit/scripts/all.min.js" %}"></script>
<script>
$( document ).ready(function() {
$.tab();
$( 'a.js-post' ).postify( {
csrfToken: "{{ csrf_token }}",
} );
$('.js-messages').messages();
document.addEventListener('DOMContentLoaded', function() {
stModules.tab(document.querySelectorAll('.js-tab'));
stModules.postify(document.querySelectorAll('.js-post'), {
csrfToken: "{{ csrf_token }}"
});
stModules.messages(document.querySelectorAll('.js-messages'));
{% if user.is_authenticated %}
$.notification( {
stModules.notification(document.querySelectorAll('.js-tab-notification'), {
notificationUrl: "{% url "spirit:topic:notification:index-ajax" %}",
notificationListUrl: "{% url "spirit:topic:notification:index-unread" %}",
mentionTxt: "{% trans "{user} has mention you on {topic}" %}",
commentTxt: "{% trans "{user} has commented on {topic}" %}",
showAll: "{% trans "Show all" %}",
empty: "{% trans "No new notifications, yet" %}",
unread: "{% trans "unread" %}",
} );
unread: "{% trans "unread" %}"
});
{% endif %}
});
});
</script>
{% block head-extra %}{% endblock %}