diff --git a/SwichGIT/src/css/PageDaccueil.css b/SwichGIT/src/css/PageDaccueil.css new file mode 100644 index 0000000..9b1d281 --- /dev/null +++ b/SwichGIT/src/css/PageDaccueil.css @@ -0,0 +1,341 @@ +#pageAccueil { + visibility: visible; +} + +#cloud { + z-index: 10 +} + +#mount1 { + z-index: 11; +} + +#mount2 { + z-index: 10; +} + +.containerparam{ + position: absolute; + display: flex; + margin-left: 1vw; +} + +.containerparam > div { + margin-right: 4vh; +} + + +/*Bouton info*/ +#infosec{ + z-index:15; + width: 2vw; +} + +#infosec2{ + z-index:15; + width: 2vw; +} + +#info { + color: var(--lightprima); + text-decoration: none; + font-size: 45px; +} + +#info:hover { + color: var(--lightprima); +} + +.activity { + padding: 0; + list-style: none; +} + +li { + -webkit-transition: box-shadow 0.2s ease; + -moz-transition: box-shadow 0.2s ease; + transition: box-shadow 0.2s ease; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + border-radius: 50%; + color: #B7B7B7; + display: inline-block; + font-size: 0.889em; + height: 3em; + position: relative; + text-align: center; + text-transform: lowercase; + width: 3em; + line-height: 3em; +} + + li a { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + li:hover { + box-shadow: 0 0 0 7px var(--lightsedonca); + font-size:99%; + position:relative; + right:5%; + } + + li:before { + border-radius: 50%; + bottom: 0; + box-shadow: 0 0 0 4px var(--lightsedonca); + content: ''; + left: 0; + position: absolute; + right: 0; + top: 0; + background-color: var(--lightsedonca); + } + +/*Les règles popups*/ +.overlay { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(0, 0, 0, 0.7); + transition: opacity 500ms; + visibility: hidden; + opacity: 0; + z-index: 21; +} + + .overlay:target { + visibility: visible; + opacity: 1; + } + +.popup { + margin: 70px auto; + padding: 20px; + background: #fff; + border-radius: 5px; + width: 30%; + position: relative; + top:25%; +} + + .popup h2 { + margin-top: 0; + color: #333; + font-family: Tahoma, Arial, sans-serif; + } + + .popup .close { + position: absolute; + top: 20px; + right: 30px; + transition: all 200ms; + font-size: 30px; + font-weight: bold; + text-decoration: none; + color: #333; + } + + .popup .close:hover { + color: #06D85F; + } + + .popup .content { + max-height: 30%; + overflow: auto; + } + + /*Parametres*/ + +.popup2 { + margin: 70px auto; + padding: 20px; + background: #fff; + border-radius: 5px; + width: 45%; + height: 65%; + position: relative; + top:10%; +} + +.popup2 h2 { + margin-top: 0; + color: #333; + font-family: Tahoma, Arial, sans-serif; +} +h3 { + margin: 0; + color: #333; + font-family: Tahoma, Arial, sans-serif; +} +.popup2 .close { + position: absolute; + top: 20px; + right: 30px; + transition: all 200ms; + font-size: 30px; + font-weight: bold; + text-decoration: none; + color: #333; +} + .popup2 .close:hover { + color: #06D85F; + } +.popup2 .content { + max-height: 30%; +} + +.titre{ + display: ruby-base; +} + +label { + cursor: pointer; + text-indent: -9999px; + width: 2vw; + height: 1vw; + background: grey; + display: block; + border-radius: 100px; + position: relative; +} + +label:after { + content: ''; + position: absolute; + top: 0.1vw; + left: 0.1vw; + width: 0.8vw; + height: 0.8vw; + background: #fff; + border-radius: 90px; + transition: 0.3s; +} + +input:checked + label { + background: #bada55; +} + +input:checked + label:after { + left: calc(100% - 0.1vw); + transform: translateX(-100%); +} + +label:active:after { + width: 1.4vw; +} +/* J'ai trop avancé, mode multi*/ + + +#containpseudo { + position: absolute; + height: 15%; + width: 30%; + z-index: 12; + left: 35%; + top: 30%; +} + +.bouttonvalider:hover { + box-shadow: 0 0 0 8px var(--lightsedonca); + font-size: 99%; + position: relative; + height: 93%; + width:95%; + top: 4%; + transition: box-shadow 0.2s ease; +} + +#bouttonvalider:hover { + box-shadow: 0 0 0 5px var(--lightsedonca); + font-size: 120%; + position: relative; + right: 5%; +} + +#pseudoenter { + background-color: red; + height: 100%; + border-radius: 45px; + background-color: #B130DE; +} + +#inputpseudo { + position: absolute; + width: 99%; + height: 65%; + border-radius: 30px; + font-size: 3vw; + background-color: transparent; + -moz-appearance: none; + text-align: center; + color: #707070; + border-color: transparent; + font-family: impact, Arial Black; + z-index: 11; +} + +#fondinput { + background-color: red; + position: absolute; + width: 97%; + background-color: var(--lightsedonca); + height: 90%; + border-radius: 40px; + left: 1.5%; + top: 5%; + z-index: 10; +} + +#buttonadd { + position: absolute; + top: 30%; + right: -12%; + height: 3vw; + width: 3vw; + border-radius: 2vw; + background-color: #B130DE; + z-index: 18; +} + +#textplus { + font-size: 3vw; + font-family: arial, Arial Black; + position: absolute; + margin-top: -0.15vw; + margin-left: 0.65vw; + color: var(--lightprima); +} + +#containplayers { + position: absolute; + background-color: transparent; + color: var(--lightsedonca); + width: 15vw; + height: 20vw; + z-index: 17; + right: 0%; + top: 8vw; +} + +.pseudojoueur { + float: right; + margin-top: 0px; + margin-bottom: 3%; + margin-right: 10%; + font-family: Lucida Console, Arial Black, Arial; + font-size: 2vw; +} + +#pseudolist { + width: 100%; + height: 1.7vw; +} + + diff --git a/SwichGIT/src/css/PartieGame.css b/SwichGIT/src/css/PartieGame.css new file mode 100644 index 0000000..6fbd8bf --- /dev/null +++ b/SwichGIT/src/css/PartieGame.css @@ -0,0 +1,108 @@ + +#pageGame { + visibility: hidden; +} + +.menuhaut { + height: 10vh; + width: inherit; + display: flex; +} + +.retourstp { + position: absolute; +} + +#Redistribution{ + position:relative; + top:-60%; +} + +#textjouer2 { + position: absolute; + text-align: center; + + font-family: Montserrat, impact, Arial Black; + font-size: 2.5vw; + margin-top: 0.2vw; + margin-left: 0.6vw; + color: var(--lightsedonca); + +} + +#btnvalider2 { + position: relative; + text-align: center; + font-family: Montserrat, impact, Arial Black; + font-size: 2.5vw; + margin-top: 0.2vw; + margin-left: 0.2vw; + color: var(--lightsedonca); +} + +#btnvalider3 { + position: relative; + text-align: center; + font-family: Montserrat, impact, Arial Black; + font-size: 2.5vw; + margin-top: 0.2vw; + margin-left: 0.2vw; + color: var(--lightsedonca); +} + +#Redistribution2 { + position: relative; + top: -60%; + left:68%; +} + +#Redistribution3 { + position: relative; + top: -60%; + left: 50%; +} + + +.bouttonvalider2:hover { + box-shadow: 0 0 0 9px var(--lightsedonca); + font-size: 120%; + position: relative; + top: 2%; + height: 82%; + width: 96%; + transition: box-shadow 0.2s ease; +} + + +#caseBarre +{ + background-color:lightgray; + width:104px; + padding:2px; + -moz-border-radius:3px; + border-radius:3px; + text-align:left; + border:1px solid gray; + display: flex; + +} +#progressbar +{ + width:100px; + padding:1px; + background-color:white; + border:1px solid black; + height:28px; +} +#indicateur +{ + width:0px; + background-color : green; + height:28px; + margin:0; +} +#progressnum +{ + text-align:center; + width:100px; +} \ No newline at end of file diff --git a/SwichGIT/src/css/Resp1.css b/SwichGIT/src/css/Resp1.css new file mode 100644 index 0000000..4ad3c72 --- /dev/null +++ b/SwichGIT/src/css/Resp1.css @@ -0,0 +1,321 @@ +/*Demi Ecran*/ +@media screen and (max-width: 960px) and (min-height: 600px) { + .anneau { + box-sizing: border-box; + background-color: #FFD100; + border-radius: 3vw; + height: inherit; + width: inherit; + display: table-cell; + vertical-align: middle; + } + + .rondinterieur { + background-color: var(--lighttercia); + height: 3vw; + width: 3vw; + display: table; + margin: 0 auto; + border-radius: 3vw; + } + + .containform { + box-sizing: content-box; + height: 6vw; + width: 6vw; + display: table-cell; + vertical-align: middle; + } + + .rond { + display: table; + margin: 0 auto; + background-color: #FFD100; + height: 3vw; + width: 3vw; + border-radius: 3vw; + } + + /* PARTIE CARRE */ + .carre { + background-color: #30C0DE; + height: inherit; + width: inherit; + display: table-cell; + vertical-align: middle + } + + .carreinterieur { + background-color: var(--lightsedonca); + height: 3vw; + width: 3vw; + display: table; + margin: 0 auto; + } + + .pcarre { + display: table; + margin: 0 auto; + background-color: #30C0DE; + height: 3vw; + width: 3vw; + } + + /* PARTIE TRIANGLE */ + .triangle { + display: table; + margin: 0 auto; + border-left: 2.5vw solid transparent; + border-right: 2.5vw solid transparent; + border-bottom: 5vw solid #DEA430; + } + + .trianglerinterieur { + position: absolute; + margin-left: -1.5vw; + margin-top: 1.25vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid var(--lightsedonca); + } + + .ptriangle { + display: table; + margin: 0 auto; + margin-top: 0.75vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid #DEA430; + } + + /* TRAPEZE */ + .trapeze { + bottom: 0px; + height: 0; + margin-top: 2.58vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 3vw solid #6FDE30; + } + + .triangletrapeze { + padding-top: 0.1vw; + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 2.5vw solid #6FDE30; + } + + .trapezeinte { + position: absolute; + margin-top: 3vw; + margin-left: 1.25vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .triangletrapezeinte { + position: absolute; + margin-top: 1.45vw; + margin-left: 1.25vw; + padding-top: 0.1vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .trapezep { + display: table; + margin: 0 auto; + margin-top: 2vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid #6FDE30; + z-index: 15; + } + + .triangletrapezep { + position: absolute; + margin-top: 0.55vw; + margin-left: 1.25vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid #6FDE30; + z-index: 15; + } + + .losangephaut { + display: table; + margin: 0 auto; + margin-top: -3vw; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 3vw solid #B130DE; + } + + .losangepbas { + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-top: 3vw solid #B130DE; + } + + .losangephauti { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + } + + .losangepbasi { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + } + + .losangephautc { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid #B130DE; + } + + .losangepbasc { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid #B130DE; + } + + .buttonretour { + position: relative; + height: 4vh; + width: 4vh; + border-radius: 55vw; + background-color: var(--lightsedonca); + z-index: 5; + margin-left: 2vw; + top: 1.75vw; + } + + .flex-item { + background: var(--lightsedonca); + width: 10vw; + height: 13vw; + border-radius: 2vw; + padding-right: 0.4vw; + padding-left: 0.4vw; + padding-bottom: 0.8vw; + padding-top: 0.4vw; + list-style: none; + display: flex; + margin-right: 1.75vw; + margin-left: 1.75vw; + -webkit-flex-flow: row wrap; + justify-content: space-around; + } + + .item-form { + width: 4vw; + padding-left: 0.1vw; + margin-top: 0.25vw; + height: 4vw; + border-radius: 10px; + background-color: var(--lighttercia); + } + + .containcards { + height: 87vh; + overflow-x: auto; + display: flex; + flex-wrap: wrap; + padding-left: 10vw; + padding-top: 2.5vw; + } + + .logop2 img { + width: 20vh; + padding-top: 1vh; + position: relative; + left: 38vw; + } + + .txt { + position: absolute; + font-family: Arial Black; + color: var(--lightprima); + font-size: 2.5vw; + left: 1vw; + top: -1vh; + } + + .logo img { + position: absolute; + width: 25vw; + left: 38vw; + top: 13%; + z-index: 11; + } + + .mounts img { + position: absolute; + height: 100%; + width: 100%; + pointer-events: none; + margin-left: -1vw; + margin-top: -1vw; + object-fit: cover; + } + + #contourbuttonvalider { + position: absolute; + border-radius: 45px; + left: 3vw; + top: 5.5vw; + height: 9vw; + width: 25vw; + background-color: var(--lightsedonca); + z-index: 15; + } + + .bouttonvalider { + position: absolute; + height: 6.8vw; + width: 22.8vw; + top: 1.1vw; + left: 1.1vw; + border-radius: 30px; + background-color: #B130DE; + } + + .bouttonvalider2 { + position: absolute; + height: 6.8vw; + width: 22.8vw; + top: 1.1vw; + left: 1.1vw; + border-radius: 30px; + background-color: #00CC66; + } + + #textjouer { + font-family: Montserrat, impact, Arial Black; + position: absolute; + font-size: 5vw; + margin-top: 0.2vw; + margin-left: 5.5vw; + color: var(--lightsedonca); + } +} diff --git a/SwichGIT/src/css/Resp2.css b/SwichGIT/src/css/Resp2.css new file mode 100644 index 0000000..1296054 --- /dev/null +++ b/SwichGIT/src/css/Resp2.css @@ -0,0 +1,321 @@ +/*DemTéléphone 1i Ecran*/ +@media screen and (max-width: 550px) and (max-height: 850px) { + .anneau { + box-sizing: border-box; + background-color: #DE3030; + border-radius: 3vw; + height: inherit; + width: inherit; + display: table-cell; + vertical-align: middle; + } + + .rondinterieur { + background-color: var(--lighttercia); + height: 3vw; + width: 3vw; + display: table; + margin: 0 auto; + border-radius: 3vw; + } + + .containform { + box-sizing: content-box; + height: 6vw; + width: 6vw; + display: table-cell; + vertical-align: middle; + } + + .rond { + display: table; + margin: 0 auto; + background-color: #DE3030; + height: 3vw; + width: 3vw; + border-radius: 3vw; + } + + /* PARTIE CARRE */ + .carre { + background-color: #30C0DE; + height: inherit; + width: inherit; + display: table-cell; + vertical-align: middle + } + + .carreinterieur { + background-color: var(--lightsedonca); + height: 3vw; + width: 3vw; + display: table; + margin: 0 auto; + } + + .pcarre { + display: table; + margin: 0 auto; + background-color: #30C0DE; + height: 3vw; + width: 3vw; + } + + /* PARTIE TRIANGLE */ + .triangle { + display: table; + margin: 0 auto; + border-left: 2.5vw solid transparent; + border-right: 2.5vw solid transparent; + border-bottom: 5vw solid #DEA430; + } + + .trianglerinterieur { + position: absolute; + margin-left: -1.5vw; + margin-top: 1.25vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid var(--lightsedonca); + } + + .ptriangle { + display: table; + margin: 0 auto; + margin-top: 0.75vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid #DEA430; + } + + /* TRAPEZE */ + .trapeze { + bottom: 0px; + height: 0; + margin-top: 2.58vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 3vw solid #6FDE30; + } + + .triangletrapeze { + padding-top: 0.1vw; + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 2.5vw solid #6FDE30; + } + + .trapezeinte { + position: absolute; + margin-top: 3vw; + margin-left: 1.25vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .triangletrapezeinte { + position: absolute; + margin-top: 1.45vw; + margin-left: 1.25vw; + padding-top: 0.1vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .trapezep { + display: table; + margin: 0 auto; + margin-top: 2vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid #6FDE30; + z-index: 15; + } + + .triangletrapezep { + position: absolute; + margin-top: 0.55vw; + margin-left: 1.25vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid #6FDE30; + z-index: 15; + } + + .losangephaut { + display: table; + margin: 0 auto; + margin-top: -3vw; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 3vw solid #B130DE; + } + + .losangepbas { + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-top: 3vw solid #B130DE; + } + + .losangephauti { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + } + + .losangepbasi { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + } + + .losangephautc { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid #B130DE; + } + + .losangepbasc { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid #B130DE; + } + + .buttonretour { + position: relative; + height: 4vh; + width: 4vh; + border-radius: 55vw; + background-color: var(--lightsedonca); + z-index: 5; + margin-left: 9.5vw; + top: 6.75vw; + } + + .flex-item { + background: var(--lightsedonca); + width: 10vw; + height: 13vw; + border-radius: 2vw; + padding-right: 0.4vw; + padding-left: 0.4vw; + padding-bottom: 0.8vw; + padding-top: 0.4vw; + list-style: none; + display: flex; + margin-right: 1.75vw; + margin-left: 1.75vw; + -webkit-flex-flow: row wrap; + justify-content: space-around; + } + + .item-form { + width: 5vw; + padding-left: 0.1vw; + margin-top: 0.25vw; + height: 5vw; + border-radius: 10px; + background-color: var(--lighttercia); + } + + .containcards { + height: 87vh; + overflow-x: auto; + display: flex; + flex-wrap: wrap; + padding-left: 2.5vw; + padding-top: 2.5vw; + } + + .logop2 img { + width: 20vh; + padding-top: 1vh; + position: relative; + left: 27vw; + } + + .txt { + position: absolute; + font-family: Arial Black; + color: var(--lightprima); + font-size: 5.5vw; + left: 2.25vw; + top: -1vh; + } + + .logo img { + position: absolute; + width: 45vw; + left: 28vw; + top: 13%; + z-index: 11; + } + + .mounts img { + position: absolute; + height: 100%; + width: 100%; + pointer-events: none; + margin-left: -1vw; + margin-top: -1vw; + object-fit: cover; + } + + #contourbuttonvalider { + position: absolute; + border-radius: 45px; + left: -10vw; + top: 5.5vw; + height: 15vw; + width: 50vw; + background-color: var(--lightsedonca); + z-index: 15; + } + + .bouttonvalider { + position: absolute; + height: 13vw; + width: 47vw; + top: 1.1vw; + left: 1.5vw; + border-radius: 30px; + background-color: #B130DE; + } + + .bouttonvalider2 { + position: absolute; + height: 6.8vw; + width: 22.8vw; + top: 1.1vw; + left: 1.1vw; + border-radius: 30px; + background-color: #00CC66; + } + + #textjouer { + font-family: Montserrat, impact, Arial Black; + position: absolute; + font-size: 10vw; + margin-top: 0.2vw; + margin-left: 12.5vw; + color: var(--lightsedonca); + } +} diff --git a/SwichGIT/src/css/Resp3.css b/SwichGIT/src/css/Resp3.css new file mode 100644 index 0000000..27ed7fa --- /dev/null +++ b/SwichGIT/src/css/Resp3.css @@ -0,0 +1,327 @@ +/*Ecran*/ +@media screen and (min-width: 960px) { + + .anneau { + position: relative; + left: calc((var(--x) - var(--y)) / 2); + background-color: var(--colorbase); + border-radius: var(--y); + height: var(--y); + width: var(--y); + display: table-cell; + vertical-align: middle; + } + + .rondinterieur { + background-color: var(--lighttercia); + height: var(--z); + width: var(--z); + display: table; + margin: 0 auto; + border-radius: var(--z); + } + + .containform { + position: relative; + height: var(--x); + width: var(--x); + display: table-cell; + vertical-align: middle; + } + + .rond { + display: table; + margin: 0 auto; + background-color: var(--colorrond); + height: var(--z); + width: var(--z); + border-radius: var(--z); + } + + /* PARTIE CARRE */ + .carre { + position: relative; + background-color: var(--colorcarre); + height: var(--y); + width: var(--y); + margin-left: auto; + margin-right: auto; + } + + .carreinterieur { + position: relative; + top : calc((var(--y) - var(--z))/2); + left : calc((var(--y) - var(--z))/2); + display: table-cell; + vertical-align: middle; + background-color: var(--lightsedonca); + height: var(--z); + width: var(--z); + } + + .pcarre { + background-color: var(--colorcarre); + height: var(--z); + width: var(--z); + display: table; + margin: 0 auto; + } + + /* PARTIE TRIANGLE */ + .triangle { + display: table; + margin: 0 auto; + border-left: 2.5vw solid transparent; + border-right: 2.5vw solid transparent; + border-bottom: 5vw solid #DEA430; + } + + .trianglerinterieur { + position: absolute; + margin-left: -1.5vw; + margin-top: 1.25vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid var(--lightsedonca); + } + + .ptriangle { + display: table; + margin: 0 auto; + margin-top: 0.75vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 3vw solid #DEA430; + } + + /* TRAPEZE */ + .trapeze { + bottom: 0px; + height: 0; + margin-top: 2.58vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 3vw solid #6FDE30; + } + + .triangletrapeze { + padding-top: 0.1vw; + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 2.5vw solid #6FDE30; + } + + .trapezeinte { + position: absolute; + margin-top: 3vw; + margin-left: 1.25vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .triangletrapezeinte { + position: absolute; + margin-top: 1.45vw; + margin-left: 1.25vw; + padding-top: 0.1vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + z-index: 15; + } + + .trapezep { + display: table; + margin: 0 auto; + margin-top: 2vw; + width: 2vw; + border-left: 0.75vw solid transparent; + border-right: 0.75vw solid transparent; + border-top: 1.5vw solid #6FDE30; + z-index: 15; + } + + .triangletrapezep { + position: absolute; + margin-top: 0.55vw; + margin-left: 1.25vw; + border-left: 1.75vw solid transparent; + border-right: 1.75vw solid transparent; + border-bottom: 1.5vw solid #6FDE30; + z-index: 15; + } + + .losangephaut { + display: table; + margin: 0 auto; + margin-top: -3vw; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-bottom: 3vw solid #B130DE; + } + + .losangepbas { + position: absolute; + border-left: 3vw solid transparent; + border-right: 3vw solid transparent; + border-top: 3vw solid #B130DE; + } + + .losangephauti { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid var(--lightsedonca); + } + + .losangepbasi { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid var(--lightsedonca); + } + + .losangephautc { + display: table; + margin: 0 auto; + margin-top: -1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-bottom: 1.5vw solid #B130DE; + } + + .losangepbasc { + position: absolute; + margin-left: 1.5vw; + border-left: 1.5vw solid transparent; + border-right: 1.5vw solid transparent; + border-top: 1.5vw solid #B130DE; + } + + .buttonretour { + position: relative; + height: 4vh; + width: 4vh; + border-radius: 55vw; + background-color: var(--lightsedonca); + z-index: 5; + margin-left: 2vw; + top: 1.75vw; + } + + .flex-item { + background: var(--lightsedonca); + width: 10vw; + height: 13vw; + border-radius: 0.75vw; + padding-right: 0.15vw; + padding-left: 0.15vw; + padding-bottom: 0.25vw; + list-style: none; + display: flex; + margin-right: 0.4vw; + margin-left: 0.4vw; + -webkit-flex-flow: row wrap; + justify-content: space-around; + } + + .item-form { + width: 3vw; + padding-left: 0.1vw; + margin-top: 0.25vw; + height: 3vw; + border-radius: 10px; + background-color: var(--lighttercia); + } + + .containcards { + height: 87vh; + overflow-x: auto; + display: flex; + flex-wrap: wrap; + padding-left: 3vw; + padding-top: 2.5vw; + } + + .logop2 img { + width: 20vh; + padding-top: 1vh; + position: relative; + left: 43.5vw; + } + + + .txt { + position: absolute; + font-family: Arial Black; + color: var(--lightprima); + font-size: 1.5vw; + left: 0.4vw; + top: -1.6vh; + } + + .logo img { + position: absolute; + width: 12vw; + left: 44vw; + top: 13%; + z-index: 11; + } + + .mounts img { + position: absolute; + height: 100%; + width: 100%; + pointer-events: none; + margin-left: -10px; + } + + #contourbuttonvalider { + position: absolute; + border-radius: 45px; + left: 9.2vw; + top: 5.5vw; + height: 4vw; + width: 12vw; + background-color: var(--lightsedonca); + z-index: 15; + } + + .bouttonvalider { + position: absolute; + height: 3.4vw; + width: 11.4vw; + top: 0.3vw; + left: 0.3vw; + border-radius: 30px; + background-color: #B130DE; + } + + + .bouttonvalider2 { + position: absolute; + height: 3.4vw; + width: 11.4vw; + top: 0.3vw; + left: 0.3vw; + border-radius: 30px; + background-color: #00CC66; + } + + #textjouer { + font-family: Montserrat, impact, Arial Black; + position: absolute; + font-size: 2.5vw; + margin-top: 0.2vw; + margin-left: 2.7vw; + color: var(--lightsedonca); + text-align:center; + } +} diff --git a/SwichGIT/src/css/base.css b/SwichGIT/src/css/base.css new file mode 100644 index 0000000..d59d42b --- /dev/null +++ b/SwichGIT/src/css/base.css @@ -0,0 +1,113 @@ +:root{ + /*couleur héhé*/ + --lightprima: #DEDEDE; + --lightsedonca: #B7B7B7; + --lighttercia: #E6E6E6; + /*Couleur*/ + --colorbase : #e75259; + --colorone : #00CBFF; + --colortwo : #00FF6E; + --colorthree : #C800FF; + --colorcarre : #30C0DE; + /*Les formes*/ + --x : 3vw; + --y : 2.5vw; /*taille anneau*/ + --z :1.5vw; /*taille rond*/ + --d : calc(var(--x)/2); + --l : calc(var(--x)/2); + + +} + +@font-face { + font-family: "Montserrat"; + src: url("/fonts/MonstMontserrat-Black.woff") format("woff"), + url("/fonts/MonstMontserrat-Black.woff2") format("woff2"); +} + +a { + cursor: pointer; + z-index: 60; +} + + + +body { + background-color: var(--lightprima); + height: 100%; + overflow-x: hidden; + overflow-y: hidden; + /*Desactiver la selection*/ + -webkit-user-select: none; /* Chrome / Safari */ + -moz-user-select: none; /* Firefox */ + -ms-user-select: none; /* IE 10+ */ + user-select: none; +} + + +#ContainBottom { +position: absolute; +margin-left: 25vw; +height: 12vw; +width: auto; +bottom: 0; +z-index: 20; +} + +#clic{ +position: absolute; +left: 55vw; +top : 7vw; +height: auto; +width: 15vw; +} + +#card-conteneur{ +z-index: 20; +position: absolute; +left: 0vw; +} + +.flex-container { + padding: 0; + margin: 0; + list-style: none; + + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + + -webkit-flex-flow: row wrap; + justify-content: space-around; + margin-top: -7vw; +} + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/SwichGIT/src/css/fonts/Montserrat-Black.ttf b/SwichGIT/src/css/fonts/Montserrat-Black.ttf new file mode 100644 index 0000000..437b115 Binary files /dev/null and b/SwichGIT/src/css/fonts/Montserrat-Black.ttf differ diff --git a/SwichGIT/src/css/fonts/Montserrat-Black.woff b/SwichGIT/src/css/fonts/Montserrat-Black.woff new file mode 100644 index 0000000..de437e0 Binary files /dev/null and b/SwichGIT/src/css/fonts/Montserrat-Black.woff differ diff --git a/SwichGIT/src/css/fonts/Montserrat-Black.woff2 b/SwichGIT/src/css/fonts/Montserrat-Black.woff2 new file mode 100644 index 0000000..63265f8 Binary files /dev/null and b/SwichGIT/src/css/fonts/Montserrat-Black.woff2 differ diff --git a/SwichGIT/src/css/fonts/Montserrat-ExtraBold.ttf b/SwichGIT/src/css/fonts/Montserrat-ExtraBold.ttf new file mode 100644 index 0000000..80ea806 Binary files /dev/null and b/SwichGIT/src/css/fonts/Montserrat-ExtraBold.ttf differ diff --git a/SwichGIT/src/css/fonts/Montserrat-ExtraBold.woff2 b/SwichGIT/src/css/fonts/Montserrat-ExtraBold.woff2 new file mode 100644 index 0000000..9e51d11 Binary files /dev/null and b/SwichGIT/src/css/fonts/Montserrat-ExtraBold.woff2 differ diff --git a/SwichGIT/src/debug.log b/SwichGIT/src/debug.log new file mode 100644 index 0000000..5e71f47 --- /dev/null +++ b/SwichGIT/src/debug.log @@ -0,0 +1,3 @@ +[1111/102926.535:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d’accès spécifié est introuvable. (0x3) +[1120/122821.005:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d’accès spécifié est introuvable. (0x3) +[1207/113906.684:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d’accès spécifié est introuvable. (0x3) diff --git a/SwichGIT/src/imgs/clicjour.png b/SwichGIT/src/imgs/clicjour.png new file mode 100644 index 0000000..bfe5bdb Binary files /dev/null and b/SwichGIT/src/imgs/clicjour.png differ diff --git a/SwichGIT/src/imgs/clicnuit.png b/SwichGIT/src/imgs/clicnuit.png new file mode 100644 index 0000000..ddab3c8 Binary files /dev/null and b/SwichGIT/src/imgs/clicnuit.png differ diff --git a/SwichGIT/src/imgs/darkcloud.png b/SwichGIT/src/imgs/darkcloud.png new file mode 100644 index 0000000..1180ae6 Binary files /dev/null and b/SwichGIT/src/imgs/darkcloud.png differ diff --git a/SwichGIT/src/imgs/darkmount1.png b/SwichGIT/src/imgs/darkmount1.png new file mode 100644 index 0000000..9db0759 Binary files /dev/null and b/SwichGIT/src/imgs/darkmount1.png differ diff --git a/SwichGIT/src/imgs/darkmount2.png b/SwichGIT/src/imgs/darkmount2.png new file mode 100644 index 0000000..a50ab6d Binary files /dev/null and b/SwichGIT/src/imgs/darkmount2.png differ diff --git a/SwichGIT/src/imgs/lightcloud.png b/SwichGIT/src/imgs/lightcloud.png new file mode 100644 index 0000000..7fffe28 Binary files /dev/null and b/SwichGIT/src/imgs/lightcloud.png differ diff --git a/SwichGIT/src/imgs/mount1.png b/SwichGIT/src/imgs/mount1.png new file mode 100644 index 0000000..01b4e6e Binary files /dev/null and b/SwichGIT/src/imgs/mount1.png differ diff --git a/SwichGIT/src/imgs/mount2.png b/SwichGIT/src/imgs/mount2.png new file mode 100644 index 0000000..99db5d6 Binary files /dev/null and b/SwichGIT/src/imgs/mount2.png differ diff --git a/SwichGIT/src/imgs/swishjour.png b/SwichGIT/src/imgs/swishjour.png new file mode 100644 index 0000000..bd18f11 Binary files /dev/null and b/SwichGIT/src/imgs/swishjour.png differ diff --git a/SwichGIT/src/imgs/swishnuit.png b/SwichGIT/src/imgs/swishnuit.png new file mode 100644 index 0000000..df07fe2 Binary files /dev/null and b/SwichGIT/src/imgs/swishnuit.png differ diff --git a/SwichGIT/src/index.html b/SwichGIT/src/index.html new file mode 100644 index 0000000..9598c9f --- /dev/null +++ b/SwichGIT/src/index.html @@ -0,0 +1,214 @@ + + + + + SwishGame + + + + + + + + + + + + + +
+ + +
+
+
+
    +
  • + i +
    • +
