Et Javascript alors !!!???

[Fraid]

He Bonjour,

 

Pourquoi ce langage implanté dans Autocad depuis la version 2014 n'est toujours pas utilisé ou si peux?

Après quelque recherches, nous trouvons rapidement quelques réponses.

- Tutoriel minable, rien ne fonctionne en l’état.

- Documentation sans exemple et contenant des erreurs

- Nombreux pré-requis : HTML, CSS, Javascript, bien connaitre Autocad, connaitre un langage orienté objet (C++,c#,Java...), un Framework CSS comme Bootstrap est un plus.

 

Pourtant, comme nous allons voir plus loin, il offre des outils intéressants, simples à mettre en place.

 

Aucune installation n'est nécessaire pour débuter et mes test son effectués sur 2015 (V2 de Javascript).

 

Commençons traditionnellement avec l'affichage d'"Hello_world".

 

le code javascript à enregistrer dans hw.js en UTF-8 dans un dossier approuvé par Autocad.

alert('Hello, world!');

 

 

Vous taper WEBLOAD dans Autocad, valider charger puis indiquer le chemin du .js comme cela c:/votre chemin/hw.js

 

Maintenant que nous savons que Javascript fonctionne dans Autocad, testons quelques fonctions de l'API.

Restons avec Hello, World, que nous allons afficher dans une page html modal.

 

Modifions le hw.js

 

Acad.Application.showModalDialog('c:/votre chemin/hw.html');

 

 

puis créons hw.html à coté, toujours en UTF-8

 

<p>Hello, World!!</P>

 

 

on charge avec WEBLOAD.

 

Et hopopop, cela fonctionne aussi.

 

Nous n'avons pas encore utilisé Autodesk.AutoCAD.js.

C'est normal, nous travaillons dans 2 D.O.M. différents, Autocad et un navigateur Internet (c'est Chromium qui à été choisi)

Dans Autocad l'API est implémenté, dans Chromium il faut l'appeler avec ceci dans le HEAD de la page.

 

<script src="https://df-prod.autocad360.com/jsapi/v2/Autodesk.AutoCAD.js" </script>

 

 

Il existe 4 versions de cette API

- V1 pour 2014

- V2 pour 2015

- V3 2016 à 2022

- V4 2023 et plus

il y a juste à changer le numéro au niveau de l'adresse.

 

Continuons dans Autocad avec Acad.Application.activedocument.addPalette

 

Acad.Application.activedocument.addPalette('HW', 'c:/votre chemin/hw.html');

 

 

et gardons la même page.

 

Et ben la, cela ne fonctionne pas 😮

 

Beaucoup, me semble t'il, se sont arrêté la.

 

Mais si on regarde bien, une palette n'a rien a faire dans le document actif.

Essayons plutôt

 

Acad.Application.addPalette('HW', 'c:/votre chemin/hw.html');

 

 

Et la, miracle, la page apparaît dans une nouvelle palette 😄

 

Voila, il faut bidouiller, mettre les mains dans le cambouis...

 

Je vais m’arrêter là pour l'instant, et vous raconterais mes aventures dans le DOM de chrome dans une palette Autocad.

Modifié le 31 juillet 2023 par Fraid
Nouvelle version avec Autocad 2023

[Goldorak44]

Super initiative Fraid.

Je vien de me mettre au Javascript egalement pour utiliser le "design automation" avec Autocad et Revit dans Forge !!

????

[Fraid]

Pourquoi coder dans une page internet placer dans une palette?

Pour réaliser une super interface utilisateur.Tout simplement.

 

Pourquoi ne pas travailler directement dans Autocad?

Car les autres langages présents, le font déjà très bien.

 

Nous allons donc pour continuer, rester dans une palette.

Testons comment réagissent les pages une fois "dedans".

test.js

Acad.Application.addPalette('Google', 'https://www.google.com');

 

La page s'affiche bien, mais le format de la palette n'est pas pris en compte...

 

Par contre avec le site de Bootstrap

Acad.Application.addPalette('bootstrap', 'https://getbootstrap.com');

 

Aucun soucis, il est effectivement responsive (s'adapte à tout les formats).

 

C'est donc ce genre de technologie Web qu'il faut mettre en place pour éviter de se prendre la tête avec le format de la palette.

 

C'est un peux le pré-requis de trop, 2 ans que j'y suis...j'ai la tête dure....

Pas dans bootstrap, mais dans l'ensemble avec php en +.

 

Je vous prépare donc un squelette html responsive pour réaliser une IU personnalisable à souhait.

 

et bon courage à toi Goldorack

[(gile)]

Pourquoi ce langage implanté dans Autocad depuis la version 2014 n'est toujours pas utilisé ou si peux?

 

Je pense que l'apprentissage de JavaScript pour AutoCAD (avec tous handicaps que tu décris) n'est pas vraiment beaucoup plus simple que celui de .NET (C#) et .NET est tellement plus puissant.

[Fraid]

He coucou

 

Oui, je suis d'accord avec toi, mais l'aventure informatique, vaut la peine d’être racontée.

[Fraid]

Avant de se lancer dans notre première page "palettienne", il faut rappeler quelques détails.

Tout les fichiers textes (html, css, js) doivent être enregistrer en UTF-8.

L'utilisation de notepad++ ou similaire est conseillé.

 

Du coup, si vous voulez les écrire en LISP, il faut utiliser une fonction comme celle ci de Gile.

 

;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; gc:WriteStream
;; Ecrit un texte dans un fichier suivant l'encodage de caractère spécifié
;; Retourne le chemin du fichier ou nil si l'opération a échoué.
;;
;; Arguments
;; text     : le texte à écrire
;; filename : le chemin du ficher
;; charset  : le système d'encodage (exemples : "iso-8859-1" (ascii/ANSI), "utf-8", "unicode")
(defun gc:WriteStream (text filename charset / stream result)
 (vl-load-com)
 (if (setq stream (vlax-create-object "ADODB.Stream"))
   (progn
     (setq result
            (vl-catch-all-apply
              (function
                (lambda ()
                  (vlax-put stream 'Charset charset)
                  (vlax-invoke stream 'Open)
                  (vlax-invoke stream 'WriteText text 0)
                  (vlax-invoke stream 'SaveToFile filename 2)
                  (vlax-invoke stream 'Close)
                )
              )
            )
     )
     (vlax-release-object stream)
     (if (not (vl-catch-all-error-p result))
       filename
     )
   )
 )
)

 

C'est une page locale, nous l'enregistrons dans un dossier approuvé par Autocad.

 

D'après la doc, il faut modifier la variable Autocad TRUSTEDDOMAINS en ajoutant ce dossier de cette manière *.mondossier*

Pour TRUSTEDPATHS, cela pourrais avoir des conséquences, car malgré le s, il semble que l'on puisse n'en mettre qu'un seul...

dans le doute n’hésiter pas à créer un nouvel utilisateur spécialement pour les expérimentations.

[DenisHen]

Salut.

 

Très enthousiaste pour apprendre une nouvelle langue de codage, j'hésitais entre le .NET et le C#.

 

Maintenant, je dois aussi pensé au Java... Merci Fraid... ;)

 

Mais comment choisir :

- la facilité du langage, (proche d'un autre VB, VBA, Lisp (j'en doute)...)

- son intégration dans AutoCAD,

- sa pérennité,

- avec quel environnement coder, (visual, VBA...)

- sa distributivité... (package à installer, fichiers sources...)

 

Et j'en passe...

 

En plus, je vois du "ADODB" dans le code de Maître (gile)... Je ne comprend pas ce qu'il vient faire là... :huh:

 

Mais le sujet reste très intéressant... Merci Fraid... ;)

[Fraid]

Bonjour DenisHen,

 

Maintenant, je dois aussi pensé au Java...

 

Attention, Java et Javascript n'on pas grand chose en commun hormis, quelque peux la syntaxe et le fait qu'ils soient orientés objet.

Javascript est forcément "embarqué" et Java est autonome.

 

Si vous voulez mieux connaitre Javascript les cours de chez w3C sont sympa.

[(gile)]

Si on fait de la programmation Web côté client, JavaScript est incontournable, donc, si on a une bonne connaissance de ce langage (impératif vu le nombre d'incohérences dont il regorge*) il peut être envisageable de l'utiliser dans AutoCAD, sinon, je dirais qu'il vaut mieux éviter et se tourner vers un environnement plus robuste et plus polyvalent comme .NET.

 

* JavaScript est "le langage de programmation le plus détesté" avec une certaine constance depuis plusieurs années. Cet article explique plus en détail pourquoi.

[(gile)]

Très enthousiaste pour apprendre une nouvelle langue de codage, j'hésitais entre le .NET et le C#.

.NET est une plateforme de programmation qui regroupe un ensemble de produits et de technologies (Framework, CLR, etc). C# est un des langages supportés par .NET c'est en fait le langage créé spécifiquement pour .NET (VB .NET est une adaptation du Visual Basic à .NET).

 

En plus, je vois du "ADODB" dans le code de Maître (gile)... Je ne comprend pas ce qu'il vient faire là... :huh:

L'utilisation d'un ActiveX ADODB permet de créer un flux (stream) pour écrire dans un fichier texte avec d'autres encodages de caractères que l'ASCII (le seul supporté en AutoLISP classique).

[Fraid]

Pour compléter, les Streams sont des flux d'octets, comme dans tes câbles réseaux.

Quand tu fais une requête dans ton navigateur pour recevoir une page internet, tu envois un flux au serveur, qui l’interprète, fait sa cuisine, puis te renvois un autre flux que ton navigateur va interpréter en page.

Ici c'est plus simple, on transforme un texte en flux que l'on interprète aussitôt.

Comme pour interprété un flux en texte il faut un encodage, on en profite pour le changer.

[Fraid]

Personne n'a vu la boulette que j'ai fait dans le 1er post, ce n'est pas Chrome, mais Chromium, qui est utilisé comme navigateur.

Chrome est la version Google de Chromium.

C'est un détail qui a quand même son importance puisque on auras forcement un moment ou un autre un problème de compatibilité CSS et/ou Javascript.

 

Si j'ouvre le gestionnaire des tâches de windows quand il y une page ouverte dans Autocad, dans l'onglet Processus je vois bien Chromium en action, clic droit/Propriété/Détails me donne sa version, ici 2.0 sur 2015.

 

Et vous?

 

Ce numéro de version ne correspond à rien quand on va sur le Site Officiel

 

J'imagine donc que c'est une version spécial Autodesk.

 

Mais vous verrez, il y a une aide intégrée pour nous aider à surmonter cela.

[DenisHen]

Salut Fraid.

 

Pour AutoCAD MAP 2017, j'ai une version Chromium 2.0.1.0, copyright 2015 Autodesk,

Pour AutoCAD MAP 2019, j'ai une version Chromium 2.0.5.2, copyright 2017 Autodesk.

[Fraid]

Merci Denis,

 

Les pages risquent donc de ne pas être compatible avec tout les Autocads...

On verras bien, je n'ai pas encore fait de testes dans ce sens, on les feras ensembles.

 

Pour faire notre page test, il faut s'organiser un minimum.

Créer un dossier dans un emplacement approuvé.

Ici je l'appel pagpal

et dans ce dossier créer 2 dossiers

css

js

le tout en minuscule

 

dans js il faut télécharger les ressources nécessaires plutôt que de mettre des liens puisque nous sommes en local.

L'API Autocad

V1 pour 2014

V2 pour 2015

V3 pour la suite

 

Bootstrap

maintenant c'est la 4.3

Télécharger sur ce site le Compiled CSS and JS.

le décompresser puis placer les fichiers dans vos dossier correspondant.

 

JQUERY , Framework Javascript indispensable à bootstrap

sur ce site, choisissez the compressed, production

[Fraid]

Pour des raisons pratiques il faut mieux créer un domaine de noms.

Ici, tout les fichiers créer devront commencer par pp (sauf index.html)

 

Le squelette index.html à enregistrer dans le dossier pagepal (à coté des dossiers css et js)

<!DOCTYPE HTML>
<html lang="fr">
<head>
   <title>PagePal</title>
   <meta http-equiv="content-type" content="text/html; charset=utf-8">
   <link href="../css/bootstrap.css" rel="stylesheet">
   <link href="../css/ppStyle.css" rel="stylesheet">
</head>
<body>
   <div class="container">
       <header class="row">
       <div class="col-lg-12" id="titre">
         <h1 class="bg-primary text-white text-center"><strong>pagPal</strong></h1>
       </div>
       </header>
       <section class="row">
       </section>
       <footer class="row">
       </footer>
   </div>
   <script src="../js/Autodesk.AutoCAD.js"></script>
   <script src="../js/jquery.min.js"></script>
   <script src="../js/bootstrap.min.js"></script>
</body>
</html> 

 

le CSS ppStyle.css à placer dans css

[class*="col"] { margin-bottom: 20px; }

body { 
 margin-top: 5px;
}

.container {
 padding-right: 15px;
 padding-left: 15px;
 margin-right: auto;
 margin-left: auto;
}

@media (min-width: 768px) {
 .container {
   width: 750px;
 }
}

@media (min-width: 992px) {
 .container {
   width: 980px;
 }
}

@media (min-width: 1200px) {
 .container {
   width: 1170px;
 }
}

[Fraid]

on charge la page comme plus haut.

 

Arff, cela fonctionne mais ce n'est pas beau...

 

J'ai volontairement mis une erreur et nous allons debugguer ensemble.

cliquez sur votre page et F12

 

Tada!! Le voila notre botte secrète.

 

cliquer sur l'icone en bas à gauche.

la console s'ouvre et toutes les erreurs sont claires.

il manque un dossier dans le chemin des ressources.

il suffit de retourné dans l'index et supprimer un point avant chaque liens,

et renommer le jquery en

 <script src="./js/jquery-3.4.1.min.js"></script>

celle la je ne l'ai pas fait exprès...

 

Le developer tools est indispensable, il y beaucoup de chose à explorer.