diff --git a/css/global/expanded.css b/css/global/expanded.css index 0707f65..2dd7496 100644 --- a/css/global/expanded.css +++ b/css/global/expanded.css @@ -279,6 +279,7 @@ /* (10) Gestion des espacements verticaux */ /* (11) Gestion des custom */\n\t& select{\n\t width: auto;\n\t display: inline-block;\n\t background: transparent;\n\t border: 0;\n\n\t // Hides right arrow\n\t -webkit-appearance: none;\n\t -moz-appearance: none;\n\t text-indent: 1px;\n\t text-overflow: '';\n\t font-size: .9em;\n\n\t\t& option:not(:disabled){\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\t& option:disabled:not(:first-child){\n\t\t\tfont-size: 1.2em;\n\t\t\tcolor: #000;\n\t\t\tfont-weight: bold;\n\t\t}\n\n\t\t& option.pad{\n\t\t\tpadding-left: 2.5em;\n\t\t}\n\t}\n\n\t& .select-container select{\n\t // width: auto;\n\t display: inline-block;\n\t padding: 2px;\n\t padding-right: 30px;\n\n\t\tborder: none;\n\t border-bottom: 1px solid #333;\n\n\t background: #fff url('/f/svg/bottom_arrow/st/container/333333') right 10px center no-repeat;\n\t background-size: 10px auto;\n\n\t overflow: hidden;\n\n\t\t// Animation de @focus\n\t\t&:focus{\n\t\t\tborder-color: $timeline-2;\n\t\t\tbackground-image:url('/f/svg/bottom_arrow/st/container/#{color-str($timeline-2)}');\n\t\t}\n\n\t}\n\n\t/* (12) Gestion des coloris pour les titres */\n\t& h5.color0,\n\t& h4.color0,\n\t& h3.color0{\n\t\tcolor: $timeline-0;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-0;\n\t\t}\n\t}\n\n\t& h5.color1,\n\t& h4.color1,\n\t& h3.color1{\n\t\tcolor: $timeline-1;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-1;\n\t\t}\n\t}\n\n\t& h5.color2,\n\t& h4.color2,\n\t& h3.color2{\n\t\tcolor: $timeline-2;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-2;\n\t\t}\n\t}\n\n\t& h5.color3,\n\t& h4.color3,\n\t& h3.color3{\n\t\tcolor: $timeline-3;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-3;\n\t\t}\n\t}\n\n\t& h5.color4,\n\t& h4.color4,\n\t& h3.color4{\n\t\tcolor: $timeline-4;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-4;\n\t\t}\n\t}\n\n\n}\n" + "@import 'constants';\n\n/* [1] Formulaire de type timeline\n=========================================================*/\n#WRAPPER > #CONTAINER section[data-timeline]{\n\tdisplay: block;\n\tposition: relative;\n\n\tbackground-color: #fff;\n\n\tfont-size: .9em;\n\tcolor: #000;\n\n\t/* (1) On ajoute le liseré à droite pour TOUS les éléments */\n\t& h5,\n\t& h4,\n\t& h3,\n\t& *.line{\n\t\tdisplay: block;\n\n\t\tcolor: #333;\n\n\t\tmargin: 0 40px;\n\t\tpadding: 5px 60px;\n\n border-left: 2px solid #d8e0e9;\n\n\t}\n\n\n\t/* (2) Titres de sections */\n\t& h3{\n\t\tdisplay: block;\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.4em;\n\t\tcolor: #000;\n\t\tfont-weight: bold;\n\n // background-color: $timeline-color;\n\n\t\t/* TODO: Transformer les background en ::before pour que ca soit juste un cercle avec bg et border*/\n\t\t/* FIXME: Corriger le liseré pour les autres navigateurs que FF*/\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&[data-n]:before{\n content: attr(data-n);\n\n display: inline-block;\n position: absolute;\n margin-top: .6em;\n margin-left: -41px;\n padding: 3px 12px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 3px #fff;\n\n background-color: $timeline-color;\n\n\t\t\tfont-size: 1.3em;\n\t\t\tcolor: #fff;\n\t\t\tfont-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\n\t\t}\n\t}\n\n\t/* (3) Titres des sous-sections */\n\t& h4{\n\t\tdisplay: block;\n\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.2em;\n\t\tcolor: darken($timeline-color, 20);\n\t\tfont-weight: bold;\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&[data-icon]:before{\n\t\t\tcontent: attr(data-icon);\n\n display: inline-block;\n position: absolute;\n margin-top: .9em;\n margin-left: -41px;\n padding: 9px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 2px #fff;\n\n background-color: $timeline-color;\n\n\t\t\tfont-size: .9em;\n\t\t\tfont-family: 'icomoon';\n\t\t\tcolor: #fff;\n\t\t\tfont-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\t\t}\n\t}\n\n\t/* (4) Titres genre text message */\n\t& h5{\n\t\tdisplay: block;\n\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.2em;\n\t\tcolor: darken($timeline-color, 20);\n\t\tfont-weight: bold;\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&:before{\n\t\t\tcontent: '';\n\n display: inline-block;\n position: absolute;\n margin-top: .7em;\n margin-left: -41px;\n padding: 7px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 2px #fff;\n\n background-color: $timeline-color;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\t\t}\n\n /* Texte genre text message*/\n &[data-text]:after{\n content: attr(data-text);\n padding: 6px 10px;\n\n border-radius: 3px;\n\n background: $timeline-color;\n\n color: #fff;\n font-weight: normal;\n }\n\t}\n\n\t/* (5) 'Tags' -> textes sur le liseré gauche */\n\t& [data-tag]{\n\t\tdisplay: block;\n\n\t\tpadding: 40px 60px;\n\n &:before{\n \t\tcontent: attr(data-tag);\n\n display: inline-block;\n position: absolute;\n margin-top: .5em;\n margin-left: -41px;\n padding: 2px;\n\n background-color: #fff;\n\n font-size: 1.2em;\n color: $timeline-color;\n font-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n }\n\t}\n\n /* (6) Input d'upload de fichier (css hack) */\n & input[type='file']{\n position: relative;\n opacity: 0;\n\n z-index: 8;\n\n cursor: pointer;\n\n }\n\n /* Contiendra l'input*/\n & input[type='file'] + span.file-input{\n display: inline-block;\n position: absolute;\n margin-top: -1px;\n margin-left: -290px;\n width: calc( 290px - 2*15px );\n height: 30px;\n\n padding: 0 15px;\n\n border-radius: 3px;\n background: $timeline-1;\n\n color: #222;\n line-height: 30px;\n font-weight: normal;\n\n z-index: 9;\n\n cursor: pointer;\n\n\t\tpointer-events: none;\n\n /* Icone d'upload*/\n &:before{\n content: 'e ';\n\n font-size: 1em;\n\t\t\tfont-family: 'icomoon';\n\t\t\tcolor: #222;\n\t\t\tfont-weight: bold;\n }\n\n\t\t@include transition( background .1s ease-in-out );\n }\n\n\n\t/* Animation de hover*/\n\t& input[type='file']:hover + span.file-input{\n\t\tbackground: darken($timeline-1, 10);\n\t\tbox-shadow: inset 0 0 5px #888;\n\t}\n\n\n\t/* Animation de .active*/\n\t& input[type='file'].active + span.file-input{\n\t\tbackground: $timeline-color;\n\t\tcolor: #fff;\n\t\t// On change l'icône\n\t\t&:before{\n content: 'v ';\n\t\t\tcolor: #fff;\n\t\t}\n\t}\n\n\t/* (7) Inputs de type text */\n\t& input[type='text'],\n\t& input[type='password'],\n\t& input[type='number'],\n\t& input[type='button'],\n\t& input[type='submit'],\n\t& input[type='mail']{\n\t\tdisplay: inline;\n\t\twidth: auto;\n\n\t\tmargin: unset;\n\t\tpadding: 5px 10px;\n\t\tmargin-bottom: 5px;\n\t\tmargin-right: 15px;\n\n\t\tborder-radius: 0;\n\t\tborder: 0;\n\t\tborder-bottom: 1px solid #555;\n\n\t\tfont-size: .8em;\n\t\tfont-weight: normal;\n\t\tcolor: #333;\n\n\t\t@include transition( border .2s ease-in-out, background .2s ease-in-out );\n\n\t\t/* Animation de @focus*/\n\t\t&:focus{\n\t\t\tborder-color: $timeline-2;\n\t\t}\n\t}\n\n\n\t& label{\n\t\tcolor: #555;\n\t}\n\n\t/* (8) Gestion des espacements */\n\t& [data-space]{\n\t\t@extend *.line;\n\n\t\tpadding-top: 20px;\n\t\tpadding-bottom: 20px;\n\t}\n\n\t/* (9)
sert uniquement à regrouper */\n\t& article{\n\t\tall: unset !important;\n\t}\n\n\t/* (10) Gestion des espacements verticaux */\n\t& .spacetop{ margin-top: 20px !important; }\n\t& .spacebtm{ margin-bottom: 20px !important; }\n\n\t& .spaced{\n\t\t@extend .spacetop;\n\t\t@extend .spacebtm;\n\t}\n\n\t& .nobold,\n\t& .nobold *{\n\t\tfont-weight: normal !important;\n\t}\n\n\t/* (11) Gestion des custom */\n\t& select{\n\t width: auto;\n\t display: inline-block;\n\t background: transparent;\n\t border: 0;\n\n\t // Hides right arrow\n\t -webkit-appearance: none;\n\t -moz-appearance: none;\n\t text-indent: 1px;\n\t text-overflow: '';\n\t font-size: .9em;\n\n\t\t& option:not(:disabled){\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\t& option:disabled:not(:first-child){\n\t\t\tfont-size: 1.2em;\n\t\t\tcolor: #000;\n\t\t\tfont-weight: bold;\n\t\t}\n\n\t\t& option.pad{\n\t\t\tpadding-left: 2.5em;\n\t\t}\n\t}\n\n\t& .select-container select{\n\t // width: auto;\n\t display: inline-block;\n\t padding: 2px;\n\t padding-right: 30px;\n\n\t\tborder: none;\n\t border-bottom: 1px solid #333;\n\n\t background: #fff url('/f/svg/bottom_arrow/st/container/333333') right 10px center no-repeat;\n\t background-size: 10px auto;\n\n\t overflow: hidden;\n\n\t\t// Animation de @focus\n\t\t&:focus{\n\t\t\tborder-color: $timeline-2;\n\t\t\tbackground-image:url('/f/svg/bottom_arrow/st/container/#{color-str($timeline-2)}');\n\t\t}\n\n\t}\n\n\t/* (12) Gestion des coloris pour les titres */\n\t& h5.color0,\n\t& h4.color0,\n\t& h3.color0{\n\t\tcolor: $timeline-0;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-0;\n\t\t}\n\t}\n\n\t& h5.color1,\n\t& h4.color1,\n\t& h3.color1{\n\t\tcolor: $timeline-1;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-1;\n\t\t}\n\t}\n\n\t& h5.color2,\n\t& h4.color2,\n\t& h3.color2{\n\t\tcolor: $timeline-2;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-2;\n\t\t}\n\t}\n\n\t& h5.color3,\n\t& h4.color3,\n\t& h3.color3{\n\t\tcolor: $timeline-3;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-3;\n\t\t}\n\t}\n\n\t& h5.color4,\n\t& h4.color4,\n\t& h3.color4{\n\t\tcolor: $timeline-4;\n\t\t&:before,&:after{\n\t\t\tbackground-color: $timeline-4;\n\t\t}\n\t}\n\n\n}\n" + "@import 'constants';\n\n/* [1] Formulaire de type timeline\n=========================================================*/\n#WRAPPER > #CONTAINER section[data-timeline]{\n\tdisplay: block;\n\tposition: relative;\n\n\tbackground-color: #fff;\n\n\tfont-size: .9em;\n\tcolor: #000;\n\n\t/* (1) On ajoute le liseré à droite pour TOUS les éléments */\n\t& h5,\n\t& h4,\n\t& h3,\n\t& *.line{\n\t\tdisplay: block;\n\n\t\tcolor: #333;\n\n\t\tmargin: 0 40px;\n\t\tpadding: 5px 60px;\n\n border-left: 2px solid #d8e0e9;\n\n\t}\n\n\n\t/* (2) Titres de sections */\n\t& h3{\n\t\tdisplay: block;\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.4em;\n\t\tcolor: #000;\n\t\tfont-weight: bold;\n\n // background-color: $timeline-color;\n\n\t\t/* TODO: Transformer les background en ::before pour que ca soit juste un cercle avec bg et border*/\n\t\t/* FIXME: Corriger le liseré pour les autres navigateurs que FF*/\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&[data-n]:before{\n content: attr(data-n);\n\n display: inline-block;\n position: absolute;\n margin-top: .6em;\n margin-left: -41px;\n padding: 3px 12px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 3px #fff;\n\n background-color: $timeline-color;\n\n\t\t\tfont-size: 1.3em;\n\t\t\tcolor: #fff;\n\t\t\tfont-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\n\t\t}\n\t}\n\n\t/* (3) Titres des sous-sections */\n\t& h4{\n\t\tdisplay: block;\n\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.2em;\n\t\tcolor: darken($timeline-color, 20);\n\t\tfont-weight: bold;\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&[data-icon]:before{\n\t\t\tcontent: attr(data-icon);\n\n display: inline-block;\n position: absolute;\n margin-top: .9em;\n margin-left: -41px;\n padding: 9px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 2px #fff;\n\n background-color: $timeline-color;\n\n\t\t\tfont-size: .9em;\n\t\t\tfont-family: 'icomoon';\n\t\t\tcolor: #fff;\n\t\t\tfont-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\t\t}\n\t}\n\n\t/* (4) Titres genre text message */\n\t& h5{\n\t\tdisplay: block;\n\n\t\tpadding: 20px 40px;\n\n\t\tfont-size: 1.2em;\n\t\tcolor: darken($timeline-color, 20);\n\t\tfont-weight: bold;\n\n\t\t/* Gestion du before (compteur css) //*/\n\t\t&:before{\n\t\t\tcontent: '';\n\n display: inline-block;\n position: absolute;\n margin-top: .7em;\n margin-left: -41px;\n padding: 7px;\n\n border-radius: 50%;\n /* Contour blanc*/\n box-shadow: 0 0 0 2px #fff;\n\n background-color: $timeline-color;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n\t\t}\n\n /* Texte genre text message*/\n &[data-text]:after{\n content: attr(data-text);\n padding: 6px 10px;\n\n border-radius: 3px;\n\n background: $timeline-color;\n\n color: #fff;\n font-weight: normal;\n }\n\t}\n\n\t/* (5) 'Tags' -> textes sur le liseré gauche */\n\t& [data-tag]{\n\t\tdisplay: block;\n\n\t\tpadding: 40px 60px;\n\n &:before{\n \t\tcontent: attr(data-tag);\n\n display: inline-block;\n position: absolute;\n margin-top: .5em;\n margin-left: -41px;\n padding: 2px;\n\n background-color: #fff;\n\n font-size: 1.2em;\n color: $timeline-color;\n font-weight: bold;\n\n /* On centre sur la ligne*/\n @include transform( translateX(-50%) translateY(-50%) );\n }\n\t}\n\n /* (6) Input d'upload de fichier (css hack) */\n & input[type='file']{\n position: relative;\n opacity: 0;\n\n z-index: 8;\n\n cursor: pointer;\n\n }\n\n /* Contiendra l'input*/\n & input[type='file'] + span.file-input{\n display: inline-block;\n position: absolute;\n margin-top: -1px;\n margin-left: -290px;\n width: calc( 290px - 2*15px );\n height: 30px;\n\n padding: 0 15px;\n\n border-radius: 3px;\n background: $timeline-1;\n\n color: #222;\n line-height: 30px;\n font-weight: normal;\n\n z-index: 9;\n\n cursor: pointer;\n\n\t\tpointer-events: none;\n\n /* Icone d'upload*/\n &:before{\n content: 'e ';\n\n font-size: 1em;\n\t\t\tfont-family: 'icomoon';\n\t\t\tcolor: #222;\n\t\t\tfont-weight: bold;\n }\n\n\t\t@include transition( background .1s ease-in-out );\n }\n\n\n\t/* Animation de hover*/\n\t& input[type='file']:hover + span.file-input{\n\t\tbackground: darken($timeline-1, 10);\n\t\tbox-shadow: inset 0 0 5px #888;\n\t}\n\n\n\t/* Animation de .active*/\n\t& input[type='file'].active + span.file-input{\n\t\tbackground: $timeline-color;\n\t\tcolor: #fff;\n\t\t// On change l'icône\n\t\t&:before{\n content: 'v ';\n\t\t\tcolor: #fff;\n\t\t}\n\t}\n\n\t/* (7) Inputs de type text */\n\t& input[type='text'],\n\t& input[type='password'],\n\t& input[type='number'],\n\t& input[type='button'],\n\t& input[type='submit'],\n\t& input[type='mail']{\n\t\tdisplay: inline;\n\t\twidth: auto;\n\n\t\tmargin: unset;\n\t\tpadding: 5px 10px;\n\t\tmargin-bottom: 5px;\n\t\tmargin-right: 15px;\n\n\t\tborder-radius: 0;\n\t\tborder: 0;\n\t\tborder-bottom: 1px solid #555;\n\n\t\tfont-size: .8em;\n\t\tfont-weight: normal;\n\t\tcolor: #333;\n\n\t\t@include transition( border .2s ease-in-out, background .2s ease-in-out );\n\n\t\t/* Animation de @focus*/\n\t\t&:focus{\n\t\t\tborder-color: $timeline-2;\n\t\t}\n\t}\n\n\n\t& label{\n\t\tcolor: #555;\n\t}\n\n\t/* (8) Gestion des espacements */\n\t& [data-space]{\n\t\t@extend *.line;\n\n\t\tpadding-top: 20px;\n\t\tpadding-bottom: 20px;\n\t}\n\n\t/* (9)
sert uniquement à regrouper */\n\t& article{\n\t\tall: unset !important;\n\t}\n\n\t/* (10) Gestion des espacements verticaux */\n\t& .spacetop{ margin-top: 20px !important; }\n\t& .spacebtm{ margin-bottom: 20px !important; }\n\n\t& .spaced{\n\t\t@extend .spacetop;\n\t\t@extend .spacebtm;\n\t}\n\n\t& .nobold,\n\t& .nobold *{\n\t\tfont-weight: normal !important;\n\t}\n\n\t/* (11) Gestion des custom \n\t \n\t \n\t \n\t\n\n\n"); -var miniFicheBuilder=new HTMLBuilder;miniFicheBuilder.setLayout("
\n\t\n\t

@firstname @lastname (@username)

\n\t
\n\t\t\n\t\t   \n\t
\n\t
\n\t\t\n\t
\n\t
\n\t\t\n\t
\n\t
\n\t\tO\u00f9 habite t-elle/il\u00a0?
\n\t\t   
\n\t\t   
\n\t\t   
\n\t\t   \n\t
\n
"); -var ficheBuilder=new HTMLBuilder;ficheBuilder.setLayout("
\t\t

@firstname @lastname (@username)

\t
\t\t\t\t   \t
\t
\t\t\t
\t
\t\t\t
\t
\t\tSituation familiale:
\t\t
\t\t   
\t\t   
\t\t   \t
\t
\t\t\t
\t

Type de relation

\t
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t
\t

O\u00f9 habite t-elle/il\u00a0?

\t
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t
\t\tDepuis quand connaissez-vous cette personne ?\t\t\t
\t

Contexte de rencontre

\t
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t

Avec quelle fr\u00e9quence discutez-vous avec cette personne\u00a0?

\t
\t\tFace \u00e0 face
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tT\u00e9l\u00e9phone ou skype et \u00e9quivalent
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tSMS, et \u00e9quivalents
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tCourrier \u00e9lectronique
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tFacebook ou autre r\u00e9seau social
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t

Comment \u00eates-vous \u00ab\u00a0connect\u00e9\u00a0\u00bb \u00e0 cette personne\u00a0?

\t
\t\tSes coordonn\u00e9es sont dans votre carnet d\u2019adresse
\t\t\t   \t\t\t   \t
\t
\t\tSon num\u00e9ro de mobile est enregistr\u00e9 sur votre mobile (ou vous-m\u00eames \u00eates sur le sien)
\t\t\t   \t\t\t   \t
\t
\t\tElle figure parmi vos amis facebook
\t\t\t   \t\t\t   \t
\t
\t\tElle figure parmi vos amis facebook et vous interagissez avec elle sur ce dispositif r\u00e9guli\u00e8rement
\t\t\t   \t\t\t   \t
\t
\t\tVous le suivez sur Twitter
\t\t\t   \t\t\t   \t
\t
\t\tVous communiquez avec cette personne sur Twitter
\t\t\t   \t\t\t   \t
\t
\t\tVous communiquez dans autre r\u00e9seau social : \t
\t
\t\tVous communiquez dans un autre dispositif (blogs, jeu vid\u00e9o ou autre) : \t
"); +var miniFicheBuilder=new HTMLBuilder;miniFicheBuilder.setLayout("
\n\t\n\t\n\t\n\t\n\t\n\t

@firstname @lastname (@username)

\n\t
\n\t\t\n\t\t   \n\t
\n\t
\n\t\t\n\t
\n\t
\n\t\t\n\t
\n\t
\n\t\tO\u00f9 habite t-elle/il\u00a0?
\n\t\t   
\n\t\t   
\n\t\t   
\n\t\t   \n\t
\n
"); +var ficheBuilder=new HTMLBuilder;ficheBuilder.setLayout("
\t\t

@firstname @lastname (@username)

\t
\t\t\t\t   \t
\t
\t\t\t
\t
\t\t\t
\t
\t\tSituation familiale:
\t\t
\t\t   
\t\t   
\t\t   \t
\t
\t\t\t
\t

Type de relation

\t
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t\t\t   
\t
\t

O\u00f9 habite t-elle/il\u00a0?

\t
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t
\t\tDepuis quand connaissez-vous cette personne ?\t\t\t
\t

Contexte de rencontre

\t
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t
\t\t   
\t\t   
\t\t   
\t\t   
\t
\t

Avec quelle fr\u00e9quence discutez-vous avec cette personne\u00a0?

\t
\t\tFace \u00e0 face
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tT\u00e9l\u00e9phone ou skype et \u00e9quivalent
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tSMS, et \u00e9quivalents
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tCourrier \u00e9lectronique
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t
\t\tFacebook ou autre r\u00e9seau social
\t\t\t   \t\t\t   \t\t\t   \t\t\t   \t
\t

Comment \u00eates-vous \u00ab\u00a0connect\u00e9\u00a0\u00bb \u00e0 cette personne\u00a0?

\t
\t\tSes coordonn\u00e9es sont dans votre carnet d\u2019adresse
\t\t\t   \t\t\t   \t
\t
\t\tSon num\u00e9ro de mobile est enregistr\u00e9 sur votre mobile (ou vous-m\u00eames \u00eates sur le sien)
\t\t\t   \t\t\t   \t
\t
\t\tElle figure parmi vos amis facebook
\t\t\t   \t\t\t   \t
\t
\t\tElle figure parmi vos amis facebook et vous interagissez avec elle sur ce dispositif r\u00e9guli\u00e8rement
\t\t\t   \t\t\t   \t
\t
\t\tVous le suivez sur Twitter
\t\t\t   \t\t\t   \t
\t
\t\tVous communiquez avec cette personne sur Twitter
\t\t\t   \t\t\t   \t
\t
\t\tVous communiquez dans autre r\u00e9seau social : \t
\t
\t\tVous communiquez dans un autre dispositif (blogs, jeu vid\u00e9o ou autre) : \t
"); diff --git a/js/includes/input-html-data.js b/js/includes/input-html-data.js index 06a7f92..1f840e1 100644 --- a/js/includes/input-html-data.js +++ b/js/includes/input-html-data.js @@ -34,21 +34,27 @@ contactBuilder.setLayout( var miniFicheBuilder = new HTMLBuilder(); miniFicheBuilder.setLayout( "
\n"+ + + "\t\n"+ + "\t\n"+ + "\t\n"+ + "\t\n"+ + "\t\n"+ "\t

@firstname @lastname (@username)

\n"+ "\t
\n"+ - "\t\t\n"+ - "\t\t   \n"+ + "\t\t\n"+ + "\t\t   \n"+ "\t
\n"+ "\t
\n"+ - "\t\t\n"+ + "\t\t\n"+ "\t
\n"+ "\t
\n"+ - "\t\t\n"+ "\t\t\t\n"+ "\t\t\t\n"+ "\t\t\t\n"+ @@ -93,10 +99,10 @@ miniFicheBuilder.setLayout( "\t
\n"+ "\t\tOù habite t-elle/il ?
\n"+ - "\t\t   
\n"+ - "\t\t   
\n"+ - "\t\t   
\n"+ - "\t\t   \n"+ + "\t\t   
\n"+ + "\t\t   
\n"+ + "\t\t   
\n"+ + "\t\t   \n"+ "\t
\n"+ "
"); @@ -245,7 +251,7 @@ ficheBuilder.setLayout( "\t

Type de relation

"+ "\t
"+ - "\t\t\t   
"+ + "\t\t\t   
"+ "\t\t\t   
"+ "\t\t\t   
"+ "\t\t\t   
"+ diff --git a/js/includes/input-phone-contact-min.js b/js/includes/input-phone-contact-min.js new file mode 100644 index 0000000..fb0d2a5 --- /dev/null +++ b/js/includes/input-phone-contact-min.js @@ -0,0 +1,5 @@ +function inputPhoneContact(a,c){this.container=a;this.add_button=c}inputPhoneContact.prototype={container:this.container,add_button:this.add_button}; +inputPhoneContact.prototype.fieldsToStorage=function(){console.log("CONTACTS: FIELDS TO STORAGE");for(var a=$$("article.contact-panel .new-contact"),c=0;c définit le conteneur et le bouton d'ajout +=========================================================*/ +function inputPhoneContact(container, add_button){ + this.container = container; + this.add_button = add_button; +} + +/* [1] Attributs +=========================================================*/ +inputPhoneContact.prototype = { + container: this.container, // Conteneur des formulaires de contact + add_button: this.add_button // Bouton d'ajout d'un formulaire +}; + + +/* [2] Gestion de l'enregistrement des formulaires de contact +=========================================================*/ +inputPhoneContact.prototype.fieldsToStorage = function(){ + console.log('CONTACTS: FIELDS TO STORAGE'); + + // {1} Pour chaque formulaire de contact présent // + var existingContacts = $$('article.contact-panel .new-contact'); + for( var i = 0 ; i < existingContacts.length ; i++ ){ + + // {2} On récupère les informations relatives à l'élément courant // + var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]); + + // {3} On initialise notre deflater pour récupérer les valeurs // + var deflater = new FormDeflater(existingContacts[i], ['input'], ['data-name']); + + // {4} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom // + var deflated = deflater.deflate(); + + // Le numéro n'est pas vide + var validForm = deflated.number.value.length > 0; + // ET le pseudo et/ou le prénom et/ou le nom n'est pas vide + validForm = validForm && deflated.username.value.length+deflated.firstname.value.length+deflated.lastname.value.length > 0; + + // Si le formulaire n'est pas valide, on ne l'enregistre pas + if( !validForm ) continue; + + // {5} On récupère et met en forme les valeurs du deflater // + var obj = { + number: deflated.number.value, + username: deflated.username.value, + firstname: deflated.firstname.value, + lastname: deflated.lastname.value + }; + + // {6} On enregistre les données dans le 'localStorage' // + lsi.set('contacts', 'form'+indexInParent, obj); + + // {7} On enregistre les données des MINI fiches associées // + var associatedMiniFiche = lsi.get('mini-fiches', 'form'+indexInParent); + + // Si n'existe pas, on la crée + if( associatedMiniFiche === false ){ + lsi.set('mini-fiches', 'form'+indexInParent, { + uid: indexInParent, + firstname: obj.firstname, + lastname: obj.lastname, + username: obj.username, + age: '', + sexe: [true, false], + job: '.', + location: [true, false, false, false] + }); + + // Sinon, on met à jour + }else{ + + associatedMiniFiche.firstname = obj.firstname; + associatedMiniFiche.lastname = obj.lastname; + associatedMiniFiche.username = obj.username; + + lsi.set('mini-fiches', 'form'+indexInParent, associatedMiniFiche); + } + + } + + // {8} On met à jour le rendu des contacts// + this.storageToFields(); +}; + + + + + + + + + +/* [3] Gestion de l'ajout physique d'un nouveau contact +=========================================================*/ +/* +* +* @objectData Objet contenant les informations nécessaires à l'affichage +* +*/ +inputPhoneContact.prototype.add = function(objectData){ + console.log('CONTACTS: ADD'); + + // {0} On formatte l'object // + objectData.number = (objectData.number != null) ? objectData.number : ''; + objectData.username = (objectData.username != null) ? objectData.username : ''; + objectData.firstname = (objectData.firstname != null) ? objectData.firstname : ''; + objectData.lastname = (objectData.lastname != null) ? objectData.lastname : ''; + + + // {1} On ajoute le HTML // + this.container.innerHTML += contactBuilder.build(objectData); + + // {2} On attache les évènements sur les boutons 'Enregistrer' // + var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]'); + + // On met à jour les listener (remove, puis add) + var ptr = this; + for( var i = 0 ; i < contactSubmits.length ; i++ ){ + contactSubmits[i].removeEventListener('click', function(e){ ptr.fieldsToStorage(); }, false); + contactSubmits[i].addEventListener('click', function(e){ ptr.fieldsToStorage(); }, false); + } + +}; + + + + + + + + + + +/* [4] Gestion de l'affichage depuis le 'localStorage' +=========================================================*/ +inputPhoneContact.prototype.storageToFields = function(){ + console.log('CONTACTS: STORAGE TO FIELDS'); + + // {1} Pour chaque contact du 'localStorage' // + var existingContacts = lsi.keys('contacts'); + + // On réinitialise le HTML + this.container.innerHTML = ''; + + for( var i = 0 ; i < existingContacts.length ; i++ ){ + // {2} On récupère les informations du contact // + var contactData = lsi.get('contacts', existingContacts[i]); + + // {3} On ajoute un contact à la liste // + this.add(contactData); + + } + + // On ajoute un champ de plus à remplir + this.add({number:'', firstname:'', lastname:'', username:''}); + + // {4} On met à jour les MINI fiches // + // miniFiche.fieldsToStorage(); + +}; + + + +/* [5] Point d'amorçage de la gestion des contacts +=========================================================*/ +inputPhoneContact.prototype.attach = function(){ + console.log('CONTACTS: ATTACH'); + + /* (1) On initialise le jeu de données */ + lsi.createDataset('contacts'); + + /* (2) On attache l'évènement sur le bouton d'ajout de contact */ + var ptr = this; + this.add_button.addEventListener('click', function(e){ ptr.fieldsToStorage(); }, false); + + /* (3) On charge les contacts depuis la mémoire ('localStorage') */ + this.storageToFields(); +}; diff --git a/js/lib/page-manager-min.js b/js/lib/page-manager-min.js index 76a6eab..8925234 100644 --- a/js/lib/page-manager-min.js +++ b/js/lib/page-manager-min.js @@ -2,8 +2,8 @@ function pageManagerClass(){}var ptrPageManagerClass; pageManagerClass.prototype={depJS:null,depCSS:null,xhr:[],activeXHR:null,page:null,vars:[],path:"",jsPath:"js",cssPath:"css",pagelist:null,container:null,ajax:function(b,c,f,a){for(var d=0;d - +
@@ -30,10 +30,10 @@

Bienvenue sur la Web Application dévéloppée par des chercheurs du CNRS appartenant au LabEx SMS (Structuration des Mondes Sociaux) de l'université de Toulouse.

-

Cette application va vous permettre de cartographier le réseau de vos amis et des relations sociales avec lesquels vous communiquez depuis votre téléphone, facebook, ou hors-ligne.

+

Cette application va vous permettre de cartographier le réseau des relations sociales avec lesquelles vous communiquez depuis votre téléphone, Facebook, ou hors-ligne.

Cette recherche est entièrement à but non lucratif, les informations que vous communiquez ne seront pas exploitées à des fins commerciales.

-

Vous pourrez accéder a la plateforme si vous avez été sondé afin de compléter, consulter et modifier vos informations.

+

Si vous avez participé à l'étude, vous pourrez accéder à la plateforme afin de compléter, consulter et modifier vos informations.

@@ -41,4 +41,4 @@
-
\ No newline at end of file + diff --git a/view/input.php b/view/input.php index 55cfe09..e600ea8 100755 --- a/view/input.php +++ b/view/input.php @@ -118,7 +118,7 @@
-     +    
@@ -172,9 +172,9 @@
Situation familiale:
-    
-    
-     +    
+    
+    
@@ -210,129 +210,136 @@

Type de relation

-    
-    
-    
-    
-    
-    
-    
-    
-    
+    
+    
+    
+    
+    
+    
+    
+    
+    

Où habite t-elle/il ?

+
-    
-    
-    
-    
+ +
+ + +
+    
+    
+    
+    
- Depuis quand connaissez-vous cette personne ? - + Depuis quand connaissez-vous cette personne ?

+ mois + et    ans.

Contexte de rencontre

-    
-    
-    
-    
-    
-    
-    
-    
-    
-    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
-    
-    
-    
-    
+    
+    
+    
+    

Avec quelle fréquence discutez-vous avec cette personne ?

Face à face
-     -     -     -     +     +     +     +    
Téléphone ou skype et équivalent
-     -     -     -     +     +     +     +    
SMS, et équivalents
-     -     -     -     +     +     +     +    
Courrier électronique
-     -     -     -     +     +     +     +    
Facebook ou autre réseau social
-     -     -     -     +     +     +     +    

Comment êtes-vous « connecté » à cette personne ?

Ses coordonnées sont dans votre carnet d’adresse
-     -     +     +    
Son numéro de mobile est enregistré sur votre mobile (ou vous-mêmes êtes sur le sien)
-     -     +     +    
Elle figure parmi vos amis facebook
-     -     +     +    
Elle figure parmi vos amis facebook et vous interagissez avec elle sur ce dispositif régulièrement
-     -     +     +    
Vous le suivez sur Twitter
-     -     +     +    
Vous communiquez avec cette personne sur Twitter
-     -     +     +    
diff --git a/view/js/input-min.js b/view/js/input-min.js index 61b4c13..078d52b 100644 --- a/view/js/input-min.js +++ b/view/js/input-min.js @@ -1,9 +1,7 @@ -function updateListener(a,b,c){a.removeEventListener(b,c);a.addEventListener(b,c)} -var ic=new inputChecker,FormDeflaterP={tags:["input"],attr:["data-name"]},importCallLog=$('input#call_log-import[type="file"]'),addContact=$("h4.add-contact"),contactContainer=$("article.contact-panel"),addFiche=$("h4.add-mini-fiche"),miniFicheContainer=$("article.mini-relation-panel"),addFiche=$("h4.add-fiche"),ficheContainer=$("article.relation-panel"),subjectInput={number:$('article.subject-panel [data-name="number"]'),username:$('article.subject-panel [data-name="username"]'),firstname:$('article.subject-panel [data-name="firstname"]'), -lastname:$('article.subject-panel [data-name="lastname"]'),store:$('article.subject-panel [data-name="submit"]')};lsi.createDataset("subject"); -function storeSubject(){console.log("storing subject");var a=0 0; +// // ET le pseudo et/ou le prénom et/ou le nom n'est pas vide +// validForm = validForm && deflated.username.value.length+deflated.firstname.value.length+deflated.lastname.value.length > 0; +// +// // Si le formulaire n'est pas valide, on ne l'enregistre pas +// if( !validForm ) continue; +// +// // {5} On récupère et met en forme les valeurs du deflater // +// var obj = { +// number: deflated.number.value, +// username: deflated.username.value, +// firstname: deflated.firstname.value, +// lastname: deflated.lastname.value +// }; +// +// // {6} On enregistre les données dans le 'localStorage' // +// lsi.set('contacts', 'form'+indexInParent, obj); +// +// +// +// // {7} On enregistre les données des MINI fiches associées // +// var associatedMiniFiche = lsi.get('mini-fiches', 'form'+indexInParent); +// +// // Si n'existe pas, on la crée +// if( associatedMiniFiche === false ){ +// lsi.set('mini-fiches', 'form'+indexInParent, { +// uid: indexInParent, +// firstname: obj.firstname, +// lastname: obj.lastname, +// username: obj.username, +// age: '', +// sexe: [true, false], +// job: '.', +// location: [true, false, false, false] +// }); +// +// // Sinon, on met à jour +// }else{ +// +// associatedMiniFiche.firstname = obj.firstname; +// associatedMiniFiche.lastname = obj.lastname; +// associatedMiniFiche.username = obj.username; +// +// lsi.set('mini-fiches', 'form'+indexInParent, associatedMiniFiche); +// } +// +// } +// +// // {8} On met à jour les mini-fiches // +// storeMiniFiches(); +// +// +// // {9} On met à jour le rendu des contacts// +// restoreContacts(); +// } +// +// +// /* (2) Fonction pour l'ajout d'un contact */ +// function addNewContact(number, username, firstname, lastname){ +// // {1} On ajoute le HTML // +// contactContainer.innerHTML += contactBuilder.build({ +// number: (typeof number != 'string') ? '' : number, +// username: (typeof username != 'string') ? '' : username, +// firstname: (typeof firstname != 'string') ? '' : firstname, +// lastname: (typeof lastname != 'string') ? '' : lastname +// }); +// +// // {2} On attache les évènements sur les boutons 'Enregistrer' // +// var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]'); +// for( var i = 0 ; i < contactSubmits.length ; i++ ) +// updateListener(contactSubmits[i], 'click', storeContacts); +// +// } +// +// +// /* (3) Gestion de l'affichage (et mise à jour) des contacts (depuis 'localStorage') */ +// function restoreContacts(){ +// // {1} Pour chaque contact du 'localStorage' // +// var existingContacts = lsi.keys('contacts'); +// +// // On réinitialise le HTML +// contactContainer.innerHTML = ''; +// +// for( var i = 0 ; i < existingContacts.length ; i++ ){ +// // {2} On récupère les informations du contact // +// var contactData = lsi.get('contacts', existingContacts[i]); +// +// // {3} On ajoute un contact à la liste // +// addNewContact( +// contactData.number, +// contactData.username, +// contactData.firstname, +// contactData.lastname +// ); +// +// } +// +// addNewContact('', '', '', ''); +// +// // {4} On met à jour les MINI fiches // +// storeMiniFiches(); +// +// } +// +// +// /* (n) On attache l'évènement d'ajout d'un formulaire de contact */ +// addContact.addEventListener('click', storeContacts, false); + + + + + + + + + + + + + + + + + + +/* [5] Gestion des MINI fiches relation +=========================================================*/ +/* (1) Gestion de l'enregistrement des contacts en local ('localStorage') */ +lsi.createDataset('mini-fiches'); +function storeMiniFiches(){ + console.log('STORING ALL MINI-FICHES'); // {1} Pour chaque formulaire de contact présent // - var existingContacts = $$('article.contact-panel .new-contact'); - for( var i = 0 ; i < existingContacts.length ; i++ ){ + var existingMiniFiches = $$('article.mini-relation-panel .mini-fiche-relation '); + for( var i = 0 ; i < existingMiniFiches.length ; i++ ){ - // {2} On récupère les informations relatives à l'élément courant // - var indexInParent = existingContacts[i].parentNode.children.indexOf(existingContacts[i]); + // {2} On initialise notre deflater pour récupérer les valeurs // + var deflater = new FormDeflater(existingMiniFiches[i], ['input', 'select'], ['data-name']); - // {3} On initialise notre deflater pour récupérer les valeurs // - var deflater = new FormDeflater(existingContacts[i], ['input'], ['data-name']); - - // {4} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom // + // {3} On enregistre ce contact si le numéro n'est pas vide et soit pseudo/prénom/nom // var deflated = deflater.deflate(); - // Le numéro n'est pas vide - var validForm = deflated.number.value.length > 0; - // ET le pseudo et/ou le prénom et/ou le nom n'est pas vide - validForm = validForm && deflated.username.value.length+deflated.firstname.value.length+deflated.lastname.value.length > 0; + // TODO: Condition pour que le formulaire soit valide + var validForm = true; // Si le formulaire n'est pas valide, on ne l'enregistre pas if( !validForm ) continue; + // {4} On récupère les données du LSI si elles existent // + var existingData = lsi.get('mini-fiches', 'form'+deflated.uid.value); + console.log('deflated'); + console.log(deflated); + // Si n'existe pas, on initialise + if( existingData === false ){ + existingData.username = 'inconnu'; + existingData.firstname = 'inconnu'; + existingData.lastname = 'inconnu'; + } + // {5} On récupère et met en forme les valeurs du deflater // var obj = { - number: deflated.number.value, - username: deflated.username.value, - firstname: deflated.firstname.value, - lastname: deflated.lastname.value + uid: deflated.uid.value, + firstname: existingData.firstname, + lastname: existingData.lastname, + username: existingData.username, + sexe: [ + deflated.sexe[0].status, // VRAI SI HOMME + deflated.sexe[1].status // VRAI SI FEMME + ], + age: deflated.age.value, + job: deflated.job.value, + location: [ + deflated.loc[0].status, // VRAI si choix 1 + deflated.loc[1].status, // VRAI si choix 2 + deflated.loc[2].status, // VRAI si choix 3 + deflated.loc[3].status // VRAI si choix 4 + ] }; // {6} On enregistre les données dans le 'localStorage' // - lsi.set('contacts', 'form'+indexInParent, obj); + lsi.set('mini-fiches', 'form'+obj.uid, obj); } // {7} On met à jour le rendu // - restoreContacts(); + restoreMiniFiches(); } -/* (2) Fonction pour l'ajout d'un contact */ -function addNewContact(number, username, firstname, lastname){ - // {1} On ajoute le HTML // - contactContainer.innerHTML += contactBuilder.build({ - number: (typeof number != 'string') ? '' : number, - username: (typeof username != 'string') ? '' : username, - firstname: (typeof firstname != 'string') ? '' : firstname, - lastname: (typeof lastname != 'string') ? '' : lastname - }); - // {2} On attache les évènements sur les boutons 'Enregistrer' // - var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]'); - for( var i = 0 ; i < contactSubmits.length ; i++ ) - updateListener(contactSubmits[i], 'click', storeContacts); +/* (2) Fonction pour l'ajout d'un contact */ +function addNewMiniFiche(firstname, lastname, username, uid, age, sexe, job, location){ + // {1} Création physique // + miniFicheContainer.innerHTML += miniFicheBuilder.build({ + firstname: firstname, + lastname: lastname, + username: username, + uid: uid, + age: '', + sexe_A: sexe[0] ? 'true' : 'false', + sexe_B: sexe[1] ? 'true' : 'false', + job: job, + loc_A: location[0] ? 'true' : 'false', + loc_B: location[1] ? 'true' : 'false', + loc_C: location[2] ? 'true' : 'false', + loc_D: location[3] ? 'true' : 'false' + }); } /* (3) Gestion de l'affichage (et mise à jour) des contacts (depuis 'localStorage') */ -function restoreContacts(){ +function restoreMiniFiches(){ // {1} Pour chaque contact du 'localStorage' // - var existingContacts = lsi.keys('contacts'); + var existingMiniFiches = lsi.keys('mini-fiches'); // On réinitialise le HTML - contactContainer.innerHTML = ''; + miniFicheContainer.innerHTML = ''; - for( var i = 0 ; i < existingContacts.length ; i++ ){ + for( var i = 0 ; i < existingMiniFiches.length ; i++ ){ // {2} On récupère les informations du contact // - var contactData = lsi.get('contacts', existingContacts[i]); + var ficheData = lsi.get('mini-fiches', existingMiniFiches[i]); // {3} On ajoute un contact à la liste // - addNewContact( - contactData.number, - contactData.username, - contactData.firstname, - contactData.lastname + addNewMiniFiche( + ficheData.firstname, + ficheData.lastname, + ficheData.username, + ficheData.uid, + ficheData.age, + ficheData.sexe, + ficheData.job, + ficheData.location ); } - addNewContact(); - - // {4} On met à jour les listeners de chaque formulaire // - var contactSubmits = $$('article.contact-panel .new-contact input[type="submit"]'); - - for( var i = 0 ; i < contactSubmits.length ; i++ ) - updateListener(contactSubmits[i], 'click', storeContacts); - - -}restoreContacts(); - - -/* (n) On attache l'évènement d'ajout d'un formulaire de contact */ -addContact.addEventListener('click', storeContacts, false); +}restoreMiniFiches(); +// TODO : Gestion des MINI fiches relation en fonction des contacts +/* (1) Fonction pour l'ajout d'une MINI fiche relation */ - - - - - - - - - - - -/* [5] Gestion des fiches relation -=========================================================*/ -// TODO : Gestion des fiches relation en fonction des contacts -/* (1) Fonction pour l'ajout d'un contact */ -var miniFicheUID = 0; -function addNewMiniFiche(firstname, lastname, username){ - miniFicheContainer.innerHTML += miniFicheBuilder.build({ - firstname: (typeof firstname != 'string') ? '' : firstname, - lastname: (typeof lastname != 'string') ? '' : lastname, - username: (typeof username != 'string') ? '' : username, - uid: miniFicheUID - }); - - miniFicheUID++; -} - // On ajoute la première // addNewFiche();