[Plugin] StickyNotes - espace de notes commun

SudwebdesignSudwebdesign Membres
6 févr. modifié dans Plugins
[h]Un greffon qui ajoute un système de notes partagées et visible à la P0ST IT,[/h]
De nombreux réglages, compatible PluXml 5.4 et supérieur.
Notes cachées, privées et publiques disponibles.


Les langues officielles sont toutes présentes (*sont auto traduites)
*de, *en, *es, fr, *it, *nl, *oc, *pl, *pt, *ro, *ru

[h]Il est à télécharger ici, sur mon site et dans mon dépôt de plugins[/h]

[édit 16/01/2019] (1.0.5)
En plus du tableau, les vignettes peuvent être déplacées et déposées n'importe où sur l'écran ;)
et sur chaque onglet leurs positions sont préservées de manière différente.

[édit 20/01/2019]
(1.0.7) Les vignettes peuvent retourner dans le tableau ;)
(1.0.8) Testé et fonctionnel sur les PluXml 5.2 à 5.7 + Lorsque l'on bascule les notes (toggle) les vignettes fixées restent a l'écran.
ps: les archives 1.0.7 et 1.0.6 avaient un problème au niveau des liens symboliques de toutes les aides, elles ont était refaites.

[édit 21/01/2019] Si vous utiliser votre PluXml avec un mobile, passer a la v1.0.9 ou supérieure qui corrige les déplacements des vignettes sortie du tableau et la barre d'action qui était au dessous de la barre d'action ;)

#BA 2k19

stickynotes-1.0.1.png

Exemples (une ligne égale une note) :
Simple note :
Bonjour les ami(e)s
Catégorie grâce au deux points :
Merci:ça progresse
Note Publique grâce au arobase :
Bonjour tout le monde
Catégorie publique :
@Merci:le monde
Non collé (non affichée grâce au point d'exclamation) :
!Note masquée

Format Technique :
[!][@][<;Catégorie>:]<Texte>

Voir l'aide ou ouvrir "Comment Ça Marche" lors de la modif.

Journal :
# v1.1.0 : 06/02/2019 (Fingers & Mouses Friendly)
# v1.0.10 : 22/01/2019
# v1.0.9 : 21/01/2019
# v1.0.8 : 20/01/2019
# v1.0.7 : 19/01/2019
# v1.0.6 : 18/01/2019
# v1.0.5 : 16/01/2019
# v1.0.4 : 14/01/2019
# v1.0.2 : 03/01/2019
# v1.0.1 : 02/01/2019
# v1.0.0 : 31/12/2018
(voir README/CHANGELOG.md)

Notre temps est la seule monnaie vraie ;)

Site - Dépôt - MyShop

