[frio] Make connector settings panels keyboard activated
- Keep the connector panel open after form was submitted
This commit is contained in:
Hypolite Petovan
parent
0ca420c949
commit
60bb66e18d
7 changed files with 256 additions and 99 deletions
|
|
@ -298,6 +298,62 @@ $data = [
|
|||
Called when the Addon Settings pages are submitted.
|
||||
`$b` is the $_POST array.
|
||||
|
||||
### connector_settings
|
||||
Called when generating the HTML for a connector addon settings page.
|
||||
`$data` is an array containing:
|
||||
|
||||
- **connector** (output): Required. The addon folder name.
|
||||
- **title** (output): Required. The addon settings panel title.
|
||||
- **image** (output): Required. The relative path of the logo image of the platform/protocol this addon is connecting to, max size 48x48px.
|
||||
- **enabled** (output): Optional. If set to a falsy value, the connector image will be dimmed.
|
||||
- **html** (output): Optional. Raw HTML of the addon form elements. Both the `<form>` tags and the submit buttons are taken care of elsewhere.
|
||||
- **submit** (output): Optional. If unset, a default submit button with `name="<addon name>-submit"` will be generated.
|
||||
Can take different value types:
|
||||
- **string**: The label to replace the default one.
|
||||
- **associative array**: A list of submit button, the key is the value of the `name` attribute, the value is the displayed label.
|
||||
The first submit button in this list is considered the main one and themes might emphasize its display.
|
||||
|
||||
#### Examples
|
||||
|
||||
##### With default submit button
|
||||
```php
|
||||
$data = [
|
||||
'connector' => 'diaspora',
|
||||
'title' => DI::l10n()->t('Diaspora Export'),
|
||||
'image' => 'images/diaspora-logo.png',
|
||||
'enabled' => $enabled,
|
||||
'html' => $html,
|
||||
];
|
||||
```
|
||||
|
||||
##### With custom submit button label and no logo dim
|
||||
```php
|
||||
$data = [
|
||||
'connector' => 'ifttt',
|
||||
'title' => DI::l10n()->t('IFTTT Mirror'),
|
||||
'image' => 'addon/ifttt/ifttt.png',
|
||||
'html' => $html,
|
||||
'submit' => DI::l10n()->t('Generate new key'),
|
||||
];
|
||||
```
|
||||
|
||||
##### With conditional submit buttons
|
||||
```php
|
||||
$submit = ['pumpio-submit' => DI::l10n()->t('Save Settings')];
|
||||
if ($oauth_token && $oauth_token_secret) {
|
||||
$submit['pumpio-delete'] = DI::l10n()->t('Delete this preset');
|
||||
}
|
||||
|
||||
$data = [
|
||||
'connector' => 'pumpio',
|
||||
'title' => DI::l10n()->t('Pump.io Import/Export/Mirror'),
|
||||
'image' => 'images/pumpio.png',
|
||||
'enabled' => $enabled,
|
||||
'html' => $html,
|
||||
'submit' => $submit,
|
||||
];
|
||||
```
|
||||
|
||||
### profile_post
|
||||
Called when posting a profile page.
|
||||
`$b` is the $_POST array.
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ function settings_post(App $a)
|
|||
$user = User::getById($a->getLoggedInUserId());
|
||||
|
||||
if ((DI::args()->getArgc() > 1) && (DI::args()->getArgv()[1] == 'connectors')) {
|
||||
BaseModule::checkFormSecurityTokenRedirectOnError('/settings/connectors', 'settings_connectors');
|
||||
BaseModule::checkFormSecurityTokenRedirectOnError(DI::args()->getQueryString(), 'settings_connectors');
|
||||
|
||||
if (!empty($_POST['general-submit'])) {
|
||||
DI::pConfig()->set(local_user(), 'system', 'accept_only_sharer', intval($_POST['accept_only_sharer']));
|
||||
|
|
@ -81,7 +81,7 @@ function settings_post(App $a)
|
|||
DI::pConfig()->set(local_user(), 'system', 'simple_shortening', intval($_POST['simple_shortening']));
|
||||
DI::pConfig()->set(local_user(), 'system', 'attach_link_title', intval($_POST['attach_link_title']));
|
||||
DI::pConfig()->set(local_user(), 'ostatus', 'legacy_contact', $_POST['legacy_contact']);
|
||||
} elseif (!empty($_POST['imap-submit'])) {
|
||||
} elseif (!empty($_POST['mail-submit'])) {
|
||||
$mail_server = $_POST['mail_server'] ?? '';
|
||||
$mail_port = $_POST['mail_port'] ?? '';
|
||||
$mail_ssl = strtolower(trim($_POST['mail_ssl'] ?? ''));
|
||||
|
|
@ -133,6 +133,7 @@ function settings_post(App $a)
|
|||
}
|
||||
|
||||
Hook::callAll('connector_settings_post', $_POST);
|
||||
DI::baseUrl()->redirect(DI::args()->getQueryString());
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -507,8 +508,22 @@ function settings_content(App $a)
|
|||
DI::page()['htmlhead'] = '<meta http-equiv="refresh" content="0; URL=' . DI::baseUrl().'/ostatus_subscribe?url=' . urlencode($legacy_contact) . '">';
|
||||
}
|
||||
|
||||
$settings_connectors = '';
|
||||
Hook::callAll('connector_settings', $settings_connectors);
|
||||
$connector_settings_forms = [];
|
||||
foreach (DI::dba()->selectToArray('hook', ['file', 'function'], ['hook' => 'connector_settings']) as $hook) {
|
||||
$data = [];
|
||||
Hook::callSingle(DI::app(), 'connector_settings', [$hook['file'], $hook['function']], $data);
|
||||
|
||||
$tpl = Renderer::getMarkupTemplate('settings/addon/connector.tpl');
|
||||
$connector_settings_forms[$data['connector']] = Renderer::replaceMacros($tpl, [
|
||||
'$connector' => $data['connector'],
|
||||
'$title' => $data['title'],
|
||||
'$image' => $data['image'] ?? '',
|
||||
'$enabled' => $data['enabled'] ?? true,
|
||||
'$open' => (DI::args()->getArgv()[2] ?? '') === $data['connector'],
|
||||
'$html' => $data['html'] ?? '',
|
||||
'$submit' => $data['submit'] ?? DI::l10n()->t('Save Settings'),
|
||||
]);
|
||||
}
|
||||
|
||||
if ($a->isSiteAdmin()) {
|
||||
$diasp_enabled = DI::l10n()->t('Built-in support for %s connectivity is %s', DI::l10n()->t('Diaspora (Socialhome, Hubzilla)'), ((DI::config()->get('system', 'diaspora_enabled')) ? DI::l10n()->t('enabled') : DI::l10n()->t('disabled')));
|
||||
|
|
@ -565,11 +580,11 @@ function settings_content(App $a)
|
|||
'$repair_ostatus_url' => DI::baseUrl() . '/repair_ostatus',
|
||||
'$repair_ostatus_text' => DI::l10n()->t('Repair OStatus subscriptions'),
|
||||
|
||||
'$settings_connectors' => $settings_connectors,
|
||||
'$connector_settings_forms' => $connector_settings_forms,
|
||||
|
||||
'$h_imap' => DI::l10n()->t('Email/Mailbox Setup'),
|
||||
'$imap_desc' => DI::l10n()->t("If you wish to communicate with email contacts using this service \x28optional\x29, please specify how to connect to your mailbox."),
|
||||
'$imap_lastcheck' => ['imap_lastcheck', DI::l10n()->t('Last successful email check:'), $mail_chk, ''],
|
||||
'$h_mail' => DI::l10n()->t('Email/Mailbox Setup'),
|
||||
'$mail_desc' => DI::l10n()->t("If you wish to communicate with email contacts using this service \x28optional\x29, please specify how to connect to your mailbox."),
|
||||
'$mail_lastcheck' => ['mail_lastcheck', DI::l10n()->t('Last successful email check:'), $mail_chk, ''],
|
||||
'$mail_disabled' => $mail_disabled_message,
|
||||
'$mail_server' => ['mail_server', DI::l10n()->t('IMAP server name:'), $mail_server, ''],
|
||||
'$mail_port' => ['mail_port', DI::l10n()->t('IMAP port:'), $mail_port, ''],
|
||||
|
|
|
|||
34
view/templates/settings/addon/connector.tpl
Normal file
34
view/templates/settings/addon/connector.tpl
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
<span id="settings_{{$connector}}_inflated" class="settings-block fakelink" style="display: {{if $open}}none{{else}}block{{/if}};" onclick="openClose('settings_{{$connector}}_expanded'); openClose('settings_{{$connector}}_inflated');">
|
||||
<img class="connector{{if !$enabled}}-disabled{{/if}}" src="{{$image}}" /><h3 class="connector">{{$title}}</h3>
|
||||
</span>
|
||||
<div id="settings_{{$connector}}_expanded" class="settings-block" style="display: {{if $open}}block{{else}}none{{/if}};">
|
||||
<span class="fakelink" onclick="openClose('settings_{{$connector}}_expanded'); openClose('settings_{{$connector}}_inflated');">
|
||||
<img class="connector{{if !$enabled}}-disabled{{/if}}" src="{{$image}}" /><h3 class="connector">{{$title}}</h3>
|
||||
</span>
|
||||
{{$html nofilter}}
|
||||
<div class="clear"></div>
|
||||
{{if $submit}}
|
||||
<div class="settings-submit-wrapper panel-footer">
|
||||
{{if $submit|is_string}}
|
||||
<button type="submit" name="{{$connector}}-submit" class="btn btn-primary settings-submit" value="{{$submit}}">{{$submit}}</button>
|
||||
{{else}}
|
||||
{{$count = 1}}
|
||||
{{foreach $submit as $name => $label}}{{if $label}}
|
||||
{{if $count == 1}}
|
||||
<button type="submit" name="{{$name}}" class="btn btn-primary settings-submit" value="{{$label}}">{{$label}}</button>
|
||||
{{/if}}
|
||||
{{if $count == 2}}
|
||||
<div class="btn-group" role="group" aria-label="...">
|
||||
{{/if}}
|
||||
{{if $count != 1}}
|
||||
<button type="submit" name="{{$name}}" class="btn btn-default settings-submit" value="{{$label}}">{{$label}}</button>
|
||||
{{/if}}
|
||||
{{$count = $count + 1}}
|
||||
{{/if}}{{/foreach}}
|
||||
{{if $submit|count > 1}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
@ -24,23 +24,22 @@
|
|||
<input type="submit" id="general-submit" name="general-submit" class="settings-submit" value="{{$submit}}"/>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="clear"></div>
|
||||
|
||||
{{$settings_connectors nofilter}}
|
||||
|
||||
{{if $mail_disabled}}
|
||||
|
||||
{{else}}
|
||||
{{if !$mail_disabled}}
|
||||
<form action="settings/connectors" method="post" autocomplete="off">
|
||||
<input type='hidden' name='form_security_token' value='{{$form_security_token}}'>
|
||||
<span id="settings_mail_inflated" class="settings-block fakelink" style="display: block;"
|
||||
onclick="openClose('settings_mail_expanded'); openClose('settings_mail_inflated');">
|
||||
<img class="connector" src="images/mail.png"/><h3 class="settings-heading connector">{{$h_imap}}</h3>
|
||||
<img class="connector" src="images/mail.png"/><h3 class="settings-heading connector">{{$h_mail}}</h3>
|
||||
</span>
|
||||
<div id="settings_mail_expanded" class="settings-block" style="display: none;">
|
||||
<span class="fakelink" onclick="openClose('settings_mail_expanded'); openClose('settings_mail_inflated');">
|
||||
<img class="connector" src="images/mail.png"/><h3 class="settings-heading connector">{{$h_imap}}</h3>
|
||||
<img class="connector" src="images/mail.png"/><h3 class="settings-heading connector">{{$h_mail}}</h3>
|
||||
</span>
|
||||
<p>{{$imap_desc nofilter}}</p>
|
||||
{{include file="field_custom.tpl" field=$imap_lastcheck}}
|
||||
<p>{{$mail_desc nofilter}}</p>
|
||||
{{include file="field_custom.tpl" field=$mail_lastcheck}}
|
||||
{{include file="field_input.tpl" field=$mail_server}}
|
||||
{{include file="field_input.tpl" field=$mail_port}}
|
||||
{{include file="field_select.tpl" field=$mail_ssl}}
|
||||
|
|
@ -52,8 +51,16 @@
|
|||
{{include file="field_input.tpl" field=$mail_movetofolder}}
|
||||
|
||||
<div class="settings-submit-wrapper">
|
||||
<input type="submit" id="imap-submit" name="imap-submit" class="settings-submit" value="{{$submit}}"/>
|
||||
<input type="submit" id="mail-submit" name="mail-submit" class="settings-submit" value="{{$submit}}"/>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</form>
|
||||
{{/if}}
|
||||
|
||||
{{foreach $connector_settings_forms as $addon => $connector_settings_form}}
|
||||
<form action="settings/connectors/{{$addon}}" method="post" autocomplete="off">
|
||||
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
|
||||
{{$connector_settings_form nofilter}}
|
||||
<div class="clear"></div>
|
||||
</form>
|
||||
{{/foreach}}
|
||||
|
|
|
|||
|
|
@ -2974,14 +2974,12 @@ details.profile-jot-net[open] summary:before {
|
|||
.fakelink > h3:before {
|
||||
padding-right: 10px;
|
||||
}
|
||||
.widget.fakelink > h3:before,
|
||||
.settings-block.fakelink > h3:before {
|
||||
.widget.fakelink > h3:before {
|
||||
font-family: ForkAwesome;
|
||||
content: "\f0da"; /* Right Plain Pointer */
|
||||
}
|
||||
.widget > .fakelink > h3:before,
|
||||
#sidebar-group-header > .fakelink > h3:before,
|
||||
.settings-block > .fakelink > h3:before {
|
||||
#sidebar-group-header > .fakelink > h3:before {
|
||||
font-family: ForkAwesome;
|
||||
content: "\f0d7"; /* Bottom Plain Pointer */
|
||||
}
|
||||
|
|
|
|||
36
view/theme/frio/templates/settings/addon/connector.tpl
Normal file
36
view/theme/frio/templates/settings/addon/connector.tpl
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
<div class="section-subtitle-wrapper panel-heading" role="tab" id="{{$connector}}-settings-title">
|
||||
<h2>
|
||||
<button class="btn-link accordion-toggle{{if !$open}} collapsed{{/if}}" data-toggle="collapse" data-parent="#settings-connectors" href="#{{$connector}}-settings-content" aria-expanded="false" aria-controls="{{$connector}}-settings-content">
|
||||
<img class="connector{{if !$enabled}}-disabled{{/if}}" src="{{$image}}" /> {{$title}}
|
||||
</button>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="{{$connector}}-settings-content" class="panel-collapse collapse{{if $open}} in{{/if}}" role="tabpanel" aria-labelledby="{{$connector}}-settings-title">
|
||||
<div class="panel-body">
|
||||
{{$html nofilter}}
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
{{if $submit}}
|
||||
{{if $submit|is_string}}
|
||||
<button type="submit" name="{{$connector}}-submit" class="btn btn-primary settings-submit" value="{{$submit}}">{{$submit}}</button>
|
||||
{{else}}
|
||||
{{$count = 1}}
|
||||
{{foreach $submit as $name => $label}}{{if $label}}
|
||||
{{if $count == 1}}
|
||||
<button type="submit" name="{{$name}}" class="btn btn-primary settings-submit" value="{{$label}}">{{$label}}</button>
|
||||
{{/if}}
|
||||
{{if $count == 2}}
|
||||
<div class="btn-group" role="group" aria-label="...">
|
||||
{{/if}}
|
||||
{{if $count != 1}}
|
||||
<button type="submit" name="{{$name}}" class="btn btn-default settings-submit" value="{{$label}}">{{$label}}</button>
|
||||
{{/if}}
|
||||
{{$count = $count + 1}}
|
||||
{{/if}}{{/foreach}}
|
||||
{{if $submit|count > 1}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,22 +1,22 @@
|
|||
<div class="generic-page-wrapper">
|
||||
<h1>{{$title}}</h1>
|
||||
{{include file="section_title.tpl" title=$title}}
|
||||
|
||||
<p class="connector_statusmsg">{{$diasp_enabled}}</p>
|
||||
<p class="connector_statusmsg">{{$ostat_enabled}}</p>
|
||||
|
||||
<form action="settings/connectors" method="post" autocomplete="off">
|
||||
<div class="panel-group panel-group-settings" id="settings-connectors" role="tablist" aria-multiselectable="true">
|
||||
|
||||
<form action="settings/connectors" method="post" autocomplete="off" class="panel">
|
||||
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
|
||||
|
||||
<div class="panel-group panel-group-settings" id="settings" role="tablist" aria-multiselectable="true">
|
||||
<div class="panel">
|
||||
<div class="section-subtitle-wrapper panel-heading" role="tab" id="content-settings-title">
|
||||
<h2>
|
||||
<button class="btn-link accordion-toggle collapsed" data-toggle="collapse" data-parent="#settings" href="#content-settings-content" aria-expanded="false" aria-controls="content-settings-content">
|
||||
<button class="btn-link accordion-toggle collapsed" data-toggle="collapse" data-parent="#settings-connectors" href="#content-settings-content" aria-expanded="false" aria-controls="content-settings-content">
|
||||
{{$general_settings}}
|
||||
</button>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="content-settings-content" class="panel-collapse collapse" role="tabpanel" aria-labelledby="content-settings">
|
||||
<div id="content-settings-content" class="panel-collapse collapse" role="tabpanel" aria-labelledby="content-settings-title">
|
||||
<div class="panel-body">
|
||||
{{include file="field_checkbox.tpl" field=$accept_only_sharer}}
|
||||
|
||||
|
|
@ -36,22 +36,26 @@
|
|||
<button type="submit" id="general-submit" name="general-submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{$settings_connectors nofilter}}
|
||||
</form>
|
||||
|
||||
{{if !$mail_disabled}}
|
||||
<span id="settings_mail_inflated" class="settings-block fakelink" style="display: block;" onclick="openClose('settings_mail_expanded'); openClose('settings_mail_inflated');">
|
||||
<img class="connector" src="images/mail.png" /><h3 class="settings-heading connector">{{$h_imap}}</h3>
|
||||
</span>
|
||||
<div id="settings_mail_expanded" class="settings-block" style="display: none;">
|
||||
<span class="fakelink" onclick="openClose('settings_mail_expanded'); openClose('settings_mail_inflated');">
|
||||
<img class="connector" src="images/mail.png" /><h3 class="settings-heading connector">{{$h_imap}}</h3>
|
||||
</span>
|
||||
<p>{{$imap_desc nofilter}}</p>
|
||||
|
||||
{{include file="field_custom.tpl" field=$imap_lastcheck}}
|
||||
<form action="settings/connectors" method="post" autocomplete="off" class="panel">
|
||||
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
|
||||
|
||||
<div class="section-subtitle-wrapper panel-heading" role="tab" id="mail-settings-title">
|
||||
<h2>
|
||||
<button class="btn-link accordion-toggle collapsed" data-toggle="collapse" data-parent="#settings-connectors" href="#mail-settings-content" aria-expanded="false" aria-controls="mail-settings-content">
|
||||
<img class="connector" src="images/mail.png" /> {{$h_mail}}
|
||||
</button>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="mail-settings-content" class="panel-collapse collapse" role="tabpanel" aria-labelledby="mail-settings-title">
|
||||
<div class="panel-body">
|
||||
|
||||
<p>{{$mail_desc nofilter}}</p>
|
||||
|
||||
{{include file="field_custom.tpl" field=$mail_lastcheck}}
|
||||
{{include file="field_input.tpl" field=$mail_server}}
|
||||
{{include file="field_input.tpl" field=$mail_port}}
|
||||
{{include file="field_select.tpl" field=$mail_ssl}}
|
||||
|
|
@ -61,12 +65,19 @@
|
|||
{{include file="field_checkbox.tpl" field=$mail_pubmail}}
|
||||
{{include file="field_select.tpl" field=$mail_action}}
|
||||
{{include file="field_input.tpl" field=$mail_movetofolder}}
|
||||
|
||||
<div class="settings-submit-wrapper">
|
||||
<input type="submit" id="imap-submit" name="imap-submit" class="settings-submit" value="{{$submit}}" />
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
<button type="submit" id="mail-submit" name="mail-submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{{/if}}
|
||||
|
||||
{{foreach $connector_settings_forms as $addon => $connector_settings_form}}
|
||||
<form action="settings/connectors/{{$addon}}" method="post" autocomplete="off" class="panel">
|
||||
<input type="hidden" name="form_security_token" value="{{$form_security_token}}">
|
||||
{{$connector_settings_form nofilter}}
|
||||
</form>
|
||||
{{/foreach}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue