4.2.13 Type htmltext

4.2.13.1 Description

Les attributs de type htmltext permettent d'insérer du texte avec mise en forme.

Le langage de mise en forme est le html, et un éditeur WYSIWYG (basé sur CKEditor) permet d'en simplifier la saisie.

4.2.13.2 Représentation

  • consultation :

    une div contenant la valeur.

    htmltext - consultation html

    Figure 32. htmltext - consultation html

  • modification :

    une iframe dans laquelle est initialisé une instance de CKEditor.

    htmltext - Modification html

    Figure 33. htmltext - Modification html

  • odt :

    la mise en forme est conservée.

    Se reporter au chapitre sur les vues odt pour les restrictions sur l'utilisation des attributs de type html dans les document openDocument text.

4.2.13.3 Comportement

L'éditeur CKeditor nettoit le code HTML inséré. Il ne conserve que les balises qui peuvent être insérées avec la barre de menu.

3.2.19 Lors de l'enregistrement sur le serveur, le nettoyage suivant est effectué :

  • Suppression de tous les attributs commençant par "on" ou "xmlns"
  • Suppression du javascript, applet et vbscript (le contenu est conservé sans les balises )
  • Suppression des éléments avec namespace
  • Les entités UTF-8 sont décodées ;
  • Les commentaires sont supprimés.

En ce qui concerne les balises "script", elles ne sont pas autorisées par CKEditor quelque soit la configuration. Le nettoyage côté serveur est réalisé pour les données qui peuvent provenir d'une autre source que l'éditeur web.

3.2.20 Lors de l'affectation de l'attribut, le fragment HTML est controllé afin de vérifier s'il est bien formé et retourne une erreur si ce n'est pas le cas.

4.2.13.4 Format de stockage

La valeur stockée est le html nettoyé selon les règles précédentes.

Le type utilisé en base de donnée est text.

4.2.13.5 Options

En plus des options communes à tous les types d'attributs, ce type d'attribut dispose des options suivantes :

doclink

Cette option nécessite l'installation du module dynacase-ckeditor-plugins.

Active l'option doclink du HTMLEditor. Cette option se présente sous la forme d'un nouveau bouton (dans la partie réservée au lien dans les toolbar et en fin de toolbar sur la Basic), en cliquant sur le bouton une interface vous propose de sélectionner un document et ajoute une balise de lien vers ce document.

Les valeurs possibles sont :

  • un objet JSON (par exemple {"famId": "DIR", "docrev" : "fixed"}), contenant les propriétés suivantes :
    • famId (obligatoire) : nom logique de la famille des documents cible,
    • docrev (facultatif) : les valeurs possibles sont les mêmes que l'option docrev des attributs de type docid (latest, fixed, state(keystate)),
    • filter (facultatif) : un filtre SQL qui sera appliqué à la recherche
editheight

Indique la hauteur de la zone d'édition.

Les valeurs possibles sont :

  • une taille en pixels (par exemple 400px)

La valeur par défaut est 150px.

htmlclean

Indique que le serveur nettoiera le contenu en supprimant toutes les balises de style, généralement issues d'un copier/coller :

  • les attribut des balises span (le contenu est conservé) et font sont supprimés ;
  • les attributs @class et @style sont supprimés ;
  • les balises style sont supprimées.

De plus, le fragment HTML est réécrit sous une forme normalisée3.2.20

Les valeurs possibles sont :

  • yes
  • no (comportement par défaut)
allowedcontent 3.2.20

Indique que la liste des balises autorisées n'est pas liée au menu. Toute balise html supportée peut être insérée à l'exception de la balise script. Les attributs de ces balises peuvent aussi être utilisées à l'exception des attributs commençant par on tel que onclick ou onmouseover.

Les valeurs possibles sont :

  • all : toute balise supportée est autorisée
  • menu (comportement par défaut) en fonction de la barre de menu (voir option toolbar ci-après).

