Skip to content
Snippets Groups Projects
Commit 553ce358 authored by Taddeüs Kroes's avatar Taddeüs Kroes
Browse files

Removed jQuery dependency

parent f88a38bb
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
coffee/forms.coffee
+ 110
− 83
View file @ 553ce358
#window.Nette.addError = (elem, message) ->
# elem.focus() if elem.focus
#
# if message
# elem.setCustomValidity(message)
# elem.valid = 0
# elem.checkValidity()
$ ->
$('form:not(.nofocus):first input:first').focus()
create_addon = (input) ->
group = $('<div class="input-group">').insertBefore(input)
$(input).remove().appendTo(group)
$('<div class="input-group-addon">').appendTo(group)
$('input[type=range]').each ->
create_addon(@)
$(@).on 'change input', ->
$(@).next('.input-group-addon').text($(@).val())
$(@).change()
$('input[type^=date]').each ->
create_addon(@)
.html('<span class="glyphicon glyphicon-calendar"></span>')
.on 'click', -> $(@).prev('input').focus()
$('input[type=number]').on('focus', -> $(@).select())
$('input[type=radio][data-inline]').each ->
group = $('<label class="radio-inline">')
.append($(@).parent('label').html())
$(@).closest('.radio').replaceWith(group)
if /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
$('abbr').on 'click', ->
alert($(@).attr('title'))
$('tr').on 'click', ->
href = $(this).data('href')
document.location = href if href?
$('select[multiple]').addClass('form-control')
$('.tags-control').each ->
container = $(@)
tag_list = container.children('.tags')
text_input = container.find('input[type=text]')
submit_btn = text_input.next().find('.btn')
generate_inputs = ->
container.children('input[type=hidden]').remove()
container.find('.tag .text').each ->
$('<input type="hidden" name="tags[]">')
.appendTo(container)
.val($(@).text())
submit_tag = ->
tag = text_input.val().trim()
if tag == ''
return
text_input.val('')
link = $('<a href="javascript:void(0)" class="tag"
title="Click to remove tag">').appendTo(tag_list)
$('<span class="label label-default">')
.append($('<span class="text">').text(tag))
.append(' ')
.append($('<span class="glyphicon glyphicon-remove">'))
.appendTo(link)
mkelem = (elemtype, classname='', attrs={}) ->
elem = document.createElement elemtype
elem.className = classname
elem[attr] = value for own attr, value of attrs
elem
# replace an input element with an addon group
create_addon = (input) ->
group = mkelem 'div', 'input-group'
input.parentNode.replaceChild group, input
group.appendChild input
addon = mkelem 'div', 'input-group-addon'
group.appendChild addon
addon
# focus on first input field in first form
document.querySelector('form:not(.nofocus)')?.querySelector('input')?.focus()
# add an addon to range inputs displaying the currently selected value
for e in document.querySelectorAll 'input[type=range]'
create_addon e
cb = -> @.nextElementSibling.innerHTML = @.value
e.addEventListener 'change', cb
e.addEventListener 'input', cb
cb.call e
# add a calender addon to date inputs, and focus on input on addon click
for e in document.querySelectorAll 'input[type^=date]'
addon = create_addon e
addon.innerHTML = '<span class="glyphicon glyphicon-calendar"></span>'
addon.addEventListener 'click', -> @.previousElementSibling.focus()
# always select the whole number on a number type input to avoid backspacing
for e in document.querySelectorAll 'input[type=number]'
e.addEventListener 'focus', -> @.select()
# inline radio labels
for e in document.querySelectorAll '.radio > label > input[type=radio][data-inline]'
group = mkelem 'label', 'radio-inline'
group.innerHTML = e.parentNode.innerHTML
label = e.parentNode.parentNode
label.parentNode.replaceChild group, label
# make abbreviations clickable on mobile devices (since there is no hover)
if /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test navigator.userAgent
for e in document.getElementsByTagName 'abbr'
e.addEventListener 'click', -> alert @.getAttribute 'title'
# allow table rows to be links through the data-href attribute
for e in document.querySelectorAll '[data-href]'
e.addEventListener 'click', ->
document.location = @.getAttribute 'data-href'
# fix class names on select boxes with multiple="multiple"
for e in document.querySelectorAll 'select[multiple]'
e.classList.add 'form-control'
# tag list controls on score add/edit pages
if container = document.querySelector '.tags-control'
tag_list = container.querySelector '.tags'
text_input = container.querySelector 'input[type=text]'
submit_btn = text_input.nextElementSibling.querySelector '.btn'
generate_inputs = ->
for e in container.querySelectorAll 'input[type=hidden]'
e.parentNode.removeChild e
for e in container.querySelectorAll '.tag .text'
console.log e, e.textContent
container.appendChild mkelem 'input', '',
type: 'hidden', name: 'tags[]', value: e.textContent
submit_tag = ->
tag = text_input.value.trim()
return if tag == ''
text_input.value = ''
link = tag_list.appendChild mkelem 'a', 'tag',
href: 'javascript:void(0)'
title: 'Click to remove tag'
label = link.appendChild mkelem 'span', 'label label-default'
label.innerHTML =
'<span class="text"></span>
<span class="glyphicon glyphicon-remove"></span>'
label.firstElementChild.textContent = tag
generate_inputs()
text_input.focus()
text_input.addEventListener 'keydown', (e) ->
if e.keyCode == 13
e.preventDefault()
submit_tag()
submit_btn.addEventListener 'click', submit_tag
container.addEventListener 'click', (e) ->
if e.target.classList.contains 'glyphicon-remove'
label = e.target.parentNode
label.parentNode.removeChild label
generate_inputs()
text_input.focus()
text_input.on 'keydown', (e) ->
if e.which == 13
# add show/hide event to collapse targets (normally handled by Bootstrap)
for e in document.querySelectorAll '[data-toggle=collapse][data-target]'
((target) ->
if target
e.addEventListener 'click', (e) ->
e.preventDefault()
submit_tag()
submit_btn.on 'click', submit_tag
container.on 'click', '.tag', ->
$(@).remove()
generate_inputs()
target.classList.toggle 'in'
)(document.querySelector e.getAttribute 'data-target')
coffee/scores.coffee
+ 77
− 72
View file @ 553ce358
num = (s) -> if s == '' or isNaN(parseInt(s)) then 0 else parseInt(s)
$ ->
$('.match-editable').each ->
table = $(@)
match_total = table.find('.match-total')
match_avg = table.find('.match-avg')
inputs = table.find('input')
sum_row = (row) ->
row_total = 0
prev_total = 0
incomplete = false
row.find('input').each ->
if $(@).val() == ''
incomplete = true
return false
row_total += num($(@).val())
if incomplete
return
if prev_row = row.prev('tr')
prev_total = num(prev_row.children('.total').text())
row.children('.row-total').text(row_total)
row.children('.total').text(prev_total + row_total)
row.children('.total').text(prev_total + row_total)
inputs.on 'change keyup', ->
sum = 0
count = 0
inputs.each ->
if $(@).val() != ''
sum += num($(@).val())
count++
sum_row($(@).closest('tr'))
match_total.text(sum)
match_avg.text(Math.round(sum / count * 10) / 10)
cell = $(@).closest('td')
cls = cell.attr('class').replace(/\s*val-\d+\s*/, '')
cell.attr('class', cls).addClass('val-' + $(@).val())
inputs.filter('[value=""]:first').focus()
$('textarea').on 'keyup', ->
$(@).height(0).height($(@).prop('scrollHeight'))
desired_scroll = $(@).offset().top - 60
if $(document).scrollTop() < desired_scroll
$(window).scrollTop(desired_scroll)
.keyup()
$('#toggle-colored').on 'click', ->
$(@).toggleClass('active').blur()
$('#match').toggleClass('colored')
if $('#match').hasClass('colored') and window.hasOwnProperty('localStorage')
localStorage.setItem('colored-scores', true)
console.log localStorage.getItem('colored-scores')
if table = document.querySelector '.match-editable'
inputs = table.getElementsByTagName 'input'
rows = table.children[1].children
match_total = table.querySelector '.match-total'
match_avg = table.querySelector '.match-avg'
w = table.querySelector('tbody tr').getElementsByTagName('input').length
h = inputs.length / w
scores = []
sub = (row) -> rows[row].children[w + 1]
tot = (row) -> rows[row].children[w + 2]
num = (s) -> if s == '' or isNaN parseInt s then 0 else parseInt s
timer = 0
set_score = (col, row, score) ->
if score != scores[row * w + col]
scores[row * w + col] = score
clearTimeout timer
timer = setTimeout (-> render row), 50
true
else
localStorage.removeItem('colored-scores')
if window.hasOwnProperty('localStorage') and localStorage.getItem('colored-scores')
$('#match').addClass('colored')
$('#toggle-colored').addClass('active')
false
render = (dirty_row) ->
subtotal = 0
subtotal += scores[dirty_row * w + col] for col in [0...w]
sub(dirty_row).innerHTML = subtotal
total = if dirty_row then num tot(dirty_row - 1).innerHTML else 0
for row in [dirty_row...h]
total += num sub(row).innerHTML
tot(row).innerHTML = total
match_total.innerHTML = total
match_avg.innerHTML = Math.round(total / inputs.length * 10) / 10
for input, i in inputs
scores.push num input.value
((col, row) ->
cell = input.parentNode
cb = ->
value = num @.value
if set_score col, row, value
cell.className = cell.className.replace /val-\d+/, 'val-' + value
input.addEventListener 'change', cb
input.addEventListener 'keyup', cb
)(i % w, Math.floor i / w)
render 0
table.querySelector('input[value=""]')?.focus()
# notes area grows automatically with each added line
if notes = document.getElementById('notes')
cb = ->
@.style.height = 0
@.style.height = @.scrollHeight + 'px'
notes.addEventListener 'keyup', cb
cb.call notes
# color toggling + persistence in local storage
match = document.getElementById 'match'
toggle_color = document.getElementById('toggle-colored')
if 'localStorage' of window and localStorage.getItem 'colored-scores'
match.classList.add 'colored'
toggle_color.classList.add 'active'
toggle_color.addEventListener 'click', ->
@.classList.toggle 'active'
@.blur()
match.classList.toggle 'colored'
if 'localStorage' of window
if match.classList.contains 'colored'
localStorage.setItem 'colored-scores', true
else
localStorage.removeItem 'colored-scores'
templates/layout.latte
+ 0
− 3
View file @ 553ce358
......@@ -46,9 +46,6 @@
<div class="container">
{include content}
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
{*<script src="js/netteForms.js"></script>*}
<script src="js/forms.js"></script>
{ifset #scripts}
{include scripts}
......
templates/match/list.latte
+ 2
− 2
View file @ 553ce358
......@@ -19,8 +19,8 @@
<a href="match" class="btn btn-sm btn-default" title="{_'Add new match'}">
<span class="glyphicon glyphicon-plus"></span>
</a>
<a data-toggle="collapse" href="#filter" title="{_'Filter'}"
class="btn btn-sm btn-default">
<a href="#filter" class="btn btn-sm btn-default" title="{_'Filter'}"
data-toggle="collapse" data-target="#filter">
<span class="glyphicon glyphicon-filter"></span>
</a>
</div>
......
templates/match/scores.latte
+ 2
− 2
View file @ 553ce358
......@@ -60,8 +60,8 @@
<h3 class="panel-title">{_'Notes'}</h3>
</div>
<div class="panel-body">
<textarea name="notes" wrap="hard" placeholder="{_'Click here to make a note'}"
>{$match->notes}</textarea>
<textarea id="notes" name="notes" wrap="hard"
placeholder="{_'Click here to make a note'}">{$match->notes}</textarea>
</div>
</div>
......
templates/user/plot.latte
+ 7
− 6
View file @ 553ce358
......@@ -10,11 +10,12 @@
{/block}
{block scripts}
<script type="text/javascript" src="jqplot/jquery.jqplot.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.highlighter.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.dateAxisRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.canvasOverlay.min.js"></script>
<script type="text/javascript">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="jqplot/jquery.jqplot.min.js"></script>
<script src="jqplot/plugins/jqplot.highlighter.min.js"></script>
<script src="jqplot/plugins/jqplot.dateAxisRenderer.min.js"></script>
<script src="jqplot/plugins/jqplot.canvasOverlay.min.js"></script>
<script>
window.data = [
{foreach $matches as $match}
[{$match->created_at|date:'%Y-%m-%d %H:%M'}, {match_avg_score($match)}],
......@@ -24,5 +25,5 @@
title: {_'Average arrow score over time'}
};
</script>
<script type="text/javascript" src="js/plot.js"></script>
<script src="js/plot.js"></script>
{/block}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment