https://assistance.opentalent.fr/browse/V8-2424

ot_core/Classes/Http/ApiController.php

@@ -57,12 +57,10 @@ class ApiController
             "SELECT o.id, o.name, o.logo_id as logoId, o.principalType, p.otherWebsite as website, a.latitude, a.longitude,
                        TRIM(BOTH ' ' FROM CONCAT(a.streetAddress, ' ', a.streetAddressSecond, ' ', a.streetAddressThird)) AS streetAddress,
                        a.postalCode, a.addressCity, c.name AS country,
-                        (SELECT CONCAT(GROUP_CONCAT(DISTINCT CONCAT(f.code)))
-                        FROM Activity AS a
-                        LEFT JOIN activity_categories AS ac ON(ac.activity_id = a.id)
-                        LEFT JOIN Categories AS cs ON (cs.id = ac.categories_id)
-                        LEFT JOIN Familly AS f ON(f.id = cs.familly_id)
-                        WHERE a.organization_id = o.id) AS categories,
+                        (SELECT CONCAT(GROUP_CONCAT(DISTINCT CONCAT(tp.name)))
+                        FROM organization_type_of_practices AS otp
+                        LEFT JOIN TypeOfPractice AS tp ON(tp.id = otp.typeofpractice_id)
+                        WHERE otp.organization_id = o.id) AS practices,
                        n1.parent_id as n1Id, net1.name as n1Name, n2.parent_id as n2Id, n3.parent_id as n3Id, n4.parent_id as n4Id, n5.parent_id as n5Id,
                        CONCAT_WS(',', n1.parent_id, n2.parent_id, n3.parent_id, n4.parent_id, n5.parent_id) as parents
                     FROM opentalent.Organization o
@@ -102,26 +100,18 @@ class ApiController
         $cnn = $this->getCnn($request);
 
         $stmt = $cnn->prepare(
-            "SELECT o.id, o.name, o.logo_id as logoId, o.principalType, p.otherWebsite as website, a.latitude, a.longitude,
+            "SELECT o.id, o.name, o.logo_id as logoId, p.otherWebsite as website, a.latitude, a.longitude,
                        TRIM(BOTH ' ' FROM CONCAT(a.streetAddress, ' ', a.streetAddressSecond, ' ', a.streetAddressThird)) AS streetAddress,
-                       a.postalCode, a.addressCity, c.name AS country, cp.telphone, cp.email,
-                        (SELECT CONCAT(GROUP_CONCAT(DISTINCT CONCAT(f.code)))
-                            FROM Activity AS a
-                            LEFT JOIN activity_categories AS ac ON (ac.activity_id = a.id)
-                            LEFT JOIN Categories AS cs ON (cs.id = ac.categories_id)
-                            LEFT JOIN Familly AS f ON (f.id = cs.familly_id)
-                            WHERE a.organization_id = o.id) 
-                        AS categories,
+                       a.postalCode, a.addressCity, cp.telphone, cp.email, o.facebook, o.twitter, o.instagram,
                        n1.parent_id as n1Id, net1.name as n1Name
                     FROM opentalent.Organization o
                         INNER JOIN opentalent.Parameters p on o.parameters_id = p.id
                         INNER JOIN (SELECT * FROM opentalent.OrganizationAddressPostal WHERE `type`='ADDRESS_HEAD_OFFICE') oa on oa.organization_id = o.id
                         INNER JOIN opentalent.AddressPostal a on oa.addressPostal_id = a.id
-                        LEFT JOIN opentalent.Country c ON (c.id = a.addressCountry_id)
                         INNER JOIN (SELECT * FROM NetworkOrganization WHERE parent_id NOT IN (32366, 13) AND (endDate IS NULL OR endDate = '0000-00-00')) n1 on n1.organization_id = o.id
                         INNER JOIN Organization net1 ON net1.id = n1.parent_id
                         LEFT JOIN opentalent.organization_contactpoint ocp ON ocp.organization_id = o.id
-                        LEFT JOIN opentalent.ContactPoint cp ON cp.id = ocp.contactPoint_id and cp.contactType = 'PRINCIPAL'
+                        LEFT JOIN (SELECT * FROM opentalent.ContactPoint WHERE `contactType`='PRINCIPAL') cp ON cp.id = ocp.contactPoint_id
                     WHERE o.id=" . $organizationId . ";"
         );
         $stmt->execute();

