[R] Autoit & CSS

Hugues · #1

Bonjour,

Je voudrais faire un treeview en css dans une page HTML à partir d'un fichier XML.

Voici ce que je voudrais obtenir: http://www.bypeople.com/pure-css-tree-m ... k-cssdeck/

Je n'arrive pas à afficher les traits de liaison entre items et sous items...

Merci par avance pour votre aide.

Voici mon code:

► Afficher le texte

Code : Tout sélectionner

#include <Array.au3>
#include <IE.au3>

Global $oIE, $sHTML
$oXmlDoc = ObjCreate('Msxml2.DOMDocument.6.0')
$oXmlDoc.load(@ScriptDir & "\monfichier.xml")

If $oXmlDoc.parseError.errorCode <> 0 Then
    $oErr = $oXmlDoc.parseError
    ConsoleWriteError($oErr.reason & @CRLF)
    MsgBox(16, "XML Error", $oErr.reason & @CRLF & "Sortie du programme")
    Exit 1
EndIf

_HTMLSheet()
$oRoot = $oXmlDoc.documentElement
_childNodes($oRoot)
_IEBodyWriteHTML($oIE, $sHTML)

Func _childNodes($oNode)
    $iLength = $oNode.childNodes.length

    If $iLength Then
        $sHTML &= '<ul class="tree">' & @CRLF
        For $i = 0 To $iLength - 1
            $sHTML &= '<li>' & $oNode.childNodes.item($i).getAttribute('name') & ": " & $oNode.childNodes.item($i).getAttribute('Value') & $oNode.childNodes.item($i).getAttribute('ValPair') & " " & $oNode.childNodes.item($i).getAttribute('DispUnitConverter') & '</li>' & @CRLF
            _childNodes($oNode.childNodes.item($i))
        Next
        $sHTML &= '</ul>' & @CRLF
    EndIf
EndFunc   ;==>_childNodes

Func _HTMLSheet()
    $oIE = _IECreate()
    $hwndIE = _IEPropertyGet ($oIE, "hwnd")
    $oBody = _IETagNameGetCollection($oIE, "body", 0)
    $sHTML = @CRLF & "<!DOCTYPE HTML PUBLIC " & Chr(34) & "-//W3C//DTD HTML 4.01 Transitional//EN" & Chr(34) & @CRLF & @TAB & @TAB & Chr(34) & "http://www.w3.org/TR/html4/loose.dtd" & Chr(34) & ">" & @CRLF
    $sHTML &= "<html>" & @CRLF
    $sHTML &= "<head>" & @CRLF
    $sHTML &= "  <meta http-equiv=" & Chr(34) & "Content-Type" & Chr(34) & " content=" & Chr(34) & "text/html" & ";" & " charset=ISO-8859-1" & Chr(34) & ">" & @CRLF
    $sHTML &= "<style type=" & Chr(34) & "text/css" & Chr(34) & ">" & @CRLF
    $sHTML &= "body {font-size:10pt; font-weight:normal; font-family:monospace,arial,sans-serif;height: 100%; }" & @CRLF

    $sHTML &= ".tree, " & @CRLF
    $sHTML &= ".tree ul { " & @CRLF
    $sHTML &= "  margin:0 0 0 1em; /* indentation */ " & @CRLF
    $sHTML &= "  padding:0; " & @CRLF
    $sHTML &= "  list-style:none; " & @CRLF
    $sHTML &= "  color: dark-blue; " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree ul {margin-left:.5em} /* (indentation/2) */ " & @CRLF
    $sHTML &= ".tree:before, " & @CRLF
    $sHTML &= ".tree ul:before { " & @CRLF
    $sHTML &= "  content:""; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:0; " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:0; " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "  border-left:1px solid; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li { " & @CRLF
    $sHTML &= "  margin:0; " & @CRLF
    $sHTML &= "  padding:0 1.5em; /* indentation + .5em */ " & @CRLF
    $sHTML &= "  line-height:2em; /* default list item's `line-height` */ " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:before { " & @CRLF
    $sHTML &= "  content:""; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:10px; /* same with indentation */ " & @CRLF
    $sHTML &= "  height:0; " & @CRLF
    $sHTML &= "  border-top:1px solid; " & @CRLF
    $sHTML &= "  margin-top:-1px; /* border top width */ " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:last-child:before { " & @CRLF
    $sHTML &= "  background:white; /* same with body background */ " & @CRLF
    $sHTML &= "  height:auto; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= "</style>" & @CRLF
    $sHTML &= "</head>" & @CRLF
EndFunc

#2

Je suis peut-être hors sujet, mais j'ai une fonction qui sait faire ça:

├───Grand papy
│ ├───papy,mamy
│ │ ├───papa,maman
│ │ │ ├───MOI,mon épouse,mon chien,mon chat
│ │ │ │ ├───mon fils
│ │ │ │ └───ma fille
│ │ │ ├───ma soeur
│ │ │ │ └───mon neuveu
│ │ │ └───mon frère
│ │ │ └───ma nièce
│ │ │ ├───son bébé
│ │ │ └───son jumeau
│ │ └───tonton,tata
│ │ ├───mon cousin
│ │ └───ma cousine
│ │ └───elle n'a qu'un fils qui est né le mois dernier
│ └───soeur de papy
└───Soeur de Grand Papy

en parfait bien sur!
Elle prend en paramètre un treeview/autoit3 même avec plusieurs racines (comme ci dessus) et elle crée un fichier texte semi-graphique au même format que celui créé par la commande:
tree c:\ >arbre.txt

Pour en faire du code html, ça me semble simple.
Si vous avez résolu la conversion: XML ----> Treeview.
je me charge de TreeView ---->html

Hugues · #3

Bon, j'avance à petits pas ^^,

Je vais suivre ton conseil mdanielm. J'écris dans un fichier avec une extention "*.html". Et là je me rend compte qu'en fait la conversion XML en TreeView n'est pas tou à fait correct...

La première partie est affichée correctement, mais après j'ai un soucis avec les balises <ul></ul>....

Ci joint mon code:

► Afficher le texte

Code : Tout sélectionner

#include <Array.au3>
#include <IE.au3>

Global $oIE, $sHTML
$oXmlDoc = ObjCreate('Msxml2.DOMDocument.6.0')
$oXmlDoc.load(@ScriptDir & "\xml\0265244988-00")

If $oXmlDoc.parseError.errorCode <> 0 Then
    $oErr = $oXmlDoc.parseError
    ConsoleWriteError($oErr.reason & @CRLF)
    MsgBox(16, "XML Error", $oErr.reason & @CRLF & "Sortie du programme")
    Exit 1
EndIf

_HTMLSheet()
$sHTML &= '<div>' & @CRLF
$sHTML &= '<ul class="tree">' & @CRLF
$oRoot = $oXmlDoc.documentElement

_childNodes($oRoot)
$sHTML &= '</div>' & @CRLF
_IEBodyWriteHTML($oIE, $sHTML)
FileWrite(@ScriptDir & "\txt\Tree.html", $sHTML)
Func _childNodes($oNode)
    $iLength = $oNode.childNodes.length
    ;sHTML &= '<ul class="tree">' & @CRLF
    If $iLength Then
        $sHTML &= '<ul>' & @CRLF
        For $i = 0 To $iLength - 1
            $sHTML &= '<li>' & $oNode.childNodes.item($i).getAttribute('name') & ": " & $oNode.childNodes.item($i).getAttribute('Value') & $oNode.childNodes.item($i).getAttribute('ValPair') & " " & $oNode.childNodes.item($i).getAttribute('DispUnitConverter') & '</li>' & @CRLF
            _childNodes($oNode.childNodes.item($i))
        Next
        $sHTML &= '</ul>' & @CRLF
    EndIf
    $sHTML &= '</ul>' & @CRLF
EndFunc   ;==>_childNodes

Func _HTMLSheet()
    ;$oIE = _IECreate()
    ;$hwndIE = _IEPropertyGet ($oIE, "hwnd")
    ;$oBody = _IETagNameGetCollection($oIE, "body", 0)
    $sHTML =  "<!DOCTYPE HTML PUBLIC " & Chr(34) & "-//W3C//DTD HTML 4.01 Transitional//EN" & Chr(34) & @CRLF & @TAB & @TAB & Chr(34) & "http://www.w3.org/TR/html4/loose.dtd" & Chr(34) & ">" & @CRLF
    $sHTML &= "<html>" & @CRLF
    $sHTML &= "<head>" & @CRLF
    $sHTML &= "  <meta http-equiv=" & Chr(34) & "Content-Type" & Chr(34) & " content=" & Chr(34) & "text/html" & ";" & " charset=ISO-8859-1" & Chr(34) & ">" & @CRLF
    $sHTML &= "<style type=" & Chr(34) & "text/css" & Chr(34) & ">" & @CRLF
    $sHTML &= "body {font-size:10pt; font-weight:normal; font-family:monospace,arial,sans-serif;height: 100%; }" & @CRLF

    $sHTML &= ".tree, " & @CRLF
    $sHTML &= ".tree ul { " & @CRLF
    $sHTML &= "  margin:0 0 0 1em; /* indentation */ " & @CRLF
    $sHTML &= "  padding:0; " & @CRLF
    $sHTML &= "  list-style:none; " & @CRLF
    $sHTML &= "  color: dark-blue; " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree ul {margin-left:.5em} /* (indentation/2) */ " & @CRLF
    $sHTML &= ".tree:before, " & @CRLF
    $sHTML &= ".tree ul:before { " & @CRLF
    $sHTML &= "  content:""; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:0; " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:0; " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "  border-left:1px solid; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li { " & @CRLF
    $sHTML &= "  margin:0; " & @CRLF
    $sHTML &= "  padding:0 1.5em; /* indentation + .5em */ " & @CRLF
    $sHTML &= "  line-height:2em; /* default list item's `line-height` */ " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:before { " & @CRLF
    $sHTML &= "  content:""; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:10px; /* same with indentation */ " & @CRLF
    $sHTML &= "  height:0; " & @CRLF
    $sHTML &= "  border-top:1px solid; " & @CRLF
    $sHTML &= "  margin-top:-1px; /* border top width */ " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:last-child:before { " & @CRLF
    $sHTML &= "  background:white; /* same with body background */ " & @CRLF
    $sHTML &= "  height:auto; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= "</style>" & @CRLF
    $sHTML &= "</head>" & @CRLF
EndFunc

Hugues · #4

Bon sujet résolu ^^

Merci pour votre aide et conseil ^^

ci joint mon code:

► Afficher le texte

Code : Tout sélectionner

;#include <_XMLDOMWrapper.au3>
#include <Array.au3>
#include <IE.au3>

Global $oIE, $sHTML
$oXmlDoc = ObjCreate('Msxml2.DOMDocument.6.0')
$oXmlDoc.load(@ScriptDir & "\xml\test")

If $oXmlDoc.parseError.errorCode <> 0 Then
    $oErr = $oXmlDoc.parseError
    ConsoleWriteError($oErr.reason & @CRLF)
    MsgBox(16, "XML Error", $oErr.reason & @CRLF & "Sortie du programme")
    Exit 1
EndIf

_HTMLSheet()
$sHTML &= '<ul class="tree">' & @CRLF
$oRoot = $oXmlDoc.documentElement
_childNodes($oRoot)
_IEBodyWriteHTML($oIE, $sHTML)
FileWrite(@ScriptDir & "\txt\Tree2.html", $sHTML)

Func _childNodes($oNode)
    $iLength = $oNode.childNodes.length

    If $iLength Then
        $sHTML &= '<ul>' & @CRLF
        For $i = 0 To $iLength - 1
            $sHTML &= '<li>' & $oNode.childNodes.item($i).nodeName & '</li>' & @CRLF
            _childNodes($oNode.childNodes.item($i))
        Next
        $sHTML &= '</ul>' & @CRLF
    EndIf
EndFunc   ;==>_childNodes

Func _HTMLSheet()
    $sHTML =  "<!DOCTYPE HTML PUBLIC " & Chr(34) & "-//W3C//DTD HTML 4.01 Transitional//EN" & Chr(34) & @CRLF & @TAB & @TAB & Chr(34) & "http://www.w3.org/TR/html4/loose.dtd" & Chr(34) & ">" & @CRLF
    $sHTML &= "<html>" & @CRLF
    $sHTML &= "<head>" & @CRLF
    $sHTML &= "  <meta http-equiv=" & Chr(34) & "Content-Type" & Chr(34) & " content=" & Chr(34) & "text/html" & ";" & " charset=ISO-8859-1" & Chr(34) & ">" & @CRLF
    $sHTML &= "<style type=" & Chr(34) & "text/css" & Chr(34) & ">" & @CRLF
    $sHTML &= "body {font-size:10pt; font-weight:normal; font-family:monospace,arial,sans-serif;height: 100%; }" & @CRLF
    $sHTML &= ".tree, " & @CRLF
    $sHTML &= ".tree ul { " & @CRLF
    $sHTML &= "  margin:0 0 0 1em; /* indentation */ " & @CRLF
    $sHTML &= "  padding:0; " & @CRLF
    $sHTML &= "  list-style:none; " & @CRLF
    $sHTML &= "  color: dark-blue; " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree ul {margin-left:.5em} /* (indentation/2) */ " & @CRLF
    $sHTML &= ".tree:before, " & @CRLF
    $sHTML &= ".tree ul:before { " & @CRLF
    $sHTML &= "  content:" & Chr(34)& Chr(34) & "; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:0; " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:0; " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "  border-left:1px solid; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li { " & @CRLF
    $sHTML &= "  margin:0; " & @CRLF
    $sHTML &= "  padding:0 1.5em; /* indentation + .5em */ " & @CRLF
    $sHTML &= "  line-height:2em; /* default list item's `line-height` */ " & @CRLF
    $sHTML &= "  position:relative; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:before { " & @CRLF
    $sHTML &= "  content:" & Chr(34)& Chr(34) & "; " & @CRLF
    $sHTML &= "  display:block; " & @CRLF
    $sHTML &= "  width:10px; /* same with indentation */ " & @CRLF
    $sHTML &= "  height:0; " & @CRLF
    $sHTML &= "  border-top:1px solid; " & @CRLF
    $sHTML &= "  margin-top:-1px; /* border top width */ " & @CRLF
    $sHTML &= "  position:absolute; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  left:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= @CRLF
    $sHTML &= ".tree li:last-child:before { " & @CRLF
    $sHTML &= "  background:white; /* same with body background */ " & @CRLF
    $sHTML &= "  height:auto; " & @CRLF
    $sHTML &= "  top:1em; /* (line-height/2) */ " & @CRLF
    $sHTML &= "  bottom:0; " & @CRLF
    $sHTML &= "} " & @CRLF
    $sHTML &= "</style>" & @CRLF
    $sHTML &= "</head>" & @CRLF
    $sHTML &= "</head>" & @CRLF
EndFunc

AutoIt Français

[R] Autoit & CSS

[R] Autoit & CSS

Re: [..] Autoit & CSS

Re: [..] Autoit & CSS

Re: [..] Autoit & CSS