Particule Repo Grid Tab

Introduction

Une particle En Toutes Lettres répondant à une pensée Remplacer Akeeba Release System, pour la gestion des téléchargements et une idée: Pourquoi ne pas utiliser Github pour le stockage de mes fichiers en téléchargement libre?

Un coup de pouce initial est arrivé avec la découverte de ce pen d'Akash Nimare sur CodePen , github-release-stats (2020), permettant d'explorer et de restituer, via un script, les données d'une sortie (release) pour une repository Github. J'ai donc intégré ce script dans une particule Gantry 5 que je vous propose.

J'ai nommé cette particule Repo Grid Tab.

Fonction Principale: Catégoriser et gérer une grille responsive d'items. Chaque item contient un grand nombre d'options à sélectionner dont l'export des données des "release" Github.

Caractéristiques:

Source Particule: Gestion des items ( Repository github, assets et tout autre entité que vous voulez publier) par catégorie (selectionnable par onglet).
Source Joomla: Gestion possible des Catégories/Articles Joomla via bibliothèque Shuffle.js
Une gestion d'items par grille mono et multicolonne.
Un grand nombre d'options au niveau de chaque item que je vous laisse découvrir.
Possibilité multi-langue avec une bibliothèque d'étiquette géré au niveau de la particule
Gestions liens internes/Internes via les fonctions de base Gantry
utilisation du plugin Simple Download Counter (Attention: Le plugin ne marche que si le module est intégré dans un article via le plugin joomla "Contenu - Chargement de module")

Le script github-release-stats n'est pas compatible avec shuffle.js (Chevauchement si la repository github à plus d'une release). J'ai donc utilisé un sytème d'onglet pour gérer mes categories.
Gros soucis avec jQuery UI pour la gestion des onglets, j'ai donc choisi pour ma particule le script Responsive Full Width Tabs de la collection Blueprints de CodePen.

Crédit

github-release-stats Copyright (c) 2020 by Akash Nimare - Fork pour exporter les données Github
Shuffle.js
Responsive Full Width Tabs
Style for Accordion pure CSS3 - Accordeon sans Javascript
moment.js
image.js

Télécharger la particule Repo Grid Tab

Support sur le Forum En Toutes Lettres

Article : Créer une nouvelle particule

Configuration

Options pricipales - Réglages globaux
Etiquettes
Source particule: Catégories
Source particule: Items
Source Joomla!
Example 1 - Utilisation simple
Example 2 - Utilisation mixte avec Joomla com_content - Espace téléchargement ETL

Options pricipales: Réglages

Source Particule - Options Navigation onglets (Tabs) - Onglets créés automatiquement si plus d'une catégorie.

Option	Description
Classes CSS	Nom de classe CSS de la particule.
Titre principal	Personnalisez le texte du titre principal.
Description	Personnaliser la description principale.
Image	Sélectionnez l'image principale souhaitée.
Emplacement de l'image	Sélectionnez l'emplacement de l'image principale (droite ou gauche).
Source du contenu	Important! Choisissez si le contenu doit être chargé à partir de la plate-forme (Joomla!) ou de la particule.

Onglet style	Définissez le style de des onglets (4 styles possibles).
	Possibilité de créer un onglet initial contenant les Informations principales de la particule
Onglet 0	Informations principales dans le premier onglet.
Onglet 0 titre	Personnalisez le titre qui apparaîtra dans le premier onglet.
Onglet 0 sous-titre	Personnalisez le sous-titre qui apparaîtra dans le premier onglet. Utilisation de "&nbsp" possible
Format de date	Sélectionnez le format de date préféré. Laissez vide pour ne pas afficher de date.

	Source Catégories/Articles Joomla! - options Navigation (Shuffle.js)
Navigation titre	Personnalisez le texte du titre pour la navigation.
Navigation sous-titre	Personnalisez le texte du titre supérieur qui apparaîtra au-dessus du texte du titre de navigation normal.
Étiquette "Tous les articles"	Entrez l'étiquette du bouton de tous les éléments (laissez vide pour masquer).
Choisir	Choisissez le premier élément de navigation.
Format de date	Sélectionnez le format de date préféré. Laissez vide pour ne pas afficher de date.
Grille Colonne Joomla	Sélectionnez le nombre de la colonne de la grille pour les éléments de la liste (articles Joomla)
Image Item Centrée?	Non par défault. Utilisé en colonnes multiples.
"En savoir plus" etiquette'	Entrez l'étiquette du bouton Lire la suite (laissez vide pour masquer).

Options pricipales: Source Particules - Etiquettes

Vous définissez ici toutes les valeurs de étiquettes (Texte libre mais prédéfinis) - important pour la traduction

Option	Description
Date Titre	Personnalisez le texte du titre de la date.
Version titre	Personnalisez le texte du titre de la version.
	Définir les étiquettes des éléments de l'information "Descriptions" - Navigation en accordéon.
Description	Définir l'étiquette «Description»
Description longue	Définir l'étiquette 'Description longue'
Information additionnelle	Définir un libellé pour des informations supplémentaires telles que 'Changelog'

	En-tête de la table Github repository. Le language HTML peut être utilisé comme les Font Awesome ou les Utility Classes
Nom de la version	Personnalisez le texte du nom de version.
Pré-version	Personnalisez l'étiquette de la pré-version (géré dans un bouton dans le tableau après la description de la version).
Télécharger (taille)	Personnalisez le texte "Télécharger (taille)"
Nombre de téléchargements	Personnalisez le texte du nombre de téléchargements.
Date de sortie	Personnalisez le texte de la date de sortie.
Format de date	Sélectionnez le format de date préféré.
Jours actifs	Personnalisez le texte " jours actifs" (info en provenance de Github). Cette colonne peut être supprimée dans le paramètre
Téléchargements totaux	Personnalisez le texte "Téléchargements totaux". Cette valeur peut être supprimée dans le paramètre
"info-bulle" Info intro	Personnalisez l'introduction de l'info-bulle des informations de la version
"info-bulle" intro Télécharger	Personnalisez l'introduction de l'info-bulle Téléchargement de la version.

Valeurs prédéfinies des étiquettes (Version française) que vous pouvez modifier.

Date Titre	Dernière mise à jour
Version titre	Version:
Description	Description
Description longue	Lire la suite
Information additionnelle	Changelog
	En-tête de la table Github repository. Le language HTML peut être utilisé comme les "Font Awesome" ou les "Utility Classes".
Nom de la version	Nom de la version <i class = "fa fa-info-circle" aria-hidden = "true"> </i>
Pré-version	Pré-version
Télécharger (taille)	<span class="hidden-phone">Télécharger </span><i class="fa fa-cloud-download" aria-hidden="true"></i> (taille)
Nombre de téléchargements	<span class="hidden-phone">Nombre de téléchargements </span><i class="fa fa-tachometer" aria-hidden="true"></i>
Date de sortie	<span class="hidden-phone">Date de sortie </span><i class="fa fa-calendar" aria-hidden="true"></i>
Format de date	YYYY-MM-DD, YYYY MM DD, DD-MM-YYYY, DD MM YYYY
Jours actifs	Jours actifs
Téléchargements totaux	Téléchargements totaux:
"info-bulle" Info intro	Information version
"info-bulle" intro Télécharger	Télécharger la version

Source Particule - Catégories

Créez vos catégories. Par catégorie, vous gérez vos items (Repository Github, assets ou autres).

Option	Description
	Définissez les descriptions des onglets et des catégories et créer vos repositories.
	Onglets
Titre de l'onglet	Entrez le titre de l'onglet
Sous-titre de l'onglet	Entrez le sous-titre de l'onglet (& nbsp; peut être utilisé si nécessaire)
Suppression de l'onglet?	Attention, a utiliser uniquement si vous en avez besoin. Peut être utilisé lorsque vous chargez un module avec un plugin de position comme Module Anywhere (Utilisation mono catégorie pour cette particule).
	Données Catégorie
Colonne de grille	Entrez le nombre de colonnes que vous souhaitez pour afficher votre grille (3 max).
Catégorie Nom	Personnalisez le nom de la catégorie.
Catégorie Image	Sélectionnez l'image de la catégorie.
Emplacement de l'image	Sélectionnez l'emplacement de l'image de la catégorie
Catégorie Description	Personnalisez la description de votre catégorie.

Source Particule - Items

Classes CSS supplémentaires possible pour "button": button-2, button-outline, button-outline-light, button-gradient, button-bevel, button-square, button-block, button-xlarge, button-large, button-small, button -xsmall.

Aller à l'onglet "Repo Github" si vos fichiers se trouve sur Github
à l'onglet "Assets Int / Ext" si votre fichier se trouve en interne sur votre serveur ou Lien de fichier externe
à l'onglet "Info +" pour d'autres liens externes

Option	Description
Supprimer Bloc Titre	A n'utiliser que si besoin. Comme une liaison à un article Joomla avec un plugin de chargement de module (item unique dans la première catégorie), il pourrait être intéressant d'afficher l'item sans image et titre qui sont gérés par Joomla com_content.
Titre	Entrez le titre de votre item (repository/asset).
Centrer Titre	Définissez si le titre de l'item doit être centré.
Description courte	Saisissez une brève description de l'item.
Image	Sélectionnez l'image souhaitée.
Centrer image	Permet de center l'image de l'item. Utile pour multicolonnes.
Version	Entrez le numéro de version
Date de la version	Entrez la date de la version
Type	Entrez votre type principal (Unique)
Environnements	Entrez chaque valeur d'environnement autour d'une balise "span". Voir l'exemple de la valeur par défaut.
Auteur	Entrez le nom de l'auteur
Petite Image/Logo	Entrez l'image de l'auteur (avatar) ou le logo.
Hauteur de l'image/Logo (px)	Hauteur maximale (max-height) de la photo de l'auteur (avatar) ou du logo (en pixel). Hauteur maximale par défaut 25px.
Image arrondie?	Définissez si l'image/logo utilise une classe CSS arrondie.
Site web nom	Personnalisez le nom du site web.
Site web adresse	Spécifiez l'adresse du site web.
Site web cible	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.
	Bloc Informations principales: Centrer ou non.
Centrer Info Principales	Définissez si le bloc des informations principales doit être centré.
Centrer Info Principales smartphone uniquement	Définissez si le bloc des informations principales doit être centré mais uniquement sur les téléphones portables.

Tab Info + : Info supplémentaire pour l'item

Voir article pour la création du "Changelog" - Les classes CSS sont incluses dans la particle'

Option	Description
Description Longue	Entrez la description longue de l'article. Pas trop long - hauteur max 1000 px pour accordéon.
	Bouton "Lire la suite" si nécessaire (lien externe).
Étiquette	Personnalisez l'étiquette "En savoir plus"
Lien	Spécifiez l'adresse du lien.
Icône	Spécifiez l'icône 'En savoir plus'.
Classes CSS	Nom de classe CSS pour le bouton 'En savoir plus'. Classe supplémentaire pour 'bouton' possible. inutile si le bouton fléché spécial est coché.
Bouton spécial "Flèche"	Définissez si utilisation du style de Bouton spécial "Flèche".
Cible (pour le lien)	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.

Info sup (comme Changelog)	Entrez les informations supplémentaires ou le journal des modifications (CSS personnalisé spécial pour le journal des modifications disponible). Pas trop long - hauteur max 1000px pour accordéon.
	Bouton "Lire la suite" si nécessaire (lien externe).
Étiquette	Personnalisez l'étiquette "En savoir plus"
Lien	Spécifiez l'adresse du lien.
Icône	Spécifiez l'icône 'En savoir plus'.
Classes CSS	Nom de classe CSS pour le bouton 'En savoir plus'. Classe supplémentaire pour 'bouton' possible. inutile si le bouton fléché spécial est coché.
Bouton spécial "Flèche"	Définissez si utilisation du style de Bouton spécial "Flèche".
Cible (pour le lien)	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.

	Fin Bloc Informations pricipales. Bouton "Lire la suite" si nécessaire (lien externe).
