create the new BE submodule ot_customizer

ot_templating/Classes/Controller/OtCustomizerController.php

@@ -0,0 +1,75 @@
+<?php
+
+namespace Opentalent\OtTemplating\Controller;
+
+use Opentalent\OtTemplating\Utilities\OtPageRepository;
+use TYPO3\CMS\Core\Page\PageRenderer;
+use TYPO3\CMS\Core\Utility\ExtensionManagementUtility;
+use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+
+/**
+ * Controller for the OtCustomizer backend submodule
+ *
+ * @author olivier.massot
+ */
+class OtCustomizerController extends ActionController {
+
+    CONST themes = [
+        'classic' => [
+            'name' => 'Classique',
+            'description' => 'Le thème classique',
+            'picture' => 'EXT:ot_templating/Resources/Public/media/theme_classic.png'
+        ],
+        'modern' => [
+            'name' => 'Moderne',
+            'description' => 'Le thème 2020 pour votre site',
+            'picture' => 'EXT:ot_templating/Resources/Public/media/theme_modern.png'
+        ]
+    ];
+
+
+    /**
+     *
+     * @var int
+     */
+    protected $pageRootId;
+
+    public function __construct() {
+        $this->pageRootId = (int) GeneralUtility::_GP('id');
+    }
+
+    /**
+     * Index action
+     */
+    public function indexAction() {
+
+        // Get the current page
+        $pageRepository = GeneralUtility::makeInstance('TYPO3\\CMS\\Frontend\\Page\\PageRepository');
+        $pageId = (int) GeneralUtility::_GP('id');
+        $page = $pageRepository->getPage($pageId);
+
+        // Get the root page of the site
+        $pageRepository = new OtPageRepository();
+        $rootPage = $pageRepository->getRootPageFor($pageId);
+
+        // If the current page is not a root page or a subpage of one, abort
+        $pageSelected = ($rootPage['uid'] > 0);
+        $this->view->assign('pageSelected', (int)$pageSelected);
+        if (!$pageSelected) {
+            return;
+        }
+
+        $this->view->assign('rootPage', $rootPage);
+        $this->view->assign('themes', self::themes);
+    }
+
+    /**
+     * Gets the backend user
+     *
+     * @return \TYPO3\CMS\Core\Authentication\BackendUserAuthentication
+     */
+    protected function getBackendUser() {
+        return $GLOBALS['BE_USER'];
+    }
+}

ot_templating/Classes/Utilities/OtPageRepository.php

@@ -2,6 +2,9 @@
 
 namespace Opentalent\OtTemplating\Utilities;
 
