clones/friendica
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[frio] Add .add-to-modal delegated event on anchors 

- Improve hovercard button accessibility
This commit is contained in:
Hypolite Petovan 2019-06-03 08:31:43 -04:00
parent dc2f1d6bd3
commit 9ac7d20df3
2 changed files with 17 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
view/templates/hovercard.tpl
View File

@ -21,8 +21,8 @@
{{* here are the differnt actions like privat message, poke, delete and so on *}} {{* here are the differnt actions like privat message, poke, delete and so on *}}
{{* @todo we have two different photo menus one for contacts and one for items at the network stream. We currently use the contact photo menu, so the items options are missing We need to move them *}} {{* @todo we have two different photo menus one for contacts and one for items at the network stream. We currently use the contact photo menu, so the items options are missing We need to move them *}}
<div class="hover-card-actions-social"> <div class="hover-card-actions-social">
{{if $profile.actions.pm}}<a class="btn btn-labeled btn-primary btn-sm" onclick="addToModal('{{$profile.actions.pm.1}}')" aria-label="{{$profile.actions.pm.0}}" title="{{$profile.actions.pm.0}}"><i class="fa fa-envelope" aria-hidden="true"></i></a>{{/if}} {{if $profile.actions.pm}}<a class="btn btn-labeled btn-primary btn-sm add-to-modal" href="{{$profile.actions.pm.1}}" aria-label="{{$profile.actions.pm.0}}"><i class="fa fa-envelope" aria-hidden="true" title="{{$profile.actions.pm.0}}"></i><span class="sr-only">{{$profile.actions.pm.0}}</span></a>{{/if}}
{{if $profile.actions.poke}}<a class="btn btn-labeled btn-primary btn-sm" onclick="addToModal('{{$profile.actions.poke.1}}')" aria-label="{{$profile.actions.poke.0}}" title="{{$profile.actions.poke.0}}"><i class="fa fa-heartbeat" aria-hidden="true"></i></a>{{/if}} {{if $profile.actions.poke}}<a class="btn btn-labeled btn-primary btn-sm add-to-modal" href="{{$profile.actions.poke.1}}" aria-label="{{$profile.actions.poke.0}}"><i class="fa fa-heartbeat" aria-hidden="true" title="{{$profile.actions.poke.0}}"></i><span class="sr-only">{{$profile.actions.poke.0}}</span></a>{{/if}}
</div> </div>
<div class="hover-card-actions-connection"> <div class="hover-card-actions-connection">
{{if $profile.actions.network}}<a class="btn btn-labeled btn-primary btn-sm" href="{{$profile.actions.network.1}}" aria-label="{{$profile.actions.network.0}}" title="{{$profile.actions.network.0}}"><i class="fa fa-cloud" aria-hidden="true"></i></a>{{/if}} {{if $profile.actions.network}}<a class="btn btn-labeled btn-primary btn-sm" href="{{$profile.actions.network.1}}" aria-label="{{$profile.actions.network.0}}" title="{{$profile.actions.network.0}}"><i class="fa fa-cloud" aria-hidden="true"></i></a>{{/if}}

15
view/theme/frio/js/modal.js
View File

@ -93,6 +93,21 @@ $(document).ready(function(){
input.val(img); input.val(img);
}); });
// Generic delegated event to open an anchor URL in a modal.
// Used in the hovercard.
document.getElementsByTagName('body')[0].addEventListener('click', function(e) {
var target = e.target;
while (target) {
if (target.matches && target.matches('a.add-to-modal')) {
addToModal(target.href);
e.preventDefault();
return false;
}
target = target.parentNode || null;
}
});
}); });
// Overwrite Dialog.show from main js to load the filebrowser into a bs modal. // Overwrite Dialog.show from main js to load the filebrowser into a bs modal.