JsonViewer

Un composant pour visualiser du json.
https://forums.4d.com/4DBB_Main/x_User/4467/files/29142528.zip

Exemples d’utilisations :

• visualiser un fichier json

  • lancer le formulaire :
    <code 4D>
    C_OBJET($io)
    $io:=Créer objet
    $io.data:=Creer objet
    $io.action:=“processNew”
    $io.event:=0
    jsonViewer_mng ($io)
    </code 4D>
  • glisser déposer le fichier sur la zone
    (prévoir café clope avec de gros fichiers)

• afficher Form
<code 4D>
$io:=Creer objet
$io.data:=JSON Parse(JSON Stringify(Form;*)) //pour les entity selection
$io.action:=“processNew”
$io.event:=0
jsonViewer_mng ($io)
</code 4D>

Note :
les “modifiers” alt et majuscule agissent sur les “fold/unfold” (:arrow_forward:▼) comme j’aimerais tant que cela redevienne le cas dans l’éditeur de code 4D.
alt = propager aux fils
majusc = propager aux frères
C’est grave pratique…

3 Likes

Salut Arnaud,

Merci pour cette contribution.

C’est quelle version de 4D ?

Je ne l’ai travaillé qu’en 17 r2 et r3 mais je pense que ça marche avec n’importe quelle v17, vu mon niveau je ne risque pas de donner dans l’ultra moderne. Même remarque que d’habitude, d’ailleurs : améliorations et critiques bienvenues…

Regarde la concaténation avec join(), ça m’a halluciné tellement ça décoiffe. J’ai laissé l’ancienne façon de faire avec des blobs, pour faire à l’ancienne il suffit de maintenir alt ou majusc enfoncée (ou comment rouler avec le frein à main.)

Très sympa le concept!
Merci Arnaud

Magnifique tout ça et le temps que tu as dû passer à caler tout ça !…

Pour quoi as-tu écrit ça ?

Pour regarder autrement que dans le débogueur, essentiellement.

PS : certains utilisent BBEdit pour ça, le faire dans 4D me tentait.

: Arnaud DE MONTARD

Pour regarder autrement que dans le débogueur, essentiellement.

PS : certains utilisent BBEdit pour ça, le faire dans 4D me tentait.

y’a ça chez moi: http://christian-kienle.de/apps/jayson/jayson>

Nice! Thanks for the effort. I have been looking for a simple json viewer implementation in 4D.

Hi Arnaud,

That is a cool piece of work. Previously I have used TextLab for json and xml work.

Now I can visualize (pretty formatted w/colors) right from with 4D.

And I can expand the font size for easier viewing, expand the line number column, etc.

This is awesome work Arnaud!

Thank you!

JOhn…

Brent, John,
thank you for kind words, I’m happy you like it! :smiley:
(despite a questionable choice of colors :mrgreen:)

Another solution in a webarea. Although not the latest 4d version, but still working :slight_smile:

https://github.com/4dgeek/4d-component-jsonEditor

Rolf

1 Like

Hi Rolf,

Thanks for that. It’s a great way to leverage existing web technologies via WebArea. Arnaud’s work is pure 4D and utilizes objects and object notation, the new Form command, and it works really well. I have an object I need to spy on often in my development. This object varies in size but I’m looking at it as I type and it has over 2,500 rows. No problems and near instantaneous viewing. In fact I change from record to record and click it and it redraws/refreshes instantly so the variables are up-to-date.

I’m sure similar behavior is available in the webarea version. But I like the way Arnaud utilized the current version of 4D.

It’s good stuff!

Thanks for sharing and demonstrating that there’s always more than one way to do something/anything in 4D.

Appreciate,
John…

Hi Arnaud,

No problem and well deserved!

I noticed in the source version there is a search variable on the form but in the running version it’s not visible.

It would be quite useful to be able to make a quick search for a tag (in large objects like mine) and have it go to the first occurrence (next and previous would be a bonus! ).

Before I think about this further may I ask if you were toying with a search or is that variable used for something else? And if so did you get any of the search behavior implemented?

Appreciate,
John…

: John FOSTER

I noticed in the source version there is a search variable on the
form but in the running version it’s not visible.
It would be quite useful to be able to make a quick search for a tag
(in large objects like mine) and have it go to the first occurrence
(next and previous would be a bonus! ).
Hi John,
it’s the idea, suggested by my colleague Eric Juhel. I’m not in it now, but I seem to remember the search is regex based and works partially - try with the search box visible. I was not satisfied about how to display/navigate in results, it’s neither done nor to be done, as we say in french, that’s why it remains invisible. You’re welcome if you want to make it!

: Rolf BACHMANN

Another solution in a webarea.
Hi Rolf,
in one word: wow!

Ouah,

bravo Arnaud, très pratique car cela destringify, donc pas besoin d’aller sur un site avec copier coller…
Et je trouve les couleurs très chouettes !

A quand la version “éditeur”, en plus de “visualiseur” ? :slight_smile:
Un peu à la façon de “Paw”, si tu ne connais pas, super produit pour tester ses api…

Une question, pour visualiser un json, pourquoi tu fais cela
<code 4D>
$io.data:=JSON Parse(JSON Stringify(Form;*)) //pour les entity selection

</code 4D>

au lieu de
<code 4D>
$io.data:=Form //pour les entity selection

</code 4D>

???

En tous les cas, la syntaxe directe
$io.data := ma_variable_objet
fonctionne !

Donc, plutôt qu’un json viewer, ne serions nous pas en face d’un “object” viewer ?
C’est vraiment top pour débugger.

: Olivier GRIMBERT

Et je trouve les couleurs très chouettes !
in marshmallows we trust :lol:
A quand la version “éditeur”, en plus de “visualiseur” ? :slight_smile:
C’est parti d’un tout petit truc en texte qui aurait permis de l’envisager. Mais ça s’est avéré si lent que j’ai opté pour une listbox qui, outre le problème de vitesse, m’a permis 2-3 trucs marrants. En contrepartie, une listbox, pour éditer du texte, c’est moyen. Mais le plus gros écueil est qu’il s’agit d’un objet 4d converti en json, donc perte, et je ne vois pas trop comment faire “dans l’autre sens”. La petite grenouille ne veut pas se faire aussi grosse que le debogueur :wink:
Une question, pour visualiser un json, pourquoi tu fais cela
<code 4D>
$io.data:=JSON Parse(JSON Stringify(Form;*)) //pour les entity
selection

</code 4D>
au lieu de
<code 4D>
$io.data:=Form //pour les entity selection

</code 4D>
???

Il me semble qu’un l’objet contenant des entity selection donnait un json “décevant” et que ceci améliorait cela ; ou peut-être était-ce pour les pointeurs, malgré ce que dit le commentaire. Tu as testé avec une référence d’entity dans Form ?

Note du vendredi : je confesse m’être furieusement excité sur les plieurs/déplieurs juste pour évacuer la frustration que j’éprouve avec ceux de l’éditeur de code qui, passée la v11 où c’était génial, n’ont plus jamais marché correctement.

Tiens ?
Pour moi, les plieurs déplieurs fonctionnent bien, pourtant…
Le seul truc que je trouve bête : tu indiques la hiérarchie en indiquant la colonne concernée, ben si elle est en deuxième position, ça merde ! Trouvez l’erreur…

Par contre, je me permets une remarque sur ton code et les objets…

Dans ta méthode principale “JsonViewer_mng”, à chaque fois que tu fais ton “case of” sur un objet, ta façon montre soit une incompréhension, soit que tu t’en fiche :slight_smile: ?

<code 4D>
Case of //main
: ($io.action=“processNew”) // Et tous les autres qui suivent

</code 4D>

Car pour chaque $io.action :

  • action est stocké en mémoire comme clef d’accès ! Ca fait grossir le code.
    La notation objet fait croire que le compilateur va coder ça par un offset mais non, cela stocke une string de la clef.
  • qui dit string, dit recherche ! Ce n’est pas un accès par pointeur qui se fera, mais bien une recherche dans une table des labels de properties. Ca prend du temps, même si cela est négligeable, en cas de grosses boucles il vaut mieux prendre un raccourci.

Dans ton cas, c’est judicieux de faire :

<code 4D>
$action:=$io.action
Case of //main
: ($action=“processNew”) // Et tous les autres qui suivent

</code 4D>

Disons que cela m’est prétexte pour expliquer un peu sur les objets, ne pas oublier qu’il s’agit d’une sorte de database encapsulée dans une variable ou un champ 4D.

De même pour l’usage (super !) d’objets d’interface par leur nom, sans variable process.
Faire
OBJECT Get name(Object with focus)=“searchBox”)
C’est une recherche à chaque fois dans le formulaire sur une string !
Et cela stocke la string aussi dans le code. Aussi, en général, je préfère me mettre tous les pointeurs d’un coup au début de la méthode, surtout pour ceux utilisés une peu partout, et laisser les cas individuels dans l’usage.
Genre :

<code 4D>
C_POINTER($ptr_LB)
$ptr_LB:=OBJECT Get pointer(Object named;“LB_PLA_visu”)

C_POINTER($ptr_LB_dayTxt;$ptr_LB_date;$ptr_LB_noSlot;$ptr_LB_slotTxt;$ptr_LB_isOk;$ptr_LB_isOkImg)
$ptr_LB_dayTxt:=OBJECT Get pointer(Object named;“lb_pla_dayTxt”)
$ptr_LB_dayImg:=OBJECT Get pointer(Object named;“lb_pla_dayImg”)
$ptr_LB_date:=OBJECT Get pointer(Object named;“lb_pla_date”)
$ptr_LB_noSlot:=OBJECT Get pointer(Object named;“lb_pla_noSlot”)
$ptr_LB_slotTxt:=OBJECT Get pointer(Object named;“lb_pla_slotTxt”)
$ptr_LB_isOk:=OBJECT Get pointer(Object named;“lb_pla_isOk”)
$ptr_LB_isOkImg:=OBJECT Get pointer(Object named;“lb_pla_isOkImg”)

</code 4D>

Et après, ceci étant fait, ton code n’est plus que sur des pointeurs en variables locales, et c’est plus facile à lire :wink:
C’est un échange, je ne donne pas de leçon ou quoi que ce soit !!

: Olivier GRIMBERT

Tiens ?
Pour moi, les plieurs déplieurs fonctionnent bien, pourtant…
Regarde comment BBEdit plie les “enfants” avec alt :

  • alt+clic sur un “fold” non plié -> plie le fold et tous les enfants
  • alt+clic sur un “fold” plié -> déplie le fold et tous les enfants
    Puis dans 4D (v17r3) : ça marche sur le 1er niveau d’indentation mais sur les niveaux supérieurs ça part en sucette. Il faut beaucoup de fluor pour compenser v12 13 14 15 16 17 à se taper des sucettes. Le pliage des “frères” (majuscule+clic) est un apport perso, pas vu ailleurs mais je trouve ça pratique.
    (je te répondrai plus tard sur le reste, chuis pris)