+use FluidTYPO3\Vhs\Service\PageService;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Extbase\Object\ObjectManager;
 use TYPO3\CMS\Frontend\Page\PageRepository;
 
 /**
@@ -13,17 +16,41 @@ use TYPO3\CMS\Frontend\Page\PageRepository;
  */
 class OtPageRepository extends PageRepository
 {
+
+    /**
+     * Returns the root page of the given page,
+     * or the page itself if the given page is
+     * already the rootpage of the site
+     *
+     * @param $pageUid
+     *
+     * @return array
+     */
+    public function getRootPageFor($pageUid) {
+
+        $pageService = GeneralUtility::makeInstance(ObjectManager::class)->get(PageService::class);
+        $rootLine = $pageService->getRootLine($pageUid);
+
+        for (end($rootLine); key($rootLine)!==null; prev($rootLine)){
+            $page = current($rootLine);
+            if ($page['is_siteroot'] == 1) {
+                return $page;
+            }
+        }
+        return [];
+    }
+
     /**
      * Recursively returns all the subpages of the given page
      *
-     * @param $pageId
+     * @param $pageUid
      * @return array
      */
-    public function getAllSubpagesForPage($pageId) {
+    public function getAllSubpagesForPage($pageUid) {
         $subpages = [];
 
         $stack = $this->getSubpagesForPages(
-            [$pageId],
+            [$pageUid],
             '*',
             'sorting',
             '',

ot_templating/Classes/ViewHelpers/RootPage/GetIdViewHelper.php

@@ -4,6 +4,7 @@ namespace Opentalent\OtTemplating\ViewHelpers\RootPage;
 
 use Closure;
 use FluidTYPO3\Vhs\Service\PageService;
+use Opentalent\OtTemplating\Utilities\OtPageRepository;
 use TYPO3\CMS\Core\Utility\GeneralUtility;
 use TYPO3\CMS\Extbase\Object\ObjectManager;
 use TYPO3Fluid\Fluid\Core\Rendering\RenderingContextInterface;
@@ -36,15 +37,8 @@ class GetIdViewHelper extends AbstractViewHelper
         RenderingContextInterface $renderingContext
     ) {
         $pageUid = $GLOBALS['TSFE']->id;
-        $pageService = GeneralUtility::makeInstance(ObjectManager::class)->get(PageService::class);
-        $rootLine = $pageService->getRootLine($pageUid);
 
-        for (end($rootLine); key($rootLine)!==null; prev($rootLine)){
-            $page = current($rootLine);
-            if ($page['is_siteroot'] == 1) {
-                return $page['uid'];
-            }
-        }
-        return $rootLine[0]['uid'];
+        $pageRepository = new OtPageRepository();
+        return $pageRepository->getRootPageFor($pageUid)['uid'];
     }
 }

ot_templating/Resources/Private/Language/locallang.xlf

@@ -3,6 +3,9 @@
 	<file source-language="fr" datatype="plaintext" original="messages" date="2020-04-03T15:44:11Z" product-name="ot_templating">
 		<header/>
 		<body>
+			<trans-unit id="noPageSelected">
+				<source>Veuillez sélectionner une des pages du site à personnaliser pour accéder à cette rubrique.</source>
+			</trans-unit>
 			<trans-unit id="log-out">
 				<source>Se déconnecter</source>
 			</trans-unit>

ot_templating/Resources/Private/Language/locallang_mod.xlf

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
+<xliff version="1.0">
+    <file source-language="fr" datatype="plaintext" original="messages" date="2020-09-01T12:00:00Z" product-name="ot_templating">
+        <header/>
+        <body>
+            <trans-unit id="mlang_tabs_tab" xml:space="preserve">
+				<source>Personnaliser</source>
+			</trans-unit>
+            <trans-unit id="mlang_labels_tablabel" xml:space="preserve">
+				<source>Personnaliser</source>
+			</trans-unit>
+            <trans-unit id="mlang_labels_tabdescr" xml:space="preserve">
+				<source>Personnaliser votre site, par Opentalent</source>
+			</trans-unit>
+        </body>
+    </file>
+</xliff>

ot_templating/Resources/Private/Layouts/Backend/Default.html

@@ -0,0 +1,9 @@
+{namespace v=FluidTYPO3\Vhs\ViewHelpers}
+
+<f:be.container includeCssFiles="{ot_customizer: '{f:uri.resource(path:\'assets/Backend/style/ot_customizer.css\')}'}">
+    <div class="ot-templating">
+        <f:render section="content" />
+    </div>
+</f:be.container>
+
+

ot_templating/Resources/Private/Templates/OtCustomizer/Index.html

@@ -0,0 +1,68 @@
+<f:layout name="Backend/Default" />
+
+<f:section name="content">
+    <div class="ot-customizer">
+        <f:if condition="{pageSelected}">
+            <f:then>
+
+                <div class="themes">
+                    <f:for each="{themes}" as="theme" key="theme_name">
+
+                        <div class="theme-card">
+                            <div class="theme-title">
+                                {theme.name}
+                            </div>
+                            <div class="theme-poster">
+                                <f:image src="{theme.picture}" alt="poster" />
+                            </div>
+                            <div class="theme-description">
+                                {theme.description}
+                            </div>
+                            <div class="theme-controls">
+                                <button>Sélectionner</button>
+                            </div>
+                        </div>
+                    </f:for>
+                </div>
+
+                <div class="customizer">
+                    <form>
+
+                        <div class="form-group">
+                            <label>Couleur du thème</label>
+                            <select class="form-control form-control-adapt" size="1">
+                                <option value="light-blue" selected="selected">Bleu ciel</option>
+                                <option value="blue">Bleu</option>
+                                <option value="green">Vert</option>
+                                <option value="orange">Orange</option>
+                                <option value="grey">Gris</option>
+                                <option value="red">Rouge</option>
+                                <option value="light-red">Rouge cerise</option>
+                                <option value="purple">Violet</option>
+                            </select>
+                        </div>
+
+                        <div class="form-group">
+                            <label>Afficher le caroussel</label>
+                            <input type="checkbox"
+                                   class="checkbox-input"
+                                   value="1">
+                        </div>
+
+                        <div class="actions">
+                            <button class="btn btn-primary"
+                                    type="submit"
+                                    value="1">
+                                Appliquer
+                            </button>
+                        </div>
+                    </form>
+                </div>
+            </f:then>
+            <f:else>
+                <f:comment><!-- No page selected --></f:comment>
+                <f:translate key="noPageSelected" />
+            </f:else>
+        </f:if>
+    </div>
+</f:section>

ot_templating/Resources/Public/assets/Backend/style/ot_customizer.css

@@ -0,0 +1,86 @@
+
+.ot-customizer {
+    display: flex;
+    flex-direction: row;
+}
+
+.ot-customizer .themes {
+    display: flex;
+    flex-direction: column;
+    overflow-y: scroll;
+    align-items: center;
+    border-right: #cccccc solid 2px;
+}
+
+.ot-customizer .theme-card {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    width: 380px;
+    margin: 12px 24px;
+    padding: 12px;
+
+    border: solid 1px #8c8c8c;
+    background-color: #e6e6e6;
+}
+
+.ot-customizer .theme-card > div {
+    margin: 12px;
+}
+
+.ot-customizer .theme-title {
+    font-size: 16px;
+    color: #2b2b2b;
+    font-weight: 600;
+}
+
+.ot-customizer .theme-poster {
+    max-width: 80%;
+}
+
+.ot-customizer .theme-poster img {
+    max-height: 300px;
+    max-width: 100%;
+    width: auto;
+}
+
+.ot-customizer .theme-description {
+    color: #3F3F3F;
+    font-style: italic;
+}
+
+.ot-customizer .customizer {
+    flex: 1;
+}
+
+.ot-customizer .customizer form {
+    display: flex;
+    flex-direction: column;
+    width: 80%;
+    margin: 24px auto;
+}
+
+.ot-customizer .customizer .form-group {
+    display: flex;
+    flex-direction: row;
+    margin: 12px 0;
+}
+
+.ot-customizer .customizer form label {
+    display: flex;
+    align-items: center;
+    margin: 0 12px 0 0;
+    min-width: 120px;
+}
+
+.ot-customizer .customizer form input[type="checkbox"] {
+    margin: 0;
+}
+
+.ot-customizer .customizer form .actions {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-end;
+}

ot_templating/ext_tables.php

@@ -7,10 +7,31 @@ call_user_func(
     function()
     {
 
+        // Include the configuration files
         \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
             'ot_templating',
             'Configuration/TypoScript',
             'Templating');
 
+        if (TYPO3_MODE === 'BE') {
+
+            /**
+             * Registers the customizer backend module
+             */
+            \TYPO3\CMS\Extbase\Utility\ExtensionUtility::registerModule(
+                'Opentalent.OtTemplating',
+                'web', // Make module a submodule of 'web'
+                'ot_customizer', // Submodule key
+                'top', // Position
+                array(
+                    'OtCustomizer' => 'index',
+                ),
+                array(
+                    'access' => 'user,group',
+                    'icon' => 'EXT:ot_templating/Resources/Public/Icons/Extension_white.png',
+                    'labels' => 'LLL:EXT:ot_templating/Resources/Private/Language/locallang_mod.xlf',
+                )
+            );
+        }
     }
 );