ot_templating/Resources/Private/Language/locallang.xlf

@@ -207,6 +207,9 @@
 			<trans-unit id="please-wait">
 				<source>Veuillez patienter...</source>
 			</trans-unit>
+			<trans-unit id="find-us-on">
+				<source>Retrouvez nous sur</source>
+			</trans-unit>
 			<trans-unit id="spot-on-from">
 				<source>Coup de projecteur du</source>
 			</trans-unit>

ot_templating/Resources/Private/Layouts/Classic/StructuresFrame.html

@@ -93,17 +93,8 @@
                             </div>
                         </div>
                         <div class="structure-search-row filters">
-                            <select name="search-category">
+                            <select name="search-practice" disabled="1">
                                 <option value="">Type</option>
-                                <option value="1MC">{f:translate(key: '1MC')}</option>
-                                <option value="2TH">{f:translate(key: '2TH')}</option>
-                                <option value="3DA">{f:translate(key: '3DA')}</option>
-                                <option value="5FA">{f:translate(key: '5FA')}</option>
-                                <option value="OTAR">{f:translate(key: 'OTAR')}</option>
-                                <option value="OTCI">{f:translate(key: 'OTCI')}</option>
-                                <option value="6AR">{f:translate(key: '6AR')}</option>
-                                <option value="8CI">{f:translate(key: '8CI')}</option>
-                                <option value="OTAU">{f:translate(key: 'OTAU')}</option>
                             </select>
                             <select name="search-province">
                                 <option value="">Département</option>
@@ -160,11 +151,12 @@
                             </div>
 
                             <div class="structure-details">
-                                 <div class="structure-categories">
-                                    <span class="structure-category-model" style="display: none"></span>
+                                 <div class="structure-practices">
+                                    <span class="structure-practice-model" style="display: none"></span>
                                  </div>
 
                                 <div class="structure-name">
+                                    <a target="_blank" href=""></a>
                                 </div>
                                 <table class="structure-details-table">
                                     <tr class="structure-details-entry structure-address">
@@ -238,17 +230,20 @@
             </span>
             <div class="content" style="display: none">
                 <div class="structure-header">
-                    <f:image src="EXT:ot_templating/Resources/Public/media/event-default.jpg" alt="logo" class="logo"/>
-                    <h3 class="name"></h3>
+                    <f:image class="default-logo" src="EXT:ot_templating/Resources/Public/media/event-default.jpg" alt="logo"/>
+                    <img class="logo" src="" alt="logo" style="display:none"/>
+
+                    <h3 class="structure-name"></h3>
+
                     <span class="social">
-                        <a href="" class="facebook" style="display: none">
-                            <i class="fab fa-facebook" style="color: #129af6"></i>
+                        <a href="" class="facebook" style="display: none" title="{f:translate(key: 'find-us-on')} Facebook">
+                            <i class="fab fa-facebook"></i>
                         </a>
                         <a href="" class="instagram" style="display: none">
-                            <i class="fab fa-instagram-square" style="color: #f2f2f2"></i>
+                            <i class="fab fa-instagram-square" title="{f:translate(key: 'find-us-on')} Instagram"></i>
                         </a>
                         <a href="" class="twitter" style="display: none">
-                            <i class="fab fa-twitter" style="color: #1da1f2"></i>
+                            <i class="fab fa-twitter" title="{f:translate(key: 'find-us-on')} Twitter"></i>
                         </a>
                     </span>
                 </div>
@@ -274,15 +269,15 @@
                             </tr>
                             <tr>
                                 <td><i class="fas fa-phone-alt"></i></td>
-                                <td class="phone"></td>
+                                <td class="phone"><a href=""></a></td>
                             </tr>
                             <tr>
                                 <td><i class="fas fa-envelope"></i></td>
-                                <td class="mail"></td>
+                                <td class="mail"><a href=""></a></td>
                             </tr>
                             <tr>
                                 <td><i class="fas fa-globe-europe"></i></td>
-                                <td class="website"></td>
+                                <td class="website"><a href=""></a></td>
                             </tr>
                             <f:comment>
                                 <!-- <tr> -->
