]> git.mxchange.org Git - friendica.git/commitdiff
[frio] Make connector settings panels keyboard activated
authorHypolite Petovan <hypolite@mrpetovan.com>
Sun, 21 Nov 2021 23:49:07 +0000 (18:49 -0500)
committerHypolite Petovan <hypolite@mrpetovan.com>
Mon, 29 Nov 2021 11:03:59 +0000 (06:03 -0500)
- Keep the connector panel open after form was submitted

doc/Addons.md
mod/settings.php
view/templates/settings/addon/connector.tpl [new file with mode: 0644]
view/templates/settings/connectors.tpl
view/theme/frio/css/style.css
view/theme/frio/templates/settings/addon/connector.tpl [new file with mode: 0644]
view/theme/frio/templates/settings/connectors.tpl

index cf4fbdab1251fd5966bbb7a61f2f71654c2a240b..578cffe7ca3df0df77f01508274556376d606c73 100644 (file)
@@ -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.
index 54484d8a90f762e4d4a48ea275c2d6c97cefd421..632517f16554e7e86d29850c0af7db6928bacd68 100644 (file)
@@ -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, ''],
diff --git a/view/templates/settings/addon/connector.tpl b/view/templates/settings/addon/connector.tpl
new file mode 100644 (file)
index 0000000..c06c781
--- /dev/null
@@ -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>
index a559aaa82cfacfb76bdb4fe97e4b2bb3663e11f1..0479e99d90a77c62ca731f231273e0e25abb6612 100644 (file)
                        <input type="submit" id="general-submit" name="general-submit" class="settings-submit" value="{{$submit}}"/>
                </div>
        </div>
-       <div class="clear"></div>
-
-       {{$settings_connectors nofilter}}
-
-       {{if $mail_disabled}}
+</form>
+<div class="clear"></div>
 
-       {{else}}
-               <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>
+{{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_mail}}</h3>
        </span>
-                       <p>{{$imap_desc nofilter}}</p>
-                       {{include file="field_custom.tpl" field=$imap_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}}
-                       {{include file="field_input.tpl" field=$mail_user}}
-                       {{include file="field_password.tpl" field=$mail_pass}}
-                       {{include file="field_input.tpl" field=$mail_replyto}}
-                       {{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 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_mail}}</h3>
+               </span>
+               <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}}
+               {{include file="field_input.tpl" field=$mail_user}}
+               {{include file="field_password.tpl" field=$mail_pass}}
+               {{include file="field_input.tpl" field=$mail_replyto}}
+               {{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="mail-submit" name="mail-submit" class="settings-submit" value="{{$submit}}"/>
                </div>
-       {{/if}}
+       </div>
+</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}}
index 3891f6d24ef054a47c93330c267311c8ebb0548c..f96239c3074fcdb974545b9cda7c86ed8301f922 100644 (file)
@@ -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 */
 }
diff --git a/view/theme/frio/templates/settings/addon/connector.tpl b/view/theme/frio/templates/settings/addon/connector.tpl
new file mode 100644 (file)
index 0000000..aee0e28
--- /dev/null
@@ -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>
index 1138a9d5536542591da51d0e9286493d0dff9c37..069b9d3d1c7a8e58a02c2b248a8986b9b88cd2b6 100644 (file)
@@ -1,72 +1,83 @@
 <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">
-               <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">
-                                                       {{$general_settings}}
-                                               </button>
-                                       </h2>
-                               </div>
-                               <div id="content-settings-content" class="panel-collapse collapse" role="tabpanel" aria-labelledby="content-settings">
-                                       <div class="panel-body">
-                                               {{include file="field_checkbox.tpl" field=$accept_only_sharer}}
+       <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="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-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-title">
+                               <div class="panel-body">
+                                       {{include file="field_checkbox.tpl" field=$accept_only_sharer}}
 
-                                               {{include file="field_checkbox.tpl" field=$enable_cw}}
+                                       {{include file="field_checkbox.tpl" field=$enable_cw}}
 
-                                               {{include file="field_checkbox.tpl" field=$enable_smart_shortening}}
+                                       {{include file="field_checkbox.tpl" field=$enable_smart_shortening}}
 
-                                               {{include file="field_checkbox.tpl" field=$simple_shortening}}
+                                       {{include file="field_checkbox.tpl" field=$simple_shortening}}
 
-                                               {{include file="field_checkbox.tpl" field=$attach_link_title}}
+                                       {{include file="field_checkbox.tpl" field=$attach_link_title}}
 
-                                               {{include file="field_input.tpl" field=$legacy_contact}}
+                                       {{include file="field_input.tpl" field=$legacy_contact}}
 
-                                               <p><a href="{{$repair_ostatus_url}}">{{$repair_ostatus_text}}</a></p>
-                                       </div>
-                                       <div class="panel-footer">
-                                               <button type="submit" id="general-submit" name="general-submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
-                                       </div>
+                                       <p><a href="{{$repair_ostatus_url}}">{{$repair_ostatus_text}}</a></p>
+                               </div>
+                               <div class="panel-footer">
+                                       <button type="submit" id="general-submit" name="general-submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
                                </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}}
-                       {{include file="field_input.tpl" field=$mail_server}}
-                       {{include file="field_input.tpl" field=$mail_port}}
-                       {{include file="field_select.tpl" field=$mail_ssl}}
-                       {{include file="field_input.tpl" field=$mail_user}}
-                       {{include file="field_password.tpl" field=$mail_pass}}
-                       {{include file="field_input.tpl" field=$mail_replyto}}
-                       {{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}}" />
+
+               <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}}
+                                       {{include file="field_input.tpl" field=$mail_user}}
+                                       {{include file="field_password.tpl" field=$mail_pass}}
+                                       {{include file="field_input.tpl" field=$mail_replyto}}
+                                       {{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>
+                               <div class="panel-footer">
+                                       <button type="submit" id="mail-submit" name="mail-submit" class="btn btn-primary" value="{{$submit}}">{{$submit}}</button>
+                               </div>
                        </div>
-               </div>
+               </form>
 {{/if}}
 
-       </form>
+{{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>