Use popup class style for ninja-mode help.

This commit is contained in:
Thomas Tanghus 2012-08-02 04:15:40 +02:00
parent f84e92e6e3
commit 20f8971222
3 changed files with 7 additions and 9 deletions

View File

@ -125,7 +125,7 @@ input[type="checkbox"] { width: 20px; height: 20px; vertical-align: bottom; }
.typelist[type="button"] { float: left; max-width: 10em; border: 0; background-color: #fff; color: #bbb} /* for multiselect */ .typelist[type="button"] { float: left; max-width: 10em; border: 0; background-color: #fff; color: #bbb} /* for multiselect */
.typelist[type="button"]:hover { color: #777; } /* for multiselect */ .typelist[type="button"]:hover { color: #777; } /* for multiselect */
.addresslist { clear: both; font-weight: bold; } .addresslist { clear: both; font-weight: bold; }
#ninjahelp { position: absolute; bottom: 0; left: 0; right: 0; padding: 1em; margin: 1em; border: thin solid #eee; border-radius: 5px; background-color: #DBDBDB; opacity: 0.9; } #ninjahelp { position: absolute; bottom: 0; left: 0; right: 0; padding: 1em; margin: 1em; opacity: 0.9; }
#ninjahelp .close { position: absolute; top: 5px; right: 5px; height: 20px; width: 20px; } #ninjahelp .close { position: absolute; top: 5px; right: 5px; height: 20px; width: 20px; }
#ninjahelp h2, .help-section h3 { width: 100%; font-weight: bold; text-align: center; } #ninjahelp h2, .help-section h3 { width: 100%; font-weight: bold; text-align: center; }
#ninjahelp h2 { font-size: 1.4em; } #ninjahelp h2 { font-size: 1.4em; }

View File

@ -1635,9 +1635,11 @@ $(document).ready(function(){
OCCategories.changed = OC.Contacts.Card.categoriesChanged; OCCategories.changed = OC.Contacts.Card.categoriesChanged;
OCCategories.app = 'contacts'; OCCategories.app = 'contacts';
//$('#chooseaddressbook').on('click keydown', OC.Contacts.Addressbooks.overview); var ninjahelp = $('#ninjahelp');
$('#bottomcontrols .settings').on('click keydown', function() { $('#bottomcontrols .settings').on('click keydown', function() {
try { try {
ninjahelp.hide();
OC.appSettings({appid:'contacts', loadJS:true, cache:false}); OC.appSettings({appid:'contacts', loadJS:true, cache:false});
} catch(e) { } catch(e) {
console.log('error:', e.message); console.log('error:', e.message);
@ -1648,19 +1650,17 @@ $(document).ready(function(){
}); });
$('#contacts_newcontact').on('click keydown', OC.Contacts.Card.editNew); $('#contacts_newcontact').on('click keydown', OC.Contacts.Card.editNew);
var ninjahelp = $('#ninjahelp');
ninjahelp.find('.close').on('click keydown',function() { ninjahelp.find('.close').on('click keydown',function() {
ninjahelp.hide(); ninjahelp.hide();
}); });
$(document).on('keyup', function(event) { $(document).on('keyup', function(event) {
console.log(event.which + ' ' + event.target.nodeName);
if(event.target.nodeName.toUpperCase() != 'BODY' if(event.target.nodeName.toUpperCase() != 'BODY'
|| $('#contacts li').length == 0 || $('#contacts li').length == 0
|| !OC.Contacts.Card.id) { || !OC.Contacts.Card.id) {
return; return;
} }
console.log(event.which + ' ' + event.target.nodeName);
/** /**
* To add: * To add:
* (Shift)n/p: next/prev addressbook * (Shift)n/p: next/prev addressbook

View File

@ -32,10 +32,8 @@
echo $this->inc('part.no_contacts'); echo $this->inc('part.no_contacts');
} }
?> ?>
<div class="hidden" id="ninjahelp"> <div class="hidden popup" id="ninjahelp">
<a class="close" tabindex="0" role="button"> <a class="close" tabindex="0" role="button" title="<?php echo $l->t('Close'); ?>"></a>
<img class="svg" src="core/img/actions/delete.svg" alt="<?php echo $l->t('Close'); ?>" />
</a>
<h2><?php echo $l->t('Keyboard shortcuts'); ?></h2> <h2><?php echo $l->t('Keyboard shortcuts'); ?></h2>
<div class="help-section"> <div class="help-section">
<h3><?php echo $l->t('Navigation'); ?></h3> <h3><?php echo $l->t('Navigation'); ?></h3>