@@ -299,7 +294,7 @@
                 </div>
 
                 <div class="spot-on-bar">
-                    <a href="" class="btn" disabled><f:translate key="spot-on-from"/> 01/01/2021</a>
+                    <button disabled><f:translate key="spot-on-from"/> 01/01/2021</button>
                 </div>
 
                 <div id="structure-details-map" style="display: none"></div>

ot_templating/Resources/Public/assets/Classic/script/structures.js

@@ -24,6 +24,46 @@ function sphericDistance(lat1, lon1, lat2, lon2)
     return R * c;
 }
 
+const practicesFr = {
+    "BIG_BAND": "Big band",
+    "BRASS_BAND": "Brass band",
+    "ORCHESTRA_CLASS": "Classe d'orchestre",
+    "ACCORDION_ORCHESTRA": "Orchestre d'accordéons",
+    "HARMONY_ORCHESTRA": "Orchestre d'harmonie",
+    "PHILHARMONIC_ORCHESTRA": "Orchestre philharmonique",
+    "SYMPHONY_ORCHESTRA": "Orchestre symphonique",
+    "STRING_ORCHESTRA": "Orchestre à cordes",
+    "PLUCKED_ORCHESTRA": "Orchestre à plectres",
+    "FANFARE_BAND": "Orchestre de fanfare",
+    "BAGAD": "Bagad",
+    "BANDAS": "Bandas ou Fanfare de rue",
+    "BATTERY_FANFARE": "Batterie fanfare",
+    "BATTUCADA": "Battucada",
+    "FOLKLORIC_BAND": "Ensemble folklorique",
+    "FIFE_AND_DRUM": "Fifres et tambours",
+    "MARCHING_BAND": "Marching band ou Show parade",
+    "HUNTING_HORNS": "Trompes de chasse",
+    "CHILDRENS_CHOIR": "Choeur d'enfants",
+    "FEMAL_CHOIR": "Choeur de femmes",
+    "MENS_CHOIR": "Choeur d'hommes",
+    "MIXED_CHORUS": "Choeur mixte",
+    "VOCAL_BAND_UP_16": "Ensemble vocal (jusqu'à 16)",
+    "CLARINET_CHOIR": "Ensemble de clarinettes",
+    "COPPER_BAND": "Ensemble de cuivres",
+    "FLUTE_ENSEMBLE": "Ensemble de flûtes",
+    "SAXOPHONES_BAND": "Ensemble de saxophones",
+    "VIOLIN_BAND": "Ensemble de violons",
+    "PERCUSSION_BAND": "Ensemble de percussions",
+    "CURRENT_MUSIC_GROUP": "Groupe de Musique actuelle",
+    "CHAMBER_MUSIC_ENSEMBLE": "Ensemble de Musique de chambre",
+    "TRADITIONAL_MUSIC_ENSEMBLE": "Ensemble de Musique traditionnelle",
+    "JAZZ_BAND": "Ensemble de Jazz",
+    "EDUCATION": "Enseignement",
+    "CHEERLEADER": "Majorettes",
+    "TROOP": "Troupe",
+    "OTHER": "Autre"
+}
+
 // Specific JS used for the Structures layout
 // > Needs to be loaded after the main.js script
 $(document).ready(function() {
@@ -55,7 +95,7 @@ $(document).ready(function() {
     let cityInput = form.find("input[name='search-city']").first();
     let latInput = form.find("input[name='lat']").first();
     let longInput = form.find("input[name='long']").first();
-    let categorySelect = form.find("select[name='search-category']").first();
+    let practiceSelect = form.find("select[name='search-practice']").first();
     let provinceSelect = form.find("select[name='search-province']").first();
     let federationSelect = form.find("select[name='search-federation']").first();
     let radiusSelect = form.find("select[name='search-radius']").first();
@@ -69,24 +109,6 @@ $(document).ready(function() {
         throw 'Missing organization-id parameter';
     }
 
-    // Translations
-    let tr = {};
-    $('#labels').find('span').each(function (i, elt) {
-       tr[$(elt).attr('id')] = $(elt).text();
-    });
-
-    let structures_categories = {
-        '1MC': tr['1MC'],
-        '2TH': tr['2TH'],
-        '3DA': tr['3DA'],
-        '5FA': tr['5FA'],
-        'OTAR':tr['OTAR'],
-        'OTCI':tr['OTCI'],
-        '6AR': tr['6AR'],
-        '8CI': tr['8CI'],
-        'OTAU':tr['OTAU'],
-    }
-
     // #### Instanciate and populate leaflet maps
     let mapDiv = $('#structure-map').first();
     let mapId = $(mapDiv).attr("id");
@@ -141,7 +163,7 @@ $(document).ready(function() {
         query['what'] = whatInput.val();
         query['lat'] = latInput.val();
         query['long'] = longInput.val();
-        query['category'] = categorySelect.val();
+        query['practice'] = practiceSelect.val();
         query['province'] = provinceSelect.val();
         query['federation'] = federationSelect.val();
         query['radius'] = radiusSelect.val();
@@ -180,8 +202,8 @@ $(document).ready(function() {
             }
         }
 
-        // filter by category
-        if (query['category'] && !structure.categories.includes(query['category'])) {
+        // filter by practice
+        if (query['practice'] && !structure.practices.includes(query['practice'])) {
             return false;
         }
 
@@ -212,6 +234,20 @@ $(document).ready(function() {
         return true;
     }
 
+    function populatePracticeSelect() {
+        practiceSelect.children('option:not(:first)').remove();
+        let has_options = false;
+
+        for (const key in practicesFr) {
+            let option = '<option value="' + key + '">' + practicesFr[key] + '</option>';
+            practiceSelect.append(option);
+            has_options = true;
+        }
+        if (has_options) {
+            practiceSelect.prop("disabled", false);
+        }
+    }
+
     function populateFederationsSelect() {
         federationSelect.children('option:not(:first)').remove();
         let has_options = false;
@@ -279,23 +315,30 @@ $(document).ready(function() {
         results.forEach(function(structure) {
             if (((currentPage - 1) * itemsPerPage) <= index && index < (currentPage * itemsPerPage)) {
                 let cardDiv = $(cardDivModel).clone();
-                let categoryTagModel = cardDiv.find('.structure-category-model').first();
+                let practiceTagModel = cardDiv.find('.structure-practice-model').first();
 
                 cardDiv.data('id', structure.id);
 
-                if (structure.categories !== null) {
-                    structure.categories.forEach(function (cat) {
-                        let tag = categoryTagModel.clone();
-                        tag.text(structures_categories[cat]);
-                        tag.removeClass('structure-category-model')
-                        tag.addClass('structure-category')
+                if (structure.practices !== null) {
+                    structure.practices.forEach(function (practice) {
+                        let tag = practiceTagModel.clone();
+                        tag.text(practicesFr[practice]);
+                        tag.removeClass('structure-practice-model')
+                        tag.addClass('structure-practice')
                         tag.show();
-                        categoryTagModel.parent().append(tag);
+                        practiceTagModel.parent().append(tag);
                     });
                 }
 
-                cardDiv.find('.structure-poster').first().children('img').first().attr('src', structure.logoUri);
-                cardDiv.find('.structure-name').first().text(structure.name);
+                if (structure.logoId) {
+                    let poster = cardDiv.find('.structure-poster').first().children('img').first();
+                    poster.attr('src', 'https://api.opentalent.fr/app.php/_internal/secure/files/' + structure.logoId + '/0x60');
+                }
+
+                let cardTitle = cardDiv.find('.structure-name a').first();
+                cardTitle.text(structure.name);
+                cardTitle.attr('href', structure.website);
+
                 cardDiv.find('.structure-details-address').first().text(
                     [structure.streetAddress, structure.postalCode, structure.addressCity].join(" ")
                 );
@@ -376,6 +419,8 @@ $(document).ready(function() {
     // #### Load structures data and refresh
     var structures;
 
+    populatePracticeSelect();
+
     function loadStructures() {
         structures = []
 
@@ -395,7 +440,7 @@ $(document).ready(function() {
                 structure.n3Id = parseInt(structure.n3Id);
                 structure.n4Id = parseInt(structure.n4Id);
                 structure.n5Id = parseInt(structure.n5Id);
-                structure.categories = structure.categories !== null ? structure.categories.split(",") : [];
+                structure.practices = structure.practices !== null ? structure.practices.split(",") : [];
                 structures.push(structure);
             })
 
@@ -475,6 +520,8 @@ $(document).ready(function() {
         submitButton.appendTo(buttonsRow);
         resetButton.prependTo(buttonsRow);
         buttonsRow.show();
+
+        resizeMaps();
     })
     $('.activate-list-view').on('click', function (e) {
         e.preventDefault();
@@ -506,8 +553,6 @@ $(document).ready(function() {
     })
 
     // ### Location filter
-    let addressApiUrl = "https://api-adresse.data.gouv.fr/search/?type=municipality&autocomplete=1&limit=5&q=";
-
     let resultDropdownDiv = form.find('.city-search-dropdown').first();
     let inputName = resultDropdownDiv.siblings("input[name='search-city']").first();
     let inputLat = resultDropdownDiv.siblings("input[name='lat']").first();
@@ -523,6 +568,9 @@ $(document).ready(function() {
         inputLat.val(lat);
         inputName.css("cursor", "pointer");
         resultDropdownDiv.hide();
+        if (radiusSelect.val() === '') {
+            radiusSelect.val('10')
+        }
         form.submit();
     }
 
@@ -564,7 +612,11 @@ $(document).ready(function() {
         }
     });
 
+    // gouv.fr REST geocoding api
+    const addressApiUrl = "https://api-adresse.data.gouv.fr/search/?type=municipality&autocomplete=1&limit=5&q=";
+
     function populateCitySearchResults() {
+
         let query = inputName.val();
         let url = addressApiUrl + encodeURI(query);
 
@@ -587,6 +639,7 @@ $(document).ready(function() {
             contentType: "application/json; charset=utf-8"
         })
         .done(function(res) {
+            console.log(res);
             let features = res.features;
             if (!features.length > 0) {
                 noResultDiv.show();
@@ -635,7 +688,6 @@ $(document).ready(function() {
     });
 
     // Structure details
-
     function formatFrenchPhoneNumber(number) {
         const regexPhoneNumber = /\+33([1-9])(\d{2})(\d{2})(\d{2})(\d{2})$/;
 
@@ -647,22 +699,90 @@ $(document).ready(function() {
     }
 
     function populateDetailsView(structure) {
-        console.log(structure);
-        let logo = structureFrameDetails.find('.structure-header .logo').first();
-        logo.attr('src', structure.logoUri);
 
-        let title = structureFrameDetails.find('.structure-header .name').first();
-        title.text(structure.name)
+        const structureHeader = structureFrameDetails.find('.structure-header').first();
+
+        let logo = structureHeader.find('img.logo').first();
+        let defaultLogo = structureHeader.find('img.default-logo').first();
+        if (structure.logoId) {
+            logo.attr('src', 'https://api.opentalent.fr/app.php/_internal/secure/files/' + structure.logoId + '/0x60');
+            logo.show();
+            defaultLogo.hide();
+        } else {
+            defaultLogo.show();
+            logo.hide();
+        }
+
+        let title = structureHeader.find('.structure-name').first();
+        title.text(structure.name);
+
+        let fbLink = structureHeader.find('a.facebook').first();
+        if (structure.facebook) {
+            fbLink.attr('href', structure.facebook);
+            fbLink.show();
+        } else {
+            fbLink.attr('href', '');
+            fbLink.hide();
+        }
+
+        let twitterLink = structureHeader.find('a.twitter').first();
+        if (structure.twitter) {
+            twitterLink.attr('href', structure.twitter);
+            twitterLink.show();
+        } else {
+            twitterLink.attr('href', '');
+            twitterLink.hide();
+        }
+
+        let instagramLink = structureHeader.find('a.instagram').first();
+        if (structure.instagram) {
+            instagramLink.attr('href', structure.instagram);
+            instagramLink.show();
+        } else {
+            instagramLink.attr('href', '');
+            instagramLink.hide();
+        }
 
         let contact = structureFrameDetails.find('.contact').first();
         contact.find('.address').first().text(
             [structure.streetAddress, structure.postalCode, structure.addressCity].join(" ")
         );
-        contact.find('.phone').first().text(formatFrenchPhoneNumber(structure.telphone));
-        contact.find('.mail').first().text(structure.email);
-        contact.find('.website').first().text(structure.website);
-        contact.find('.province').first().text('...');
-        contact.find('.network').first().text(structure.n1Name);
+
+        let phoneLink = contact.find('.phone a').first();
+        if (structure.telphone) {
+            phoneLink.text(formatFrenchPhoneNumber(structure.telphone));
+            phoneLink.attr('href', 'tel:' + structure.telphone);
+        } else {
+            phoneLink.text('');
+            phoneLink.attr('href', '');
+        }
+
+        let mailLink = contact.find('.mail a').first();
+        if (structure.email) {
+            mailLink.text(structure.email);
+            mailLink.attr('href', 'mailto:' + structure.email);
+        } else {
+            mailLink.text('');
+            mailLink.attr('href', '');
+        }
+
+        let websiteLink = contact.find('.website a').first();
+        if (structure.website) {
+            websiteLink.text(structure.website);
+            websiteLink.attr('href', structure.website);
+        } else {
+            websiteLink.text('');
+            websiteLink.attr('href', '');
+        }
+
+        // contact.find('.province').first().text('...');
+
+        let networkName = contact.find('.network').first();
+        if (structure.n1Name) {
+            networkName.text(structure.n1Name);
+        } else {
+            networkName.text('');
+        }
 
         if (structure.longitude && structure.latitude) {
             // clear previous markers
@@ -699,13 +819,12 @@ $(document).ready(function() {
             contentType: "application/json; charset=utf-8",
             timeout : 5000
         })
-        .done(function(res) {
-            structure = res;
+        .done(function(structure) {
             populateDetailsView(structure)
 
             structureFrameDetails.find('.please-wait').first().hide();
             structureFrameDetails.find('.content').first().show();
-            resizeMaps()
+            resizeMaps();
         })
         .fail(function(xhr, textStatus, errorThrown) {
             pleaseWaitSpan.hide();

ot_templating/Resources/Public/assets/Classic/style/module/_structuresframe.scss

@@ -277,18 +277,18 @@ $input-border-color: #bfbfbf;
     margin: 4px;
   }
 
-  .structure-categories {
+  .structure-practices {
     display: flex;
     flex-direction: row;
     min-height: 18px;
   }
 
-  .structure-category {
+  .structure-practice {
     background-color: #d9d9d9;
     color: #262626;
     font-size: 11px;
     margin-right: 4px;
-    padding: 1px 5px;
+    padding: 1px 5px 3px 5px;
     height: 16px;
     border-radius: 6px;
   }
@@ -381,11 +381,15 @@ $input-border-color: #bfbfbf;
 
   .filters select, .filters button {
     height: 52px;
-    width: auto;
+    margin: 3px 0.5%;
+  }
+
+  .filters select {
+    width: 18.5%;
   }
 
   .filters button {
-    margin: 3px 6px;
+    width: 10%;
   }
 
   .structure-col-results {
@@ -473,7 +477,7 @@ $input-border-color: #bfbfbf;
   .please-wait {
     @include flex;
     flex-direction: row;
-    width: 100vw;
+    width: 100%;
     height: 100vh;
     justify-content: center;
     align-items: center;
@@ -503,22 +507,34 @@ $input-border-color: #bfbfbf;
   .structure-header {
     @include flex;
     flex-direction: row;
+    align-items: center;
+
+    >* {
+      margin: 12px;
+    }
 
     .logo {
-      width: 45px;
-      margin: 4px 12px;
+      height: 60px;
+      width: auto;
     }
 
     h3 {
-      font-size: 18px;
+      font-size: 22px;
       color: $btn-background-color;
       font-weight: 750;
-      flex: 1
+      flex: 1;
+    }
+
+    .social {
+      @include flex;
+      flex-direction: row;
+      align-items: center;
     }
 
     .social a {
-      width: 16px;
+      font-size: 22px;
       padding: 4px 6px;
+      color: #808080;
     }
   }
 
@@ -534,7 +550,7 @@ $input-border-color: #bfbfbf;
     }
   }
 
-  .categories-tags {
+  .practices-tags {
     @include flex;
     flex-direction: row;
   }