Added article keyboard navigator.
This commit is contained in:
parent
2e6f908c91
commit
5dd9f4916d
|
@ -219,20 +219,15 @@ class App.TicketZoom extends App.Controller
|
||||||
# scroll to end of page
|
# scroll to end of page
|
||||||
@scrollToBottom()
|
@scrollToBottom()
|
||||||
|
|
||||||
# observe content header position
|
|
||||||
@positionPageHeaderStart()
|
@positionPageHeaderStart()
|
||||||
|
|
||||||
# start autosave
|
|
||||||
@autosaveStart()
|
@autosaveStart()
|
||||||
|
@shortcutNavigationStart()
|
||||||
|
|
||||||
hide: =>
|
hide: =>
|
||||||
@activeState = false
|
@activeState = false
|
||||||
|
|
||||||
# stop observing content header position
|
|
||||||
@positionPageHeaderStop()
|
@positionPageHeaderStop()
|
||||||
|
|
||||||
# stop autosave
|
|
||||||
@autosaveStop()
|
@autosaveStop()
|
||||||
|
@shortcutNavigationstop()
|
||||||
|
|
||||||
changed: =>
|
changed: =>
|
||||||
return false if !@ticket
|
return false if !@ticket
|
||||||
|
@ -250,6 +245,50 @@ class App.TicketZoom extends App.Controller
|
||||||
muteTask: =>
|
muteTask: =>
|
||||||
App.TaskManager.mute(@task_key)
|
App.TaskManager.mute(@task_key)
|
||||||
|
|
||||||
|
shortcutNavigationStart: =>
|
||||||
|
@articlePager =
|
||||||
|
article_id: undefined
|
||||||
|
|
||||||
|
modifier = 'alt+ctrl+left'
|
||||||
|
$(document).bind("keydown.ticket_zoom#{@ticket_id}", modifier, (e) =>
|
||||||
|
@articleNavigate('up')
|
||||||
|
)
|
||||||
|
modifier = 'alt+ctrl+right'
|
||||||
|
$(document).bind("keydown.ticket_zoom#{@ticket_id}", modifier, (e) =>
|
||||||
|
@articleNavigate('down')
|
||||||
|
)
|
||||||
|
|
||||||
|
shortcutNavigationstop: =>
|
||||||
|
$(document).unbind("keydown.ticket_zoom#{@ticket_id}")
|
||||||
|
|
||||||
|
articleNavigate: (direction) =>
|
||||||
|
articleStates = []
|
||||||
|
@$('.ticket-article .ticket-article-item').each( (_index, element) ->
|
||||||
|
$element = $(element)
|
||||||
|
article_id = $element.data('id')
|
||||||
|
visible = $element.visible(true)
|
||||||
|
articleStates.push {
|
||||||
|
article_id: article_id
|
||||||
|
visible: visible
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
# navigate to article
|
||||||
|
if direction is 'up'
|
||||||
|
articleStates = articleStates.reverse()
|
||||||
|
jumpTo = undefined
|
||||||
|
for articleState in articleStates
|
||||||
|
if jumpTo
|
||||||
|
@scrollToArticle(articleState.article_id)
|
||||||
|
@articlePager.article_id = articleState.article_id
|
||||||
|
return
|
||||||
|
if @articlePager.article_id
|
||||||
|
if @articlePager.article_id is articleState.article_id
|
||||||
|
jumpTo = articleState.article_id
|
||||||
|
else
|
||||||
|
if articleState.visible
|
||||||
|
jumpTo = articleState.article_id
|
||||||
|
|
||||||
positionPageHeaderStart: =>
|
positionPageHeaderStart: =>
|
||||||
|
|
||||||
# init header update needed for safari, scroll event is fired
|
# init header update needed for safari, scroll event is fired
|
||||||
|
@ -393,12 +432,10 @@ class App.TicketZoom extends App.Controller
|
||||||
@sidebar.linkWidget.reload(@links)
|
@sidebar.linkWidget.reload(@links)
|
||||||
|
|
||||||
# scroll to article if given
|
# scroll to article if given
|
||||||
if @article_id && document.getElementById("article-#{@article_id}")
|
if @article_id
|
||||||
offset = document.getElementById("article-#{@article_id}").offsetTop
|
scrollTo = =>
|
||||||
offset = offset - 45
|
@scrollToArticle(@article_id)
|
||||||
scrollTo = ->
|
@delay(scrollTo, 200)
|
||||||
@scrollTo(0, offset)
|
|
||||||
@delay(scrollTo, 100, false)
|
|
||||||
|
|
||||||
if @shown
|
if @shown
|
||||||
|
|
||||||
|
@ -416,6 +453,13 @@ class App.TicketZoom extends App.Controller
|
||||||
@positionPageHeaderStart()
|
@positionPageHeaderStart()
|
||||||
App.Event.trigger('ui::ticket::shown', { ticket_id: @ticket_id })
|
App.Event.trigger('ui::ticket::shown', { ticket_id: @ticket_id })
|
||||||
|
|
||||||
|
scrollToArticle: (article_id) =>
|
||||||
|
articleContainer = document.getElementById("article-#{article_id}")
|
||||||
|
return if !articleContainer
|
||||||
|
distanceToTop = articleContainer.offsetTop - 100
|
||||||
|
#@main.scrollTop(distanceToTop)
|
||||||
|
@main.animate(scrollTop: distanceToTop, 100)
|
||||||
|
|
||||||
scrollToBottom: =>
|
scrollToBottom: =>
|
||||||
|
|
||||||
# because of .ticketZoom { min-: 101% } (force to show scrollbar to set layout correctly),
|
# because of .ticketZoom { min-: 101% } (force to show scrollbar to set layout correctly),
|
||||||
|
|
|
@ -375,6 +375,11 @@ App.Config.set(
|
||||||
$('.active.content .edit [name="state_id"]').val(4)
|
$('.active.content .edit [name="state_id"]').val(4)
|
||||||
$('.active.content .js-attributeBar .js-submit').first().click()
|
$('.active.content .js-attributeBar .js-submit').first().click()
|
||||||
}
|
}
|
||||||
|
{
|
||||||
|
key: ['◀', '▶']
|
||||||
|
hotkeys: true
|
||||||
|
description: 'Navigate through article'
|
||||||
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue