happydev-team/happywebsite

Happy Dev freelancer's network website

Happy Dev Website

Happy Dev is a network of independent developers. happy-dev.fr

The website a proof-of-concept for a the use of distributed data through the LDP protocol.

The repository name is self-explainatory, the is the repository for the happy-dev organization website code. The goal of this repository is to collaboratively work on interfacing the ldp-framework for manipulating Linked Data with the D3JS library for presenting the information as nodes and links between them.

The base code of the fluidgraph library by fluidlog (https://github.com/fluidlog/fluidgraph ) will probably be used (at least tested).

So, getting back to work ;-)

Installation

As usual, cloning from sources:

git clone https://github.com/happyDev-team/HappyWebSite

happywebsite's Issues

[Brainstorming] Données à exposer

Salut,

Je créé un issue pour référencer les données des membres Happy-Dev à exposer. Je pense également que certaines d'entre elles devraient être requises alors que d'autres peuvent être optionnelles.

Je commence par reprendre la liste de @weeger :

• nom [requis]
• prénom [requis]
• photo [?]
• site web [option]
• facebook [option]
• twitter [option]
• description [requis]
• techno [requis]
• réalisations [option]

A laquelle je rajouterai :

• email [requis]
• alias [option]
• github [option]
• clef publique de chiffrement [option]

A vos remarques !

Refactorer le code sous forme de classe

Et virer les variables globales

Titre panel

• Aligner Le nom Team avec le bouton de fermeture. Faire de même avec tous les titres de tous les panels (projets, etc...)

Use the right included fields for the node label

The field to pick when displaying the field should be indicated in the data or guessed from the type.
What's the best way?

Générer les noeuds issus du container

Être capable d'afficher les data issues du container en tant que Noeud ou circles.

scroll sur le panneau

Le panneau n'est pas scrollable, alors qu'on devrait pouvoir scroller verticalement quand le contenu dépasse de l'écran.

Utiliser des web components

Les éléments ne faisant pas partie du graphe devraient être fournis sous forme de web components

Bug #2

Lors du clic sur un des projets mue par la force, au moment de l'apparition du panel, durant un cours instant on voit le menu des projets puis seulement le projet sur lequel on a cliqué.

Corrections Mep

Dans l'ordre d'importance :

• Sur la vue principale et lors du zoom, les cercles doivent passer au dessus des traits et non l'inverse.
• Si on garde les noms sous les cercles, faire aussi passer les traits sous les noms.

C'est 2 points sont indispensables car un utilisateur voulant cliquer sur un de ces éléments peux malencontreusement cliquer sur le trait et se dire "ça ne fonctionne pas".

• La lettre X, on est d'accord, c'est une barre qui part d'en haut à gauche et qui se fini en bas à droite. Et une autre barre qui part d'en haut à droite et qui se fini en bas à gauche en croisant le première barre en son centre. Lors du croisement des 2 barres, l'angle se situant entre chaque croisement doit être égale à 45° (pas 90 comme je l'ai indiqué auparavant) Or dans la lettre X, l'angle en haut et en bas de ce croisement et inférieur à 45° et l'angle à droite et à gauche de ce croisement est supérieur à 45°.
  • Ensuite cette même croix, la centrer dans le rond. Et mettre un fond blanc au rond. (le fond doit avoir la même couleur que la background-color du body). Puis pour donner un petit côté cool, au passage de la souris dessus (mettre un cursor pointer) et le faire tourner à 90° vers la droite (l'utilisateur amenant sa souris de la gauche vers la droite, ce mouvement vers la droite suit la continuité naturel du mouvement)
  • Mettre un background-color #FFF et une cursor pointer lors d'un hover pour les cercles de fermeture.

@sylvainlb @JonathanBraley

Fiche membre, placement du prénom/nom

• Sur une fiche membre, décaler le prénom de la bordure gauche. Mettre autant de pixels entre le bas de la photo et le prénom/nom qu'entre le prénom et la bordure de gauche.

Ajouter une transition sur l'ouverture et fermeture du panel

Page contact

Fermer la popup de contact après validation

Lorsqu'on valide le formulaire de contact, il faudrait vider la popup, écrire, merci, à bientôt et faire disparaître la popup en fade out

Poids photo membre/projet

• Limiter le poids de la photo à 300 ko.

Modification du data JSON

Dans le JSON, rajouter l'info URL du container et le nom de l'entite.

Et les prendre en compte dans le drawNodes.

Rendre ça beau

photo dans les ronds

est-il possible d'ajouter les photos dans les ronds jaunes du graphique (team/project) ?
:)

Gérer des templates différents pour les différentes sections

Corriger l'ordre d'apparition des liens

Délimitation d'une zone de zoom

Lorsqu'on clique sur un noeud, on zoome (zoom + translate + scale) sur une zone de l'écran qui affiche les entités présentes dans le container.

Bordure photo membre/projet

Virer la bordure blanche épaisse de 1px sur le côté gauche de la photo d'un membre, d'un projet.

Envoi de mail

Être capable d'envoyer un mail depuis l'interface en JavaScript.

Une stratégie: Envoi d'une commande sur une URL dédié qui répondra via Wordpress et enverra un mail.

Idée: mettre à disposition les clefs SSH des Happy-Dev

Ca serait pas mal de mettre en ligne les clefs publiques SSH des membres du réseau.

C'est une conversation régulière :

Tu me donnes accès au serveur ?
< Donne moi ta clef SSH

Alors qu'on pourrais directement faire un :
$ curl https://happy-dev.fr/machin/ssh.pubkey >> .ssh/authorized_keys

Vous remarquerez le S de HTTPS... C'est un prérequis pour cette fonctionnalité.

Fermeture manifeste

• La fermeture du manifeste, rajouter en plus un bouton de fermeture en haut à droite. C'est cool de cliquer sur le manifeste (garder cette fonctionnalité) pour le fermer mais ce n'est pas assez intuitif.

Donner taille fixe panel durant action ouvrir/fermer

Sur Projects, lors de la fermeture/ouverture du panel, la liste des projets au moment d'approcher de la bordure droite se casse légèrement la gueule. Les éléments se redimensionne puisque la fenêtre diminue en largeur. Il faudrait lors de l'action de la fermeture donner une taille fixe en pixels à ces éléments
Il en va de même pour Team, même si cela se voit moins.

Rajouter le manifeste

Panel Team

• Sur le panel Team, au passage de la souris sur le prénom, nom et photo du membre, mettre un cursor pointeur et les rendre cliquable. Destination : fiche personnel du membre.

Retour à la vue principale

Templates externe

Il faudrait utiliser des templates dans des fichiers séparés, et les référencer sous forme d'urls dans les data.

Utiliser la Force pour organiser les noeuds

Séparation panel et site

• Le trait noir de séparation entre le panel des membres et le reste du site. Je pense à deux possibilités. Soit le rendre identique d'un point de vue épaisseur et couleur que les traits spérant les membres dans le panel. Soit le laisser tel quel en lui donnant un léger effet 3D/ de profondeur sur le côté gauche. Ce qui aura pour effet visuel de surélever légèrement le panel par rapport au reste du site.

Centrer lors du zoom

• Au clic de Team et donc à l'ouverture du panel avec les membres de la team, centrer le gros rond Team par rapport à la bordure gauche et à la bordure droite (celle faisant les délimitation du panel et du reste du site).

Le bouton précédent ne fait pas réagir le graphe

Bug #3

à la fermeture d'un projet, le panel se réouvre immédiatement et en plus ce n'est plus la fiche projet mais la liste de tous les projets.

popup de contact - partie Qu'est-ce que je peux faire pour toi ?

est-il envisageable de permettre à l'espace de saisie de s'agrandir au fur et à mesure de la saisie ?

Je trouve ça assez inconfortable de ne pas voir l'ensemble de ma requête, ne serait-ce que pour pouvoir me relire avant d'envoyer...

Déplacement entre menus

• Lorsque le site est zoomer, pouvoir se déplacer sur entre les différents gros ronds en cliquant sur le background du site avec le clic gauche, en le maintenant enfoncé et en poussant la souris dans la direction choisie.

Données sur les fiches

Il faudrait faire la liste des données obligatoires sur les fiches de membres et de projets, et les faire rentrer par les membres

Modification rapprochement nom/rond

• Décaler le prénom/nom du petit cercle afin que celui-ci ne soit pas collé au cercle.

Affichage Titre projet/nom membre

Dans le cas où le titre d'un projet ou bien le nom du membre est trop long. C'est le cas avec le mien :P
Donner une largeur fixe au contenu du titre/nom et le faire descendre à la ligne si celui-ci est trop long afin de ne pas casser le style. Penser à le couper au niveau d'un espace et non en plein milieu d'un mot.

formatage du texte

Prévoir un formatage automatique du texte pour éviter les disparités et garder une certaine cohérence.
Exemple : Amandine est la seule à avoir son nom de famille en majuscule, il faudrait qu'il puisse être automatiquement appliqué en minuscule comme pour les autres.

Apparence du formulaire de contact

Bug #1

à partir du panel projects, arrivé sur une fiche projet, lors du clic de la fermeture le panel s'ouvre et se ré-ouvre immédiatement, il faut cliquer une seconde fois pour que la fermeture soit effective.

Retour à la liste

Le bouton retour sur une fiche membre ou projet ferme le panel. Il faudrait que ça retourne à la liste.

Centrer prénom/nom sous cercle mue par la force

• Centrer le prénom et le nom en dessous du cercle (prendre en compte que chaque prénom et nom diffère en longueur).

Click sur le noeud - Affichage des infos

Afficher les infos complémentaires de l'entité lors d'un clic sur le noeud.

Baisser rond sous slogan

Sur la page d'accueil, le petit point sous le slogan, à baisser un peu, il est trop collé au slogan.

Bug #4 ?

Pas sûr que cela soit un bug, c'est peut-être voulu ?

Lorsqu'on clic sur le gros cercle "Team", zoom + panel Team qui s'ouvre. Lorsqu'on ferme le panel Team, en cliquant à nouveau sur le gros cercle "Team" aucune action n'est executé.

Corriger l'apparence du manifeste

@eluaneuh : comment peut-on rendre le manifeste un peu plus beau ?

Adaptation affichage éléments fiche membre

La disposition des éléments sur une fiche membre et sur une fiche projet doit être identique ou en tout cas la plus similaire possible. La façon dont les éléments s'affichent sur une fiche projet donne un côté plus moderne, nous allons donc adapter la même chose à une fiche membre. Le prénom et le nom au dessus de la photo sur fond #FFF et son color en #000, aligner avec le bouton de fermeture.

Routage dans l'application

Modifier l'URL lorsqu'on modifie une zone.

Être capable de pointer directement sur la zone depuis cette URL.

Exemple: http://happy-dev.fr/projects/ pointe directement sur le listing des projets.