Contact Widget

.gitignore

@@ -1,7 +1,7 @@
+.DS_Store
 /.idea
 /composer.lock
 /.vscode
-/.DS_Store
 /.ddev
 /logs
 /var

Build/Gruntfile.js

@@ -31,6 +31,11 @@ module.exports = function (grunt) {
         scssFilePaths: [],
         cssFilePaths: []
       },
+      'contactWidget': {
+        stylesheets: ['contactWidget'],
+        scssFilePaths: [],
+        cssFilePaths: []
+      },
     },
     scssFilePaths: [],
   };

Classes/Widgets/ContactWidget.php

@@ -0,0 +1,77 @@
+<?php
+
+declare(strict_types=1);
+
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+namespace FriendsOfTYPO3\Widgets\Widgets;
+
+use TYPO3\CMS\Dashboard\Widgets\AdditionalCssInterface;
+use TYPO3\CMS\Dashboard\Widgets\WidgetConfigurationInterface;
+use TYPO3\CMS\Dashboard\Widgets\WidgetInterface;
+use TYPO3\CMS\Fluid\View\StandaloneView;
+
+class ContactWidget implements WidgetInterface,  AdditionalCssInterface
+{
+    /**
+     * @var WidgetConfigurationInterface
+     */
+    private $configuration;
+
+    /**
+     * @var StandaloneView
+     */
+    private $view;
+
+    /**
+     * @var array
+     */
+    private $options;
+
+    /**
+     * @var null
+     */
+    private $buttonProvider;
+
+    public function __construct(
+        WidgetConfigurationInterface $configuration,
+        StandaloneView $view,
+        $buttonProvider = null,
+        array $options = []
+    ) {
+        $this->configuration = $configuration;
+        $this->view = $view;
+        $this->buttonProvider = $buttonProvider;
+        $this->options = $options;
+    }
+
+    public function getCssFiles(): array
+    {
+        return [
+            'EXT:widgets/Resources/Public/Css/contactWidget.css',
+        ];
+    }
+
+    public function renderWidgetContent(): string
+    {
+
+        $this->view->setTemplate('Widget/ContactWidget');
+        $this->view->assignMultiple([
+            'options' => $this->options,
+            'button' => $this->buttonProvider,
+            'configuration' => $this->configuration,
+        ]);
+        return $this->view->render();
+    }
+}

Configuration/Services.yaml

@@ -49,3 +49,37 @@ services:
         iconIdentifier: 'content-widget-list'
         height: 'medium'
         width: 'medium'
+
+  dashboard.buttons.contact:
+    class: 'TYPO3\CMS\Dashboard\Widgets\Provider\ButtonProvider'
+    arguments:
+      $title: 'Find a partner'
+      $link: 'https://typo3.com/services/find-a-typo3-partner/official-typo3-partner-finder'
+      $target: '_blank'
+
+  widgets.dashboard.widget.contact:
+    class: 'FriendsOfTYPO3\Widgets\Widgets\ContactWidget'
+    arguments:
+      $view: '@dashboard.views.widget'
+      $buttonProvider: '@dashboard.buttons.contact'
+      $options:
+        template: 'Widget/ContactWidget'
+        introText: 'LLL:EXT:widgets/Resources/Private/Language/locallang.xlf:widgets.dashboard.widget.contact.defaultIntro'
+        company: ''
+        address: ''
+        postalCode: ''
+        place: ''
+        country: ''
+        tel: ''
+        mail: ''
+        website: ''
+        logoPath: 'EXT:backend/Resources/Public/Images/typo3_orange.svg'
+    tags:
+      - name: dashboard.widget
+        identifier: 'widgets-contact'
+        groupNames: 'general'
+        title: 'LLL:EXT:widgets/Resources/Private/Language/locallang.xlf:widgets.dashboard.widget.contact.title'
+        description: 'LLL:EXT:widgets/Resources/Private/Language/locallang.xlf:widgets.dashboard.widget.contact.description'
+        iconIdentifier: 'content-widget-list'
+        height: 'medium'
+        width: 'small'

Documentation/Widgets/ContactWidget.rst

@@ -0,0 +1,52 @@
+.. include:: ../Includes.txt
+
+.. _contact-widget:
+
+===========================
+Contact Widget
+===========================
+
+This widget will show you the contact information of your your TYPO3 supplier.
+To show your supplier contact information some configuration is required.
+
+
+.. figure:: ../Images/ContactWidget.png
+   :class: with-shadow
+   :alt: Show the contact information
+   :width: 500px
+
+   An example of the contact widget with supplier information.
+
+
+Options
+-------
+This widget has some options. To override the default options, see :ref:`Adjust settings of registered widgets <dashboard:adjust-settings-of-registered-widgets>`.
+
+An example:
+
+.. code-block:: yaml
+
+   dashboard.buttons.contact:
+     class: 'TYPO3\CMS\Dashboard\Widgets\Provider\ButtonProvider'
+     arguments:
+       $title: 'Support'
+       $link: 'https://maxserv.com/support'
+       $target: '_blank'
+
+   widgets.dashboard.widget.contact:
+     class: 'FriendsOfTYPO3\Widgets\Widgets\ContactWidget'
+     arguments:
+       $view: '@dashboard.views.widget'
+       $buttonProvider: '@dashboard.buttons.contact'
+       $options:
+         template: 'Widget/ContactWidget'
+         introText: ''
+         company: 'MaxServ'
+         address: 'Taxandriaweg 11'
+         postalCode: '5142 PA'
+         place: 'Waalwijk'
+         country: 'The Netherlands'
+         tel: '+31 416 30 10 00'
+         mail: 'info@maxserv.com'
+         website: 'https://www.maxserv.com'
+         logoPath: 'https://typo3.com/fileadmin/partner/logo-maxserv-zonder-groot.png'