Les balises supportées sont : a, abbr, acronym, address, applet, area, article, aside, audio, b, base, basefont, bdi, bdo, big, blockquote, body, br, button, canvas, caption, center, cite, code, col, colgroup, command, datalist, dd, del, details, dfn, dialog, dir, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, head, header, hgroup, hr, html, i, iframe, img, input, ins, isindex, kbd, keygen, label, legend, li, link, main, map, mark, menu, meta, meter, nav, noframes, noscript, object, ol, optgroup, option, output, p, param, pre, progress, q, rp, rt, ruby, s, samp, section, select, small, source, span, strike, strong, style, sub, summary, sup, table, tbody, td, textarea, tfoot, th, thead, time, title, tr, track, tt, u, ul, var, video, wbr.

jsonconf

Cette option permet de configurer finement l'éditeur de texte WYSIWYG.

Elle permet notamment de fixer finement le comportement de l'éditeur et le contenu des toolbar. Les options de configuration sont celles de CKEditor, et l'objet de configuration doit être présenté en JSON valide.

Les options propres à CKEditor (resize, correction orthographique, etc) ne sont pas maintenues par Anakeen et leur bon fonctionnement n'est pas garanti par Anakeen.

Aux options de CKEDITOR, dynacase ajoute les options suivantes :

  • addPlugin : permet de charger un plugin additionnel.

    La valeur doit être un tableau (JSON) de noms logiques de plugins (par exemple: "addPlugins": ["docattr"]). Dans ce cas, le plugin doit posséder une commande ayant le même nom que le nom logique du plugin. Cette commande est alors ajoutée en fin de toolbar.

Exemple de configuration permettant d'activer le plugin docattr et le plugin doclink et avec un menu basique et l'activation du mode resize : jsonconf={"addPlugins" : ["docattr"], "doclink" : {"famId" : "DIR"}, "toolbar" : "basic", "resize_enabled" : true}

Attention : l'utilisation de cette option bas niveau désactive les options suivantes :

  • toolbar
  • toolbarexpand
  • editheight
  • doclink

Il est par contre possible de construire une option jsonconf qui a le même effet que les options précédentes.

toolbar

Indique le template à utiliser pour la barre de menu.

La barre de menu contraint par défaut la liste des éléments acceptés par l'éditeur de texte.

Pour supprrimer cette contrainte, il faut utiliser l'option allowedContent de ckeditor. Exemple pour tout autoriser : jsonconf={"allowedContent" : true, "toolbar" : "Basic"}