Réponses

  • NaBiSsNaBiSs Membres
    2 janv. modifié
    J'en ai rêvé, Sudwebdesign l'a fait.

    Mille merci, je m'en vais le tester.

    EDIT: Ce n'est pas tout à fait ce que je voulais, il faudrait juste une option pour ne pas afficher en front-end et le garder en back-end et ça serait parfait.

    EDIT2: My bad, il apparait en front qu'une fois connecté en back. Donc absolument invisible pour les visiteurs. Bon boulot !
  • jack31jack31 Membres
    NaBiSs a écrit:
    EDIT2: My bad, il apparaît en front qu'une fois connecté en back. Donc absolument invisible pour les visiteurs. Bon boulot !

    @ Sudwebdesign

    Ben justement, c'est sensé afficher en frontend si l'on veut non ?

    Alors, pourquoi n'ai-je seulement écrit que StickyNotes# (avec ton lien) sur mon accueil ?

    Dans le back, ça va.
  • SudwebdesignSudwebdesign Membres
    3 janv. modifié
    jack31 a écrit:
    NaBiSs a écrit:
    EDIT2: My bad, il apparaît en front qu'une fois connecté en back. Donc absolument invisible pour les visiteurs. Bon boulot !

    @ Sudwebdesign

    Ben justement, c'est sensé afficher en frontend si l'on veut non ?

    Alors, pourquoi n'ai-je seulement écrit que StickyNotes# (avec ton lien) sur mon accueil ?

    Dans le back, ça va.

    Pour qu'une vignette soit affichée en public,


    (sans catégorie)
    @Bonjour tout le monde

    (avec catégorie publique, les deux points)
    @Merci: le monde

    [édit] Ceci est pour éviter de rendre public toutes les notes :)

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • jack31jack31 Membres
    Sudwebdesign a écrit:
    Pour qu'une vignette soit affichée en public,

    Tout simplement génial et je me demande où vous allez chercher toutes ces idées.

    Merci. :)
  • SudwebdesignSudwebdesign Membres
    15 janv. modifié
    lu @tou(te)s
    Avis aux utilisateurs de la première heure, je vous conseille de faire la MAJ.
    la v1.0.4 a -deBugs & -deCollisions et est +fluide & +rapide ;)
    Elle a les scripts css et js minifiées et corrige de nombreuses petites choses(?)
    Entres autres : restais collé a la souris (parfois) si les notes étaient déplacés en les "attrapant" par le "Notes déplaçables" ou une vignette.
    # v1.0.4 : 14/01/2019
    ## CLASSE
    [+] showNotes : js funk (in)active() : renomé en : __CLASS__ (In)Active : pour évité même nom de Funk's = StickyNotes(In)Active
    [+] notesManager : Renommé en : __CLASS__ Manager + dans styckyNotes.js : pour évité même nom de variable = StickyNotesManager
    [+] Nettoyage : Déclarations et hooks inutilisés retirés
    :-: $this->addHook('plxMotorConstruct', 'plxMotorConstruct');#memo
    :-: $this->addHook('plxAdminConstruct', 'plxAdminConstruct');#memo
    :-: $this->addHook('Index', 'Index');#(TODO? @dev.notes)// active si bon site et utilisateur parm + connecté
    :-: $this->addHook('AdminPrepend', 'AdminPrepend');#(TODO? @dev.notes)
    Fix : SyntaxError: redeclaration of var options in medias.php
    :-: const el
    :+: const <?php echo __CLASS__ ?>displaceJsel
    :-: const options
    :+: const <?php echo __CLASS__ ?>displaceJsoptions
    Fix Reste accroché si on attrape le lien (notes déplacables) ou une étiquette
    ::: tag <a> to <span> element
    Fix le tag <main><section> se retrouve sur le menu si les notes sont trop a droite (et ouvertes)
    ::: Avec hack pluxml css .section z-index
    :+: aside.aside{z-index:1}section.section{z-index:auto}#StickyNotesMenu{z-index:2;...
    ## ASSETS
    StickyNotes minifiés [css](refresh-sf.com) & [js](jscompress.com)

    # v1.0.3 : 07/01/2019 (non publié)
    ## CLASSE
    Fix $imgbase : images menu src si ds gutuma : PLX_PLUGINS.__CLASS__ ==> $this->href_plugin

    +

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • Yep, une MAJ qui permet de déplacé les notes une a une et gardent leurs place le temps de vie de la fenêtre...

    # v1.0.5 : 16/01/2019 (Individual Fixed Zticky)
    ## CLASSE
    [+] Lors du (re)clic sur l'ancre remonte l’ascendeur de la fenêtre ou revient au tableau de notes
    [+] Les vignettes peuvent être sorties du tableau pour se collé n'importe où sur l'écran
    [+] Le tableau vertical est maintenant déplaçable ainsi que les vignettes (individuelle)
    [+] Les tableaux sont déplaçable qu'avec leurs grabber

    ## ASSETS
    StickyNotes minifiés [css][js](refresh-sf.com)

    @ PluX

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • SudwebdesignSudwebdesign Membres
    19 janv. modifié
    Yep, une MAJ qui corrige un peu le style, le tableau à 3 nouvelles bascules (toggle) et évite d'avoir les notes d'un autre PluXml ou l'on est connecté (sous dossiers et même Host)
    # v1.0.6 : 18/01/2019 (MultiPluXml)
    ## CLASSE
    [+] Nouvelles bascules (Toggles) pour et dans le tableau : cache ou affiche les notes qui sont dans le panneau (toutes|admin|public) + js
    Fix : Affiche les notes privées si l'on a plusieur pluxml sur le meme host (local)
    ## ASSETS
    ### CSS
    Fix : (1.0.5) hover panel : ligne disgacieuse (mauvais choix d'id)
    Fix : (1.0.5) horizontal panel : width 100%;
    ### JS
    Fix : ne garde plus le tableau ouvert (sessionStorage (semble ne pas cliqué)
    Fix : si caché par défaut (le lien est a — au lieu de Ξ

    @ PluX

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • SudwebdesignSudwebdesign Membres
    19 janv. modifié
    Yep, une MAJ qui permet de replacé les notes fixées dans le tableau principal...

    # v1.0.7 : 19/01/2019 (Returnz)
    ## CLASSE
    [+] #Numéro de la note
    [+] Toggles fermés = ≡ (remplace Ξ)
    [+] **Les notes fixées peuvent retourné avec les autre notes (dé-fixé) : →≡
    ::: New icons
    ::: pin-icon.png : http://www.iconarchive.com/show/beautiful-flat-one-color-icons-by-elegantthemes.html
    ::: License: Linkware (Backlink to http://icons8.com required) + http://www.iconarchive.com/show/windows-8-icons-by-icons8/Programming-Unpin-icon.html
    ## ASSETS
    StickyNotes minifiés [css][js](refresh-sf.com)
    ### JS+CSS
    **Big up

    @ PluX

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • @Yé, une MAJ qui roule sur les vieux navi, (re)permet d'attraper le panneau de toutes part, laisse a l'écran les notes sorties du tableau principal lorsqu'il est caché et améliore bien des choses...

    # v1.0.8 : 20/01/2019 (Crossed)
    ChangeLog a écrit:
    # v1.0.8 : 20/01/2019 (Crossed)
    [+] Testé et fonctionnel sur les PluXml 5.2 à 5.7
    ## CLASSE
    [+] Les notes fixées restent affichées même si le tableau principal est caché : liste <ul> dédié
    :*: (re) pouvoir attraper le tableau de toutes parts (sauf bien sur les notes, cela les rends fixe) : event.stopPropagation()
    :*: **v1.0.7 Toggle dans le tableau global qui bascule les vignettes, mais point celles fixés ;) : + el.moveTo.ul#StickyNotesouter (Liste externe et fixe)
    :+: <ul class="<?php echo __CLASS__ ?> outer" id="<?php echo __CLASS__ ?>outer"></ul><!-- ul <?php echo __CLASS__ ?> outer -->
    :-: // handle: document.getElementById('before<?php echo __CLASS__ ?>'),//Grabber with img or all moves ::: setDisplace(individual) //commenté ;)
    [+] Admin : Lien du bookmark + visible (icone)
    [+] Admin : Menu dans la langue de l'utilisateur avec L_NOTES
    :+: Fix : Lang default (constructeur)
    [+] Bascule en haut du tableau est dispo pour le visiteur lambda : $togglePanel
    [+] Bascules en haut du tableau $toggleNotes & $togglePanel a >>> span
    [+] Affiche si $zeroNote en bas du tableau
    [+] Les 17 couleurs on un peu changées et la classe nettoyé
    ### Les couleurs
    #$colors = explode(' ','ccf cfc cff fcc fcf ffc fff');#origin 7 colors #ccc gray light miss
    #$colors = explode(' ','ccf cfc cff fcc fcf ddf dfd dff fdd fdf ffd eef efe eff fee fef ffe ffc fff');#e2d #19 colors
    #$colors = explode(' ','ccf cfc cff fcc fcf ddf dfd dff fdd fdf eef efe eff fee fef ffc fff');#e&d #17 colors #rem : yellows -> ffd ffe <= v1.0.7
    $colors = explode(' ','c0c0ff c0ffc0 c0ffff ffc0c0 ffc0ff c8c8ff c8ffc8 c8ffff ffc8c8 ffc8ff ceceff ceffce ceffff ffcece ffceff ffffc fff');#ce&c0 #17 colors #rem : yellows -> ffffc0 ffffe : v1.0.8
    Fix : Bascule principale (menu fixe) : ancre : #beforeStickyNotes >>> #StickyNotesdisplace
    ## HELP
    Fix : si inactif impossible d'afficher l'aide : _help.php (symlink)
    ::: : if(!isset($plxAdmin->plxPlugins->aPlugins[$pluginName]))exit(L_PLUGINS_ACTIVATE.' '.$pluginName);#si inactif. On dit de l'activer... et on quitte avant l'erreur ;)
    ## ASSETS
    StickyNotes minifiés [css][js](refresh-sf.com)
    ### CSS
    Grabber + notes hover retouchés
    move.gif >>> move.png
    nouv. public.png
    Fix : z-index
    ::: Pluxml 5.4 action-bar fix (9999) : .section .inline-form.action-bar{z-index:1}
    ::: plxMyMultilingue 0.8.1 flags fix (799) : #langs{z-index: 2}
    ### JS
    Fix : Mobiles & Tablettes : $this->displaceJs() : window.addEventListener("orientationchange", function() {... #supprimé
    #### Cross old navi (inline & externe) :
    Fix : $this->displaceJs() : function setDisplace(individual) : keyword "let" to "var" ::: for(let i
    Fix : Load & change style
    :?: el.parentNode.style = '';//unwork in old chromium (v31)
    :?: el.parentNode.cssText = '';//unwork in old chromium (v31)
    >>> el.parentNode.setAttribute('style', '');//good in old navigator
    Fix : Load & change className
    :?: el.parentNode.className = '';//unwork in old chromium (v31) //rem StickyNotesFixed
    >>> el.parentNode.setAttribute('class', '');//good in old navigator //rem StickyNotesFixed
    #### **Big up v1.0.7
    [+] inStickyNotes(ev)

    @ PluX

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • SudwebdesignSudwebdesign Membres
    22 janv. modifié
    @Yé, une MAJ qui corrige les déplacements des vignettes lors de leurs sortie du tableau principal et aussi, la barre d'action qui était au dessous de la barre d'action...

    # v1.0.9 : 21/01/2019 (Mobile Fixed grab)
    ChangeLog a écrit:
    # v1.0.9 : 21/01/2019 (Mobile Fixed grab)
    ## CLASSE
    ### JS
    Fix : Sur mobile, lors du déplacement de la vignette hors du tableau principal, elle est placé hors de l'écran.
    ```
    function StickyNotes(el,event)
    ...
    var rect = el.getBoundingClientRect();//duckduckgo.com/?t=lm&q=position+of+an+element&ia=web
    // console.log(rect.top,event.clientY, rect.left,event.clientX, rect.right, rect.bottom);
    el.style.left = (event.clientX || rect.left )+'px'//v 1.0.9
    el.style.top = (event.clientY || rect.top )+'px';//v 1.0.9
    ...
    function StickyNotesPos(el,event)
    ...
    el.style.left = event.clientX +'px';//event.clientX+'px'//v 1.0.9
    el.style.top = event.clientY +'px';//event.clientY+'px'//v 1.0.9
    ```
    ## ASSETS
    ### CSS
    [+] @media (min-width: 48rem)
    ::: Fix : #mobile Le bas du menu admin est caché par l'action bar
    ::: Fix : #mobile #plxAdminBar cache le menu

    @ PluX

    Ps : Testé sur un navi d'origine d'un Android 4 (a pars le menu qui reste affiché #merci #plxAdminBar) le déplacement se déroule bien, ainsi que sur un firefox 64

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • @Yé, une MAJ qui corrige le déplacement des vignettes sorties du tableau + copy to clipboard

    # v1.0.10 : 22/01/2019 (Good grab²)
    ChangeLog a écrit:

    # v1.0.10 : 22/01/2019 (Good grab²)
    ## CLASSE
    [+] Mini systeme de copie vers le bloc note (clipBoard / ctrl+c) + js StickyNotescopier
    ::: si la commande copy "document.execCommand('copy');" retourne rien une boite d'alerte avec le texte + Ctrl + c & Ctrl + v ;)
    ::: Avec un GNULINUX, il est possible de copier le texte d'une boite d'alerte et fonctione sur un Firefox quantum (64), #non sur un vieux chromium (31)
    ::: copier.png : src : https://apkpure.com/copy-to-clipboard/copy.clipboard.com
    ### JS
    Fix : lors du déplacement d'une vignette déja hors du tableau principal,
    ::: : lorsque elle est relachée, elle se dépose sur son coin supérieur gauche a l'endroit du pointeur (souris, doigt, stylet)
    ```
    function StickyNotes(el,event)
    ... #if 1st time to move outer box
    el.className = '<?php echo __CLASS__ ?>Moved firsttime';// v 1.0.10
    ... #else
    el.className = '<?php echo __CLASS__ ?>Moved';// v 1.0.10
    ...
    function StickyNotesPos(el,event)
    if(el.className == '<?php echo __CLASS__ ?>Moved firsttime'){//v 1.0.10
    el.style.left = (event.clientX + (el.style.width/2) + (el.style.paddingLeft) + (el.style.marginLeft) )+'px';//event.clientX+'px' #v 1.0.8 in <?php echo __CLASS__ ?>()
    el.style.top = (event.clientY + (el.style.height/2) + (el.style.paddingTop) + (el.style.marginTop) )+'px';//event.clientY+'px' #v 1.0.8 in <?php echo __CLASS__ ?>()
    }
    ...
    ```
    ## ASSETS
    ### JS
    [+] .StickyNotescopier addEventListener click
    #info.xml
    [+] <compatible>5.2+</compatible>
    [+] <scope></scope>

    @ PluX

    Ps : Testé sur un navi d'origine d'un Android 4 (a pars le menu qui reste affiché #merci #plxAdminBar) le déplacement se déroule bien, ainsi que sur un firefox 64

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • @Yé, copy to clipboard amélioré et la vrai recette a été trouvé* pour la première sortie du tableau de la vignette sur les appareils tactile ou non ;)
    # v1.1.0 : 06/02/2019 (Fingers & Mouses Friendly)

    [h]*Elle est simple en fait :[/h]
    Toujours utiliser (et en premier) el.getBoundingClientRect() pour toujours avoir le bon endroit où se trouve le pointeur.
    [== JavaScript ==]
    		var rect = el.getBoundingClientRect();// #v 1.1.0 ok on touch & click !work fine @begining of funk //duckduckgo.com/?t=lm&q=position+of+an+element&ia=web
    //		el.style.left = (event.clientX || rect.left )+'px';//v 1.0.9
    //		el.style.top = (event.clientY || rect.top )+'px';//v 1.0.9
    		el.style.left = rect.left+'px';// #v 1.1.0
    		el.style.top = rect.top+'px';// #v 1.1.0
    

    Testé sur :
    +un navi d'origine d'un Android 4.1 la sortie se déroule bien mais peux garder le hover :/
    +ainsi que sur un Firefox 43 (pc) et quantum (pc et android)
    ChangeLog a écrit:
    # v1.1.0 : 06/02/2019 (Fingers & Mouses Friendly)
    ## CLASSE
    [+] onActivate() en mode vertical au lieu d'horizontal ::: param 0 >>> 1 ::: $this->setParam('valign', 1, 'numeric');
    [+] Reordered js funk's : el.style.zIndex @begin & @last ;)
    ::: onMouseDown: <?php echo __CLASS__ ?>,
    ::: onTouchStart: <?php echo __CLASS__ ?>,
    ::: onMouseUp: <?php echo __CLASS__ ?>Pos,
    ::: onTouchStop: <?php echo __CLASS__ ?>Pos
    [+] FingerGrab (touch device fix)
    ::: Testé avec Firefox 43 (pc) + quantum (android et pc), chrom(e)ium 31 (pc) + android-4.1
    ::: simply with el.getBoundingClientRect() @begining of funk replace confused event.client(X|Y) on (browsers) touch devices
    ###### ::: StickyNotes() @lias <?php echo __CLASS__ ?>()
    ```
    var rect = el.getBoundingClientRect();// #v 1.1.0 ok on touch & click !work fine @begining of funk //duckduckgo.com/?t=lm&q=position+of+an+element&ia=web
    // el.style.left = (event.clientX || rect.left )+'px'//v 1.0.9
    // el.style.top = (event.clientY || rect.top )+'px';//v 1.0.9
    el.style.left = rect.left+'px'// #v 1.1.0
    el.style.top = rect.top+'px';// #v 1.1.0
    ```
    ###### ::: StickyNotespos() @lias <?php echo __CLASS__ ?>Pos()
    ```
    // el.style.left = (event.clientX + (el.style.width/2) + (el.style.paddingLeft) + (el.style.marginLeft) )+'px';//event.clientX+'px' #v 1.0.8 in <?php echo __CLASS__ ?>()
    // el.style.top = (event.clientY + (el.style.height/2) + (el.style.paddingTop) + (el.style.marginTop) )+'px';//event.clientY+'px' #v 1.0.8 in <?php echo __CLASS__ ?>()
    var rect = el.getBoundingClientRect();// #v 1.1.0 ok on touch & click !work fine @begining of funk //duckduckgo.com/?t=lm&q=position+of+an+element&ia=web
    el.style.left = rect.left+'px';// #v 1.1.0 in <?php echo __CLASS__ ?>()
    el.style.top = rect.top+'px';// #v 1.1.0 in <?php echo __CLASS__ ?>()
    ```
    [+] img titre tableau des vignettes ::: →≡↵
    [+] StickyNotescopier(el) >>> StickyNotes.js (add event listener)
    Fix old navi : sessionStorage.StickyNotes
    ::: sessionStorage.setItem & sessionStorage.getItem : it' a good think
    ::: sessionStorage.removeItem(el.parentNode.id);//rem rules
    Fix : showNotes() : manque un espace entre la catégorie et le texte de la vignette lors du clic sur l'icone qui envois dans le presse papier (ClipBoard)
    :+: </h2> (+ un espace a la fin du texte (titre 2)
    [+] rem ""

    @ PluX

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

  • SudwebdesignSudwebdesign Membres
    11 mai modifié
    0yé, 0yé,
    [h]StickyNotes 1.1.1 est prêt a être télécharger[/h]

    Nouvelle fonctionnalité :
    Coquilles corrigés :
    • Avec le toggle principal ou avec le sessionStorage (mémoire) : Le paramètre d'affichage (par défaut) du tableau principal des notes (visible ou caché) non respecté.
    • La vignette reste collée à la souris lorsque l'on déplace la vignette avec un lien ou l'image du copier. En réalité les objets html draggable.
    ChangeLog a écrit:
    # v1.1.1 : 11/03/2019 (AutoLinks & Fully Draggable)
    ## CLASSE
    [+] Funk static autolink() : importé de plxUtils::autolink (v5.7) (compatibilité des anciens & futurs? PluXml)
    [+] Pour chaque texte de note on utilise self::autolink + referer: noreferer + target: _blank + onclick:event.stopPropagation(); + draggable: false (! important !) + title: ↦↗ (↗)
    Fix si on déplace avec l'img copier ou lien (une fois hors du tableau, reste collé a la souris)
    :+: attribut draggable="false" aux img & html elements semble faire l'affaire
    Fix Le panneau global des notes ne respecte pas la config (caché ou visible par défaut)
    :+: Fix sessionStorage.getItem() return null if undefined (Firefox 65)
    ::: js CLASS FUNK showNotes() : window.onload's simplifés en 1 seul : editNotes in popup Manager (caché par défaut)
    ::: js externe : #stickynote.js : window.onload : if (sessionStorage.getItem('StickyNotes') != null ) /* OLD : !== undefined*/
    @ la proXima

    Notre temps est la seule monnaie vraie ;)

    Site - Dépôt - MyShop

Connectez-vous ou Inscrivez-vous pour répondre.