+
+
+
+
+ +
+
+
+ +
+ +
+
+

JOUER

+
+
+ +
+ + +
+
+

Les Règles :

+ × +
+ Swish : Jeu de 60 cartes composé chacun de billes et de cerceaux, de 4 couleurs + différentes possibles. 16 cartes sont posés sur une table et le joueur doit faire superposer + des cartes de manière que chaque bille soit dans le cerceau de même couleur d’une autre + carte. +
+
+
+ +
+
+

Les Paramètres :

+ × +
+
+
+

Mode Forme

+ +
+ +
+ + + +

Choix Couleur

+
+
+
+ + + +
+ +
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+ +
+ + + +
+
+ + +
+
+ + + +
+ +
+
+
0
+
+ +
+ + + + + + + + +
+ + + +
+ +
+

X

+
+ +
+ +
+ +
+
+ + + + + + diff --git a/SwichGIT/src/js/main.js b/SwichGIT/src/js/main.js new file mode 100644 index 0000000..93da65d --- /dev/null +++ b/SwichGIT/src/js/main.js @@ -0,0 +1,864 @@ +var mode = 1; +var nbplayers = 1; +var lightprima = "#DEDEDE"; +var lightsedonca = "#B7B7B7"; +var lighttercia = "#E6E6E6"; + +var darkprima = "#474747"; +var darkseconda = "#393939"; +var darktercia = "#606060"; +var carteselect = []; +var deckPartie = []; //Ensemble des cartes affichées à l'écran + + + + +class Carte { + + constructor(id, allFigure/*,row,column,nbForme*/) { //à décommenter quand il y aura des prametres de partie + //Attribut de Classe + this.identifiant = id; + this.row = 4 /*row*/; + this.column = 3 /*column*/; + this.Matrice = creaMatrice(this.row, this.column); + this.SesFigures = []; + for (var i = 0; i < allFigure.length; i++) { + this.SesFigures.push(allFigure[i]); + } + + //lien clicable + this.link = document.createElement('a'); + this.link.id = this.identifiant; + + //div carte + var divconteneur = document.createElement('div'); + divconteneur.className = "flex-item"; + divconteneur.id = "card" + this.identifiant; + + for (var i = 0; i < 12; i++) { + + var divcase = document.createElement('div'); + divcase.className = "item-form"; + var ajouté = true; + for (var j = 0; j < this.SesFigures.length; j++) { + if (i == this.SesFigures[j].X + (this.SesFigures[j].Y * 3)) { + ajouté = false; + var uneFigure = new Figure(this.SesFigures[j].type[0], this.SesFigures[j].forme, this.SesFigures[j].X, this.SesFigures[j].Y); + divconteneur.appendChild(uneFigure.CodeHTML); + } + } + if (ajouté) { + divconteneur.appendChild(divcase); + } + } + + this.link.appendChild(divconteneur); + //fonction de selection + this.link.onclick = function selectioncarte() { + var macarte = this.id; + var lacarte = "card" + macarte; + + var laCarte = deckPartie[this.id - 1]; //Carte liée avec le code HTML + if (document.getElementById(lacarte).style.boxShadow != "") { + var pos = carteselect.indexOf(laCarte); + carteselect.splice(pos, 1); + document.getElementById(lacarte).style.boxShadow = ""; + } + else { + if (carteselect.length < 5) { + carteselect.push(laCarte); + document.getElementById(lacarte).style.boxShadow = "0 0 1vw red, 0 0 1vw red"; + } + else + window.alert("Bonjour !"); + } + }; + } + + + + get carteVerticale() { + + for (var i = 0; i < this.SesFigures.length; i++) { + this.SesFigures[i].X = this.column - this.SesFigures[i].X - 1; + } + + this.Matrice = creaMatriceVierge(this.row, this.column); + + for (var i = 0; i < this.SesFigures.length; i++) { + for (var j = 0; j < this.SesFigures[i].type.length; j++) { + if (this.SesFigures[i].type[j] == TypeFigure.Petit) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 1; + } else if (this.SesFigures[i].type[j] == TypeFigure.Moyen) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 2; + } else if (this.SesFigures[i].type[j] == TypeFigure.Grand) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 4; + } + } + } + return this; + + } + + get carteHorizontale() { + + for (var i = 0; i < this.SesFigures.length; i++) { + this.SesFigures[i].Y = this.row - this.SesFigures[i].Y - 1; + } + + this.Matrice = creaMatriceVierge(this.row, this.column); + + for (var i = 0; i < this.SesFigures.length; i++) { + for (var j = 0; j < this.SesFigures[i].type.length; j++) { + if (this.SesFigures[i].type[j] == TypeFigure.Petit) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 1; + } else if (this.SesFigures[i].type[j] == TypeFigure.Moyen) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 2; + } else if (this.SesFigures[i].type[j] == TypeFigure.Grand) { + this.Matrice[this.SesFigures[i].X][this.SesFigures[i].Y] += 4; + } + } + } + return this; + } + + get getHTML() { + return this.link; + } + + get getIdentifiant() { + return this.identifiant; + } + + get getMatrice() { + return this.Matrice; + } + + get getSesFigures() { + return this.SesFigures; + } +} + + +class Figure { + + constructor(leType, forme, Cox, Coy) { + this.X = Cox; + this.Y = Coy; + this.type = []; + this.type.push(leType); + this.forme = forme; + var pos = this.X + this.Y * 3; + var divcase = document.createElement('div'); + divcase.className = "item-form"; + //Pour chaque type on regarde les formes + switch (this.forme) { + case FormeFigure.Rond: + switch (this.type[0]) { + + case TypeFigure.Moyen: + + var divContainForm = document.createElement('div'); + divContainForm.className = "containform"; + + var unCercle = document.createElement('div'); + unCercle.className = "anneau"; + unCercle.style.backgroundColor = "var(--colorbase)"; + if (pos == 0 || pos == 2 || pos == 9 || pos == 11) { + unCercle.style.backgroundColor = "var(--colorone)"; + } + if (pos == 1 || pos == 10) { + unCercle.style.backgroundColor = "var(--colortwo)"; + } + if (pos == 4 || pos == 7) { + unCercle.style.backgroundColor = "var(--colorthree)"; + } + + var unRond = document.createElement('div'); + unRond.className = "rondinterieur inté"; + + unCercle.appendChild(unRond); + divContainForm.appendChild(unCercle); + divcase.appendChild(divContainForm); + this.CodeHTML = divcase; + break; + + case TypeFigure.Petit: + + var divContainForm = document.createElement('div'); + divContainForm.className = "containform"; + + var unRond = document.createElement('div'); + unRond.className = "rond"; + unRond.style.backgroundColor = "var(--colorbase)"; + + if (pos == 0 || pos == 2 || pos == 9 || pos == 11) { + unRond.style.backgroundColor = "var(--colorone)"; + } + if (pos == 1 || pos == 10) { + unRond.style.backgroundColor = "var(--colortwo)"; + } + if (pos == 4 || pos == 7) { + unRond.style.backgroundColor = "var(--colorthree)"; + } + divContainForm.appendChild(unRond); + divcase.appendChild(divContainForm); + this.CodeHTML = divcase; + break; + + } + } + } + get getHTML() { + return this.CodeHTML; + } + get getX() { + return this.X; + } + get getY() { + return this.Y; + } + get getType() { + return this.type; + } + get getForme() { + return this.forme; + } + + +} + +const FormeFigure = { + Rond: 'rond', + Carre: 'carre', + Triangle: 'triangle', + Pentagone: 'pentagone', + Losange: 'Losange' +}; + +const TypeFigure = { + Petit: 'petit', + Moyen: 'moyen', + Grand: 'grand' +}; + + +function journuit() { + //mode jour + if (mode % 2 == 0) { + //changer logo swish + document.getElementById("imglogo").src = "imgs/swishjour.png"; + document.getElementById("imglogo2").src = "imgs/swishjour.png"; + /* + MESSAGE POUR CEUX QUI FONT LES TESTS ! Recommentez les lignes après ! Merci + */ + //document.getElementById("fondinput").style.backgroundColor = lightsedonca; + document.getElementById("contourbuttonvalider").style.backgroundColor = lightsedonca; + //document.getElementById("textjouer").style.color = lightsedonca; + //document.getElementById("textplus").style.color = lightprima; + //changer montagnesfond + document.getElementById("mount1").src = "imgs/mount1.png"; + document.getElementById("mount2").src = "imgs/mount2.png"; + //nuages + document.getElementById("cloud").src = "imgs/lightcloud.png"; + //changer background color + //document.getElementById("containplayers").style.color = lightsedonca; + //maj couleur principales + document.documentElement.style.setProperty('--lightprima', lightprima); + document.documentElement.style.setProperty('--lightsedonca', lightsedonca); + document.documentElement.style.setProperty('--lighttercia', lighttercia); + } + //mode nuit + else { + //changer logo swish + document.getElementById("imglogo").src = "imgs/swishnuit.png"; + document.getElementById("imglogo2").src = "imgs/swishnuit.png"; + + //document.getElementById("fondinput").style.backgroundColor = darkseconda; + document.getElementById("contourbuttonvalider").style.backgroundColor = darkseconda; + //document.getElementById("textjouer").style.color = darkseconda; + //document.getElementById("textplus").style.color = darkprima; + //changer montagnesfond + document.getElementById("mount1").src = "imgs/darkmount1.png"; + document.getElementById("mount2").src = "imgs/darkmount2.png"; + //nuages + document.getElementById("cloud").src = "imgs/darkcloud.png"; + //mode nuit + //document.getElementById("containplayers").style.color = darkseconda; + //maj couleur principales + document.documentElement.style.setProperty('--lightprima', darkprima); + document.documentElement.style.setProperty('--lightsedonca', darkseconda); + document.documentElement.style.setProperty('--lighttercia', darktercia); + } + mode = mode + 1; +} + +//=================================================================================== +//FONCTION GESTION DE GAME + +function lancerpartie() { + document.getElementById("pageAccueil").style.visibility = "hidden"; + //fonction de création de partie à changer en fonction du test voulu + genererTouteslesCartes3_4Possibles(); + document.getElementById("pageGame").style.visibility = "visible"; +} + +function retour() { + document.getElementById("pageAccueil").style.visibility = "visible"; + document.getElementById("pageGame").style.visibility = "hidden"; +} + +function rechargerGAME() { + while (document.getElementById("containcards").firstElementChild != null) { + document.getElementById("containcards").firstElementChild.remove(); + } + for (var i = 0; i < deckPartie.length; i++) { + document.getElementById("containcards").appendChild(deckPartie[i].getHTML); + } +} +//================================================================================================================================================================ +//Fonction créations de game + +function genererTouteslesCartes3_4Possibles() { + deckPartie = []; + carteselect = []; + while (document.getElementById("containcards").firstElementChild != null) { + document.getElementById("containcards").firstElementChild.remove(); + } + for (var k = 0; k < 2; k++) { + for (var j = 0; j < 2; j++) { + for (var i = 0; i < 12; i++) { + var AllFigure = []; + AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, k, j)); + if (i != k + 3 * j) { + if (k == 0) { + AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, i % 3, Math.floor(i / 3))); + var uneCarte = new Carte(i + 12 * j , AllFigure); + deckPartie.push(uneCarte); + document.getElementById("containcards").appendChild(uneCarte.link); + } else if (i != 2 && i != 5 && i != 8 && i != 11) { + AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, i % 3, Math.floor(i / 3))); + var uneCarte = new Carte(i + 12 * (1 + k + j), AllFigure); + deckPartie.push(uneCarte); + document.getElementById("containcards").appendChild(uneCarte.link); + } + } + } + } + } +} + +function creePartieDeTest() { + deckPartie = []; + carteselect = []; + while (document.getElementById("containcards").firstElementChild != null) { + document.getElementById("containcards").firstElementChild.remove(); + } + for (var j = 1; j <= 16; j++) { + + var AllFigure = []; + var Cox1, Coy1, Cox2, Coy2; + + Cox1 = getRandom(0, 2); + Coy1 = getRandom(0, 3); + AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, Cox1, Coy1)); + + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + + while (Cox2 == Cox1 && Coy1 == Coy2) { + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + } + AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, Cox2, Coy2)); + //Code de Génération de Figure + var uneCarte = new Carte(j, AllFigure); + + deckPartie.push(uneCarte); + + document.getElementById("containcards").appendChild(uneCarte.link); + } +} + +//======================================================================================================================================================== +//Changer les cartes + +function changerlesCartes() { + while (carteselect.length != 0) { + remplacerLaCarte(carteselect[0]); + carteselect.shift(); + } + rechargerGAME(); +} + +function remplacerLaCarte(uneCarte) { + pos = deckPartie.indexOf(uneCarte); + var AllFigure = []; + var Cox1, Coy1, Cox2, Coy2; + + Cox1 = getRandom(0, 2); + Coy1 = getRandom(0, 3); + AllFigure.push(new Figure(TypeFigure.Petit, FormeFigure.Rond, Cox1, Coy1)); + + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + + while (Cox2 == Cox1 && Coy1 == Coy2) { + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + } + AllFigure.push(new Figure(TypeFigure.Moyen, FormeFigure.Rond, Cox2, Coy2)); + var newCarte = new Carte(pos + 1, AllFigure); + deckPartie[pos] = newCarte; +} + +//==================================================================================== +//GESTION DE MATRICE + +function somMatrice(matrice1, matrice2, row, column) { + var somMatrice = creaMatriceVierge(row, column); + for (var i = 0; i < column; i++) { + for (var j = 0; j < row; j++) { + somMatrice[i][j] = matrice1[i][j] + matrice2[i][j]; + } + } + return somMatrice; +} + +function copieMatrice(laMatrice, row, column) { + var myMatrice = new Array(); + for (var i = 0; i < column; i++) { + myMatrice[i] = new Array(); + for (var j = 0; j < row; j++) { + myMatrice[i][j] = laMatrice[i][j]; + } + } + return myMatrice; +} + +function getRandom(min, max) { + return Math.round(Math.random() * (max - min) + min) +} + +function creaMatriceVierge(row, column) { + var myMatrice = new Array(); + for (var i = 0; i < column; i++) { + myMatrice[i] = new Array(); + for (var j = 0; j < row; j++) { + myMatrice[i][j] = 0; + } + } + return myMatrice; +} + +function creaMatrice(row, column) { + + var myMatrice = creaMatriceVierge(row, column); + + var Cox1, Coy1, Cox2, Coy2; + + Cox1 = getRandom(0, 2); + Coy1 = getRandom(0, 3); + + myMatrice[Cox1][Coy1] = 1; + + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + + while (Cox2 == Cox1 && Coy1 == Coy2) { + Cox2 = getRandom(0, 2); + Coy2 = getRandom(0, 3); + } + myMatrice[Cox2][Coy2] = 2; + + return myMatrice; + +} + +//================================================================================= +//chercheCombi => Compte les combinainsons de 2 cartes à l'écran +function chercheCombi2() { + + var Cptsolution = 0; + for (var i = 0; i < 15; i++) { + + for (var j = 0; j < 15 - i; j++) { + + var DeckTeste = []; + var tab = []; + DeckTeste.push(deckPartie[i]); + DeckTeste.push(deckPartie[j+i+1]); + + var copie = []; + for (var h = 0; h < DeckTeste.length; h++) { + copie.push(DeckTeste[i]); + } + tab = AssemblageARBRE(DeckTeste, DeckTeste[0]); + window.alert("Combinaison : "+DeckTeste[i].getIdentifiant+DeckTeste[j+i+1].getIdentifiant); //+1 au niveau des identifiants + var solution = true; + var tabCode = []; + for (var i = 0; i < tab.length; i++) { + tabCode.push(tab[i].code); + } + window.alert(tabCode); + for (var i = 0; i < tab.length; i++) { + if (tab[i].code == carteselect.length) { + solution = false; + //window.alert("yo mec"); + } + } + if (solution) { + Cptsolution++; + window.alert("Combinaison : ", DeckTeste[i].getIdentifiant,DeckTeste[j].getIdentifiant); + } + } + } + + window.alert("Nombre de solution à 2 cartes : ", Cptsolution); +} + +//================================================================================= +//FONCTION DE TEST => permet de tester des fonctionnalité via le bouton VALIDER + +//Code de la barre d'écoulement du temps +var cpt = 101; +var x; +var itv = 0; + + +function decompte() { + + var progressnum = document.getElementById("progressnum"); + var indicateur = document.getElementById("indicateur"); + + + + if (cpt >= 0) { + + cpt--; + x = setTimeout("decompte()", 1000); + } + + else { + clearTimeout(x); + } + + if (cpt == 0) { + window.alert("fin du jeu"); + retour(); + window.location.reload(); + clearInterval(itv); + } + + if(cpt <= 0) { + clearInterval(itv); + return; + } + + if(cpt < 50) { + document.getElementById("indicateur").style.backgroundColor = "orange"; + + } + + if(cpt < 20) { + document.getElementById("indicateur").style.backgroundColor = "red"; + } + + indicateur.style.width = cpt + "px"; + progressnum.innerHTML = cpt; + +} + + +function test() { + try { + if (carteselect.length == 0) { + window.alert("Selection Vide"); + return; + } else if (carteselect.length < 2) { + window.alert("Selection Trop Petite"); + return; + } else { + var copie = []; + for (var i = 0; i < carteselect.length; i++) { + copie.push(carteselect[i]); + } + var tab = []; + tab = AssemblageARBRE(copieListeDeCarte(copie), carteselect[0]); + var solution = true; + var tabCode = []; + for (var i = 0; i < tab.length; i++) { + tabCode.push(tab[i].code); + } + for (var i = 0; i < tab.length; i++) { + if (tab[i].code == carteselect.length) { + solution = false; + cpt = cpt + 5 * copie.length; + changerlesCartes(); + } + } + if (solution) { + window.alert("Rien trouvé chef !!!"); + } + if (!solution) { + window.alert("J'ai une solution chef !!!!"); + } + + } + } catch (e) { + window.alert(e); + } +} + +//=================================================================================== +//Function de copie diverse + +function copieListeDeCarte(Liste) { + var copie = []; + for (var i = 0; i < Liste.length; i++) { + copie.push(copieCarte(Liste[i])); + } + return copie; +} + +function copieCarte(uneCarte) { + if (uneCarte == null) { + return null; + } + var carte = new Carte(uneCarte.getIdentifiant, uneCarte.SesFigures); + carte.SesFigures = new Array(); + for (var i = 0; i < uneCarte.SesFigures.length; i++) { + carte.SesFigures.push(new Figure(uneCarte.SesFigures[i].type[0], uneCarte.SesFigures[i].getForme, uneCarte.SesFigures[i].getX, uneCarte.SesFigures[i].getY)); + if (uneCarte.SesFigures[i].type.length > 1) { + for (var j = 1; j < uneCarte.SesFigures[i].type.length; j++) { + carte.SesFigures[carte.SesFigures.length - 1].type.push(uneCarte.SesFigures[i].type[j]); + } + } + } + carte.Matrice = copieMatrice(uneCarte.Matrice, uneCarte.row, uneCarte.column); + return carte; +} + +function copieLiseDeFigure(Liste) { + var copie = []; + for (var i = 0; i < Liste.length; i++) { + copie.push(copieFigure(Liste[i])); + window.alert("code " + copie[i].CodeHTML) + } + return copie; +} + +function copieFigure(uneFigure) { + window.alert("Avant copiage " + uneFigure.CodeHTML) + if (uneFigure == null) { + return null; + } + window.alert("je fais la copie") + var copie = new Figure(uneFigure.type, uneFigure.forme, uneFigure.X, uneFigure.Y); + return copie; +} +//===================================================================================================== +//Function de manipulataion de Carte + +function Verticale(coCarte) { + var laCarte; + laCarte = copieCarte(coCarte); + laCarte = laCarte.carteVerticale; + return laCarte; +} + +function Horizontale(coCarte) { + var laCarte; + laCarte = copieCarte(coCarte); + laCarte = laCarte.carteHorizontale; + return laCarte; +} + +//============================================================================================================================== + +//FONCTION POUR TESTER L'ARBRE + +class CODE { + constructor(Carte) { + this.code = 0; + this.laCarte = Carte; + } +} + +function AssemblageARBRE(TasDeCarte, Carte) { + var uneTable = copieListeDeCarte(TasDeCarte); + var tab = new Array(); + var tabCode = new Array(); + uneTable.splice(0, 1); + if (uneTable.length == 0) { + var leCode = new CODE(Carte); + tab.push(leCode); + return tab; + } + tab.push(AssemblageARBRE(uneTable, copieCarte(uneTable[0]))); + tab.push(AssemblageARBRE(uneTable, Horizontale(uneTable[0]))); + tab.push(AssemblageARBRE(uneTable, Verticale(uneTable[0]))); + var derniereCarte = Horizontale(Verticale(uneTable[0])); + tab.push(AssemblageARBRE(uneTable, derniereCarte)); + for (var i = 0; i < tab.length; i++) { + for (var j = 0; j < tab[i].length; j++) { + tabCode.push(tab[i][j]); + } + } + + for (var i = 0; i < tabCode.length; i++) { + if (tabCode[i].code != -1) { + var enregistrement = tabCode[i].code; + tabCode[i] = comparaisonARBRE(tabCode[i].laCarte, Carte); + tabCode[i].code += enregistrement; + } + } + return tabCode; +} + + +function comparaisonARBRE(CarteMereEntree, CarteFilleEntree) { + var retour = []; + var liaison = 0; + var CarteMere = copieCarte(CarteMereEntree); + var CarteFille = copieCarte(CarteFilleEntree); + for (var i = 0; i < CarteFille.SesFigures.length; i++) { + for (var j = 0; j < CarteMere.SesFigures.length; j++) { + if (CarteFille.SesFigures[i].X == CarteMere.SesFigures[j].X) { + if (CarteFille.SesFigures[i].Y == CarteMere.SesFigures[j].Y) { + //Coordonnées identiques + if (CarteFille.SesFigures[i].forme == CarteMere.SesFigures[j].forme) { + //Forme identiques + for (var k = 0; k < CarteMere.SesFigures[j].type.length; k++) { + if (CarteFille.SesFigures[i].type[0] == TypeFigure.Petit) { + if (CarteMere.SesFigures[j].type[k] == TypeFigure.Petit) { + var leCode = new CODE(CarteMere); + leCode.code = -1; + return leCode; + } + } else if (CarteFille.SesFigures[i].type[0] == TypeFigure.Moyen) { + if (CarteMere.SesFigures[j].type[k] == TypeFigure.Moyen) { + var leCode = new CODE(CarteMere); + leCode.code = -1; + return leCode; + } + } else if (CarteFille.SesFigures[i].type[0] == TypeFigure.Grand) { + if (CarteMere.SesFigures[j].type[k] == TypeFigure.Grand) { + var leCode = new CODE(CarteMere); + leCode.code = -1; + return leCode; + } + } + } + //Si le type de la figure n'y est pas on l'ajoute à la liste de carte Mere; + liaison = liaison + 1; + CarteMere.SesFigures[j].type.push(CarteFille.SesFigures[i].type[0]); + } else { + var leCode = new CODE(CarteMere); + leCode.code = -1; + return leCode; + } + } + } + } + } + var CarteSomme = SommeDeCarte(CarteMere, copieCarte(CarteFille)); + var leCode = new CODE(CarteSomme); + leCode.code = liaison; + return leCode; +} + +function SommeDeCarte(CarteMere, CarteFille) { + CarteMere.Matrice = creaMatriceVierge(CarteMere.row, CarteMere.column); + for (var i = 0; i < CarteFille.SesFigures.length; i++) { + var manquant = true; + for (var j = 0; j < CarteMere.SesFigures.length; j++) { + if (CarteFille.SesFigures[i].X == CarteMere.SesFigures[j].X) { + if (CarteFille.SesFigures[i].Y == CarteMere.SesFigures[j].Y) { + manquant = false; + } + } + } + if (manquant) { + CarteMere.SesFigures.push(CarteFille.SesFigures[i]); + } + } + + for (var i = 0; i < CarteMere.SesFigures.length; i++) { + for (var j = 0; j < CarteMere.SesFigures[i].type.length; j++) { + if (CarteMere.SesFigures[i].type[j] == TypeFigure.Petit) { + CarteMere.Matrice[CarteMere.SesFigures[i].X][CarteMere.SesFigures[i].Y] += 1; + } else if (CarteMere.SesFigures[i].type[j] == TypeFigure.Moyen) { + CarteMere.Matrice[CarteMere.SesFigures[i].X][CarteMere.SesFigures[i].Y] += 2; + } else if (CarteMere.SesFigures[i].type[j] == TypeFigure.Grand) { + CarteMere.Matrice[CarteMere.SesFigures[i].X][CarteMere.SesFigures[i].Y] += 4; + } + } + } + return CarteMere; +} + +//================================================================================================================================ + +//================================================================================== + + + +function ChoisirPseudo() { + let nom = localStorage.getItem('nom'); + if (nom == null) { + nom = "SWISH"; + } + document.getElementById('inputpseudo').setAttribute('value', nom); +}; + +function EnvoyerNouveauNom() { + + let pseudo = document.getElementById('inputpseudo').value; + localStorage.setItem('nom', pseudo); + document.location.reload(true); + +}; + + + +/* +function addplayer(){ + //j'ai mis une limite de 6joueurs, mais c'est à voir + if(nbplayers < 7){ + //création de la div contenant le pseudo + var divpseudo = document.createElement('div'); + divpseudo.id = 'pseudolist'; + //reprise du pseudo entré par le joueur + var pseudo = document.getElementById("inputpseudo").value; + //vérification si pseudo vide pour lui donner un pseudo du style "Joueur3" + if(pseudo == "") + { + pseudo = "Joueur " + nbplayers; + } + //création du text-pseudo + var tag = document.createElement("p"); + tag.className = "pseudojoueur"; + var text = document.createTextNode(pseudo); + tag.appendChild(text); + //mise du text dans la division + divpseudo.appendChild(tag); + //insertion pseudo dans liste + document.getElementById("containplayers").appendChild(divpseudo); + //remise input vide ;) + document.getElementById("inputpseudo").value = ""; + nbplayers = nbplayers +1; + } +} + +function ajouterplayer(event){ + if(event.keyCode == 13) + addplayer(); +} + +*/ + + + + +