Les valeurs possibles sont :

  • Simple (comportement par défaut) :

    toolbar Simple

    Figure 34. toolbar Simple

    Les balises et attributs autorisés sont :

    • "a[tout attribut] "
    • "address"
    • "br"
    • "caption[text-align]"
    • "div[text-align]"
    • "em"
    • "h1[text-align]"
    • "h2[text-align]"
    • "h3[text-align]"
    • "h4[text-align]"
    • "h5[text-align]"
    • "h6[text-align]"
    • "img[tout attribut] "
    • "li[text-align]"
    • "ol"
    • "p[text-align]"
    • "pre[text-align]"
    • "s"
    • "span[font-size, color, background-color]"
    • "strong"
    • "table[width, height]"
    • "tbody"
    • "td[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "tfoot"
    • "th[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "thead"
    • "tr"
    • "u"
    • "ul"

  • Basic :

    toolbar Basic

    Figure 35. toolbar Basic

    Les balises et attributs autorisés sont :

    • "a[tout attribut] "
    • "br"
    • "em"
    • "img[tout attribut] "
    • "li"
    • "ol"
    • "p"
    • "strong"
    • "td[width, height, border-color, background-color, white-space, vertical-align, text-align]"
    • "th[width, height, border-color, background-color, white-space, vertical-align, text-align]"
    • "ul"

  • Default :

    toolbar Default

    Figure 36. toolbar Default

    Les balises et attributs autorisés sont :

    • "a[tout attribut] "
    • "address"
    • "big"
    • "blockquote"
    • "br"
    • "caption[text-align]"
    • "cite"
    • "code"
    • "del"
    • "div[text-align, padding, background, border]"
    • "em"
    • "h1[text-align]"
    • "h2[text-align, font-style]"
    • "h3[text-align, color, font-style]"
    • "h4[text-align]"
    • "h5[text-align]"
    • "h6[text-align]"
    • "hr"
    • "img[tout attribut] "
    • "ins"
    • "kbd"
    • "li[text-align]"
    • "ol"
    • "p[text-align]"
    • "pre[text-align]"
    • "q"
    • "s"
    • "samp"
    • "small"
    • "span[font-family, font-size, color, background-color]"
    • "strong"
    • "sub"
    • "sup"
    • "table[width, height, border-collapse, border-style, background-color]"
    • "tbody"
    • "td[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "tfoot"
    • "th[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "thead"
    • "tr"
    • "tt"
    • "u"
    • "ul[list-style-type]"
    • "var"

  • Full :

    toolbar Full

    Figure 37. toolbar Full

    Les balises et attributs autorisés sont :

    • "a[tout attribut] "
    • "address"
    • "big"
    • "blockquote"
    • "br"
    • "caption[text-align]"
    • "cite"
    • "code"
    • "del"
    • "div[text-align, padding, background, border]"
    • "em"
    • "h1[text-align]"
    • "h2[text-align, font-style]"
    • "h3[text-align, color, font-style]"
    • "h4[text-align]"
    • "h5[text-align]"
    • "h6[text-align]"
    • "hr"
    • "img[tout attribut] "
    • "ins"
    • "kbd"
    • "li[text-align]"
    • "ol"
    • "p[text-align]"
    • "pre[text-align]"
    • "q"
    • "s"
    • "samp"
    • "small"
    • "span[font-family, font-size, color, background-color]"
    • "strong"
    • "sub"
    • "sup"
    • "table[width, height, border-collapse, border-style, background-color]"
    • "tbody"
    • "td[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "tfoot"
    • "th[width, height, border-color, background-color, white-space, vertical-align, text-align, text-align]"
    • "thead"
    • "tr"
    • "tt"
    • "u"
    • "ul[list-style-type]"
    • "var"

Pour les toolbars qui comportent le bouton "insérer une image", le widget permet d'insérer des documents "image" déjà enregistrés sur le serveur. Il permet aussi d'ajouter de nouvelles images si le droit "créer" sur la famille "image" (nom logique : IMAGE) est donné à l'utilisateur. Les nouvelles images créées n'ont pas de profilage particulier et peuvent être réutilisées par d'autres utilisateurs.

toolbarexpand

Indique si la barre de menu doit être dépliée lors de l'affichage de l'éditeur. Dans le cas contraire, un petit bouton permet de la déplier.

Les valeurs possibles sont :

  • yes (comportement par défaut)
  • no
Source : famille/attribut_type_htmltext.md Dynacase Platform 3.2 | Core Manuel de référence, version 3.2 édition 13, © Anakeen Labs <labs@anakeen.com>
×
Publié sous licence CC (http://creativecommons.org/licenses/by-nc-sa/2.0/fr/) par Anakeen [www.anakeen.com]
Attribution Vous devez créditer l'Oeuvre, intégrer un lien vers la licence et indiquer si des modifications ont été effectuées à l'Oeuvre. Vous devez indiquer ces informations par tous les moyens possibles mais vous ne pouvez pas suggérer que l'Offrant vous soutient ou soutient la façon dont vous avez utilisé son Oeuvre.
Pas d’Utilisation Commerciale Vous n'êtes pas autoriser à faire un usage commercial de cette Oeuvre, tout ou partie du matériel la composant.
Partage dans les Mêmes Conditions Dans le cas où vous effectuez un remix, que vous transformez, ou créez à partir du matériel composant l'Oeuvre originale, vous devez diffuser l'Oeuvre modifiée dans les même conditions, c'est à dire avec la même licence avec laquelle l'Oeuvre originale a été diffusée.