README.md

@@ -10,6 +10,7 @@ This extension currently contains the following widgets:
 * **Current online users**, Will show you which users are currently online;
 * **Status Report**, Gives you an overview of errors and warnings in your installation;
 * **Pages without Meta Description**, Returns a list of last edited pages without a Meta Description;
+* **Contact information**, Will show contact information of your supplier;
 
 ## I miss widgets!
 Do you have an idea for a widget showing information that is available by core extensions, please

Resources/Private/Language/locallang.xlf

@@ -36,6 +36,13 @@
 			<trans-unit id="lastChange" xml:space="preserve">
 				<source>Last change</source>
 			</trans-unit>
+			<trans-unit id="telephone" xml:space="preserve">
+				<source>Tel:</source>
+			</trans-unit>
+			<trans-unit id="mail" xml:space="preserve">
+				<source>Mail:</source>
+			</trans-unit>
+
 			<trans-unit id="widgets.dashboard.widget.onlineUsers.title" xml:space="preserve">
 				<source>Current online users</source>
 			</trans-unit>
@@ -60,6 +67,20 @@
 			<trans-unit id="widget_group.seo" xml:space="preserve">
 				<source>SEO</source>
 			</trans-unit>
+			<trans-unit id="widgets.dashboard.widget.contact.title" xml:space="preserve">
+				<source>Contact information</source>
+			</trans-unit>
+			<trans-unit id="widgets.dashboard.widget.contact.description" xml:space="preserve">
+				<source>Will show contact information of your supplier</source>
+			</trans-unit>
+			<trans-unit id="widgets.dashboard.widget.contact.defaultCompany" xml:space="preserve">
+				<source>TYPO3</source>
+			</trans-unit>
+			<trans-unit id="widgets.dashboard.widget.contact.defaultIntro" xml:space="preserve">
+				<source><![CDATA[ <b>No information of your supplier found!</b> <br/><br/>
+						Good partners are crucial to success. Our certified, audited partner agencies and freelancers are doing remarkable, high-quality work every day and we can help you find the best match for your project.]]>
+				</source>
+			</trans-unit>
 		</body>
 	</file>
 </xliff>

Resources/Private/Sass/contactWidget.scss

@@ -0,0 +1,9 @@
+@import "Base";
+
+.widget {
+	.widget-contact-logo {
+		width: 75%;
+		max-width: 290px;
+		margin-bottom: 20px;
+	}
+}

Resources/Private/Templates/Widget/ContactWidget.html

@@ -0,0 +1,65 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:be="http://typo3.org/ns/TYPO3/CMS/Backend/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Widget/Widget"/>
+
+<f:section name="main">
+    <f:if condition="{options.company}">
+        <f:then>
+        <f:variable name="logoName">{f:translate(key: options.company, default: options.company)}</f:variable>
+        </f:then>
+        <f:else>
+            <f:variable name="logoName">{f:translate(key: 'widgets.dashboard.widget.contact.defaultCompany')}</f:variable>
+        </f:else>
+    </f:if>
+    <f:if condition="{options.logoPath}">
+        <img src="{f:uri.image(src: options.logoPath, maxWidth: '290')}"
+             class="widget-contact-logo"
+             alt="{logoName}"/>
+    </f:if>
+
+    <f:if condition="{options.introText}">
+        <p>
+            {f:translate(key: options.introText, default: options.introText) -> f:format.raw()}
+        </p>
+    </f:if>
+    <p>
+        <f:if condition="{options.company}">
+            <strong>{options.company}</strong> <br/>
+        </f:if>
+        <f:if condition="{options.address}">
+            {options.address} <br/>
+        </f:if>
+        <f:if condition="{options.postalCode} || {options.place}">
+            {options.postalCode} {options.place} <br/>
+        </f:if>
+        <f:if condition="{options.country}">
+            {options.country} <br/>
+        </f:if>
+    </p>
+    <f:if condition="{options.tel} || {options.mail}">
+        <p>
+            <f:if condition="{options.tel}">
+                <f:translate key="telephone" extensionName="widgets"/>
+                {options.tel} <br/>
+            </f:if>
+            <f:if condition="{options.mail}">
+                <f:translate key="mail" extensionName="widgets"/>
+                <f:link.email email="{options.mail}" class="contact-widget-link">
+                    <strong>{options.mail}</strong></f:link.email>
+                <br/>
+            </f:if>
+        </p>
+    </f:if>
+    <f:if condition="{options.website}">
+        <p>
+            <a href="{options.website}" target="_blank" class="contact-widget-link"><strong>{options.website}</strong></a>
+        </p>
+    </f:if>
+</f:section>
+
+<f:section name="footer">
+    <f:if condition="{button.title}">
+        <a href="{button.link}" target="{button.target}" class="widget-cta">{f:translate(id: button.title, default: button.title)}</a>
+    </f:if>
+</f:section>
+
+</html>

Resources/Public/Css/contactWidget.css

@@ -0,0 +1 @@
+.widget .widget-contact-logo{width:75%;max-width:290px;margin-bottom:20px}