Étiquette	Personnalisez l'étiquette "En savoir plus"
Lien	Spécifiez l'adresse du lien.
Icône	Spécifiez l'icône 'En savoir plus'.
Classes CSS	Nom de classe CSS pour le bouton 'En savoir plus'. Classe supplémentaire pour 'bouton' possible. inutile si le bouton fléché spécial est coché.
Bouton spécial "Flèche"	Définissez si utilisation du style de Bouton spécial "Flèche".
Cible (pour le lien)	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.

	Description bas
Description du bas	Si nécessaire, entrez une description en bas de l'item (pleine page).
Format	Sélectionnez la manière dont vous souhaitez afficher la description bas de l'item (taille de police par défaut ou plus petite, centrer).

Tab Github info : Informations Github repository

Option	Description
Auteur Github	Entrez l'auteur Github (profil).
Nom Repository	Entrez le nom du référentiel (référentiel public uniquement).
	Github repository options.
Nombre de Release	Nombre de Release à afficher: Toutes ou la dernière sous forme de tableau, la dernière sous forme de double bouton. Le nombre Release est défini par Github (limite).
Double boutton gauche classe CSS	Dernière version (double bouton): nom de classe CSS pour le bouton gauche. Classe supplémentaire pour 'bouton' possible.
Double boutton droit classe CSS	Dernière version (double bouton): nom de classe CSS pour le bouton droit. Classe supplémentaire pour 'bouton' possible.
Afficher les jours actifs	Afficher les jours actifs dans la table.
Afficher le téléchargement total	Afficher le téléchargement total sous la table (somme de toutes les versions).

Tab Actif Int/Ext asset

Gestion des items internes ou externes (Format autorisé: zip, pdf, tar, targz). Veuillez, pour les ressources internes, utiliser un répertoire sécurisé pour vos fichiers que vous avez créé précédemment.

Option, utilisation du plugin Simple Download Counter . Votre dossier avec vos fichiers doit être nommé "etl_download" et situé à la racine du site. N'oubliez pas de modifier les paramètres du plugin concernant le nom du dossier. N'utilisez pas d'espaces dans les noms de fichiers!

Option	Description
Nom du bouton	Entrez le nom du bouton.
Icône	Spécifiez l'icône (lien) si nécessaire.
Asset	Charger l'élément à afficher (zip \| pdf \| tar \| targz). Collez votre lien en cas de lien externe.
Cible	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.
Classes CSS	Nom de classe CSS pour le bouton. Classe supplémentaire pour 'button' possible. Inutile si le Bouton spécial "Flèche" est coché.
Bouton spécial "Flèche"	Définissez si utilisation du style de Bouton spécial "Flèche".
	Simple Download Counter plugin
Fichier SDC	Charger le fichier à afficher (zip\|pdf\|tar\|targz).
Lien Class CSS	Nom de la classe CSS pour lien de téléchargement. Classe supplémentaire pour 'button' possible.

Source Joomla!

Article

Option	Description
Catégories	Sélectionnez les catégories dans lesquelles les articles doivent être extraits.
Articles	Entrez les articles Joomla à afficher. Il doit s'agir d'une liste d'identifiants d'articles séparés par une virgule (c'est-à-dire 1, 2, 3, 4, 5).
Articles en vedette	Sélectionnez la manière dont les articles en vedette doivent être filtrés.
Nombre d'articles	Saisissez le nombre maximum d'articles à afficher.
Commencer à partir de	Entrez le décalage en spécifiant le premier article à renvoyer. La valeur par défaut est «0» (le premier article).
Classé par	Sélectionnez comment les articles doivent être classés.
Ordre du classement	Sélectionnez la direction dans laquelle les articles doivent être classés.

Source Joomla!

Affichage des articles

Option	Description
Image	Sélectionnez si et quelle image de l'article doit être affichée.
Texte de l'article	Sélectionnez si et comment le texte de l'article doit être affiché.
Limite de texte	Saisissez le nombre de caractères auquel le texte de l'article doit être limité.
Formatage du texte	Sélectionnez la mise en forme que vous souhaitez utiliser pour afficher le texte de l'article.
Catégorie	Sélectionnez si le titre de la catégorie doit être affiché.
Titre	Sélectionnez si le titre de l'article doit être affiché.
Limite de titre	Entrez le nombre maximum de caractères auquel le titre de l'article doit être limité.
Date	Sélectionnez si la date de l'article doit être affichée.
Lien	Sélectionnez si le lien 'En savoir plus' doit être activé.
Cible	Choisir entre fenêtre parente (Self) ou Nouvelle fenêtre pour la cible.
Disposition	Comment voulez-vous afficher votre texte en savoir plus?
Classe 'En savoir plus'	Nom de classe CSS pour en savoir plus. Classe supplémentaire pour 'button' possible.

Exemple

Repository Github tabs New

Bienvenue/Welcome

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit, ipsum, fuga, in, obcaecati magni ullam nobis voluptas fugiat tenetur voluptatum quas tempora maxime rerum neque deserunt suscipit provident cumque et mollitia ex aspernatur porro minus sapiente voluptatibus eos at perferendis repellat odit aliquid harum molestias ratione pariatur adipisci.

Particles developped by En Toutes Lettres

Repositories Github Tabs

Version:

v1.1 Stable

Last update:

Janvier 01, 2022

Particle Gantry 5.5Joomla! 4GravWordpressphp 7

The En Toutes Lettres Repositories Github Tabs particle gives you the ability to manage your assets Internally or Externally in Github. A lot of options are available.

Github datas: informations and download.

Release name

Download (size)

Download count

Release date

Active days

Repositories Github Tabs - Button for "latest release"

Version:

v1.1 Stable

Last update:

Janvier 01, 2022

Particle Gantry 5.5Joomla! 4GravWordpressphp 7

The En Toutes Lettres Repositories Github Tabs particle gives you the ability to manage your assets Internally or Externally in Github. A lot of options are available.

ETL Images Grid

Version:

v3.0 Stable

Last update:

Janvier 02, 2022

Particle Gantry 5.5Joomla! 4GravWordpressphp 7

Description

The En Toutes Lettres Image Grid particle gives you the ability to quickly set up a clean, organized grid of images. A lot of options are available.

Changelog

Changelog - version 2.1

- Joomla! Update System

Changelog - version 2.0

- Choice of "RokBox" or "Lightcase" popup system"
- Adding a new style, Style 4 opacity
- Options, choice of padding (space between each image)
- Options, choice of image Border Radius
- Images, Title and Subtitle
- Images, choice between opening in Popup or to a link
- Class CSS responsive
- Class imagegrid-firstlarge et imagegrid-lastlarge

See article for Changelog usage

Github datas: informations and download.

Release name

Download (size)

Download count

Release date

Active days

Joomla! CMS

CMS phpmysql

Description

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit, ipsum, fuga, in, obcaecati magni ullam nobis voluptas

Changelog

Security Issues Fixed

[20201101] Low Priority - High Impact - com_finder ignores access levels on autosuggest (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201102] Low Priority - Moderate Impact - Disclosure of secrets in Global Configuration page (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201103] Low Priority - Moderate Impact - Path traversal in mod_random_image (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201104] Low Priority - High Impact - SQL injection in com_users list view (affecting Joomla! 3.0.0 through 3.9.22) More information »
[20201105] Low Priority - Low Impact - User Enumeration in backend login (affecting Joomla! 3.9.0 through 3.9.22) More information »
[20201106] Low Priority - Low Impact - CSRF in com_privacy emailexport feature (affecting Joomla! 3.9.0 through 3.9.22) More information »
[20201107] Low Priority - High Impact - Write ACL violation in multiple core views (affecting Joomla! 1.7.0 through 3.9.22) More information »

Bug fixes and Improvements

In order to get Joomla ready for PHP 8 (to be released on November 26th, 2020), Joomla 3.9.23 includes fixes to ensure PHP 8 compatibility (see #31246, #30608, #30582, #29353, #30922, #31444, #31434, #31442, #31445).

TinyMCE updated #30329
Fix for frontend module editing permissions #30778
Fix for the lost of transparency when cropping/resizing images #30977
Validation rule added for the redirect header field #31016

Visit GitHub for the full list of bug fixes.

Github datas: informations and download.

Release name

Download (size)

Download count

Release date

Active days

Joomla! CMS - latest release table

CMS phpmysql

Description

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit, ipsum, fuga, in, obcaecati magni ullam nobis voluptas

Changelog

Security Issues Fixed

[20201101] Low Priority - High Impact - com_finder ignores access levels on autosuggest (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201102] Low Priority - Moderate Impact - Disclosure of secrets in Global Configuration page (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201103] Low Priority - Moderate Impact - Path traversal in mod_random_image (affecting Joomla! 2.5.0 through 3.9.22) More information »
[20201104] Low Priority - High Impact - SQL injection in com_users list view (affecting Joomla! 3.0.0 through 3.9.22) More information »
[20201105] Low Priority - Low Impact - User Enumeration in backend login (affecting Joomla! 3.9.0 through 3.9.22) More information »
[20201106] Low Priority - Low Impact - CSRF in com_privacy emailexport feature (affecting Joomla! 3.9.0 through 3.9.22) More information »
[20201107] Low Priority - High Impact - Write ACL violation in multiple core views (affecting Joomla! 1.7.0 through 3.9.22) More information »

Bug fixes and Improvements

TinyMCE updated #30329
Fix for frontend module editing permissions #30778
Fix for the lost of transparency when cropping/resizing images #30977
Validation rule added for the redirect header field #31016

Visit GitHub for the full list of bug fixes.

Github datas: informations and download.

Release name

Download (size)

Download count

Release date

Active days

Particles selected by En Toutes Lettres

ETL Images Grid

Version:

v3.0 Stable MIT License

Last update:

Janvier 01, 2022

Particle Gantry 5.5

The En Toutes Lettres Image Grid particle gives you the ability to quickly set up a clean, organized grid of images. A lot of options are available.

ETL Images Grid

Version:

v3.0 Stable MIT License

Last update:

Janvier 01, 2022

Particle Gantry 5.5

The En Toutes Lettres Image Grid particle gives you the ability to quickly set up a clean, organized grid of images. A lot of options are available.

Github datas: informations and download.

Release name

Download (size)

Download count

Release date

Active days

Internal Repository Align

Version:

v3.2 Stable

Last update:

Décembre 01, 2020

Gantry 5Joomla

Bertrand Pascal

Download

Internal Repository Center

Version:

v3.2 Stable

Last update:

Décembre 01, 2020

Gantry 5Joomla

Bertrand Pascal

Download

External Link Align

Version:

v1.01 Stable

Last update:

Août 08, 2016

Particle Gantry 5

Adds a cookie consent notice to your website.

Download

External Link Center

Version:

v1.01 Stable

Last update:

Août 08, 2016

Particle Gantry 5

Adds a cookie consent notice to your website.

Download

Particles selected by En Toutes Lettres

ETL Images Grid

Version:

v3.0 Stable MIT License

Last update:

Janvier 01, 2022

Particle Gantry 5.5

The En Toutes Lettres Image Grid particle gives you the ability to quickly set up a clean, organized grid of images. A lot of options are available.

ETL Images Grid

Version:

v3.0 Stable MIT License

Last update:

Janvier 01, 2022

Particle Gantry 5.5

The En Toutes Lettres Image Grid particle gives you the ability to quickly set up a clean, organized grid of images. A lot of options are available.

Internal Repository Align

Version:

v3.2 Stable

Last update:

Décembre 01, 2020

Gantry 5Joomla

Bertrand Pascal

Download

Internal Repository Center

Version:

v3.2 Stable

Last update:

Décembre 01, 2020

Gantry 5Joomla

Bertrand Pascal

Download

External Link Align

Version:

v1.01 Stable

Last update:

Août 08, 2016

Particle Gantry 5

Adds a cookie consent notice to your website.

Download

External Link Center

Version:

v1.01 Stable

Last update:

Août 08, 2016

Particle Gantry 5

Adds a cookie consent notice to your website.

Download

button-small