1
0
mirror of https://github.com/Chouchen/motsmeles.git synced 2018-06-07 06:04:38 +02:00

Merge pull request #1 from Chouchen/nettoyage_css_et_html

Cleaning complete.
This commit is contained in:
Shikiryu 2015-01-27 17:10:17 +01:00
commit 70d9e16cb2
5 changed files with 13 additions and 25 deletions

View File

@ -1 +1 @@
body{font-family:Helvetica,Arial,sans-serif;font-size:20px;font-weight:700}h1{width:600px;text-align:center;margin:15px auto;z-index:10;font-weight:700;color:#6C9BD9;font-size:50px}ul{list-style:none;float:left;margin:100px 0 50px;line-height:28px}ul li.validate{color:green;font-weight:700;text-decoration:line-through}ul li.validate:before{content:'\2713 ';color:green;font-weight:700}.canvas-container{float:left;margin:100px 30px 30px 50px}#playground{background:url(feuille-de-papier.jpg) top left no-repeat;display:block;width:600px;height:600px;margin:0 auto} body{font-family:Helvetica,Arial,sans-serif;font-size:20px;font-weight:700}h1{width:600px;text-align:center;margin:15px auto;z-index:10;font-weight:700;color:#6C9BD9;font-size:50px}ul{list-style:none;float:left;margin:50px 30px;line-height:20px;font-size:16px}ul li.validate{color:green;font-weight:700;text-decoration:line-through}ul li.validate:before{content:'\2713 ';color:green;font-weight:700}.canvas-container{float:left;margin:50px 30px}#playground{display:block;width:600px;height:600px;margin:0 auto}

12
dist/index.html vendored
View File

@ -4,20 +4,14 @@
<title>Mot mélés</title> <title>Mot mélés</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/fabric.1.4.0.min.js"></script> <script src="js/fabric.1.4.0.min.js"></script>
<script src="js/const.js"></script> <link rel="stylesheet" type="text/css" href="css/motsmeles.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
</head> </head>
<body> <body>
<h1>Mots Mélés</h1> <h1>Mots Mélés</h1>
<div id="playground"> <div id="playground">
<div id="firstGame">
<canvas id="c"></canvas> <canvas id="c"></canvas>
<ul id="words"></ul>
<ul id="words">
</ul>
</div> </div>
</div> <script src="js/motsmeles.min.js"></script>
<script src="js/script.js"></script>
</body> </body>
</html> </html>

View File

@ -1,2 +1,2 @@
/*! motsmeles 2015-01-26 */ /*! motsmeles 2015-01-27 */
var SIZE=30,NUMCASE=10,GRID=[["S","S","S","A","U","B","A","G","N","E"],["E","P","A","A","M","V","E","N","C","E"],["L","U","L","M","I","R","A","M","A","S"],["R","A","O","G","E","X","A","C","O","E"],["A","L","N","E","G","N","A","R","O","R"],["T","O","U","L","O","N","G","L","R","E"],["N","D","S","T","N","U","E","I","E","Y"],["I","N","P","E","E","N","I","L","D","H"],["C","A","S","S","U","J","E","R","F","L"],["E","B","E","L","S","I","S","S","A","C"]],words=["AIX","APT","ARLES","AUBAGNE","AUPS","AVIGNON","BANDOL","CANNES","CASSIS","DIGNE","FREJUS","HYERES","LUNEL","MIRAMAS","NICE","ORANGE","SALON","SORGUES","TOULON","VENCE"],reponse="BA";!function(a,b,c,d,e,f,g){var h,i,j,k,l=new a.Canvas("c",{selection:!1}),m=[],n=[],o=!1;l.setDimensions({width:c*d+d,height:c*d+d});var p=a.util.createClass(a.Rect,{type:"labeledRect",initialize:function(a){a=a||{},this.callSuper("initialize",a),this.set("label",a.label||"")},toObject:function(){return a.util.object.extend(this.callSuper("toObject"),{label:this.get("label")})},_render:function(a){this.callSuper("_render",a),a.font="20px Helvetica",a.fillStyle="#333",a.fillText(this.label,-this.width/2+5,-this.height/2+20)}}),q=function(){var a,b,c,d=-1,f=m[0]===n[0],h=m[1]===n[1],i="";if(f){for(b=Math.min(m[1],n[1]),c=Math.max(m[1],n[1]),a=b;c>=a;a++)i+=e[m[0]][a];return Math.max(g.indexOf(i),g.indexOf(i.split("").reverse().join("")))}if(h){for(b=Math.min(m[0],n[0]),c=Math.max(m[0],n[0]),a=b;c>=a;a++)i+=e[a][m[1]];return Math.max(g.indexOf(i),g.indexOf(i.split("").reverse().join("")))}return d},r=function(a){var c=b.getElementById("words").getElementsByTagName("li"),d=c.length;for(j=0;d>j;j++)if(c[j].textContent===a){c[j].className="validate";break}};for(h=0;d>h;h++)for(i=0;d>i;i++){var s=new p({left:h*c,top:i*c,fill:"white",stroke:"black",width:c,height:c,label:e[i][h],selectable:!1});l.add(s)}for(var t=0;t<g.length;t++){var u=b.createElement("li");u.innerHTML=g[t].toUpperCase(),b.getElementById("words").appendChild(u)}l.on("mouse:down",function(b){o=!0;var d=l.getPointer(b.e),e=[d.x,d.y,d.x,d.y];m=[Math.floor(e[1]/c),Math.floor(e[0]/c)],k=new a.Line(e,{stroke:"black",strokeLineCap:"round",strokeWidth:c/2,originX:"center",originY:"center"}),l.add(k)}),l.on("mouse:move",function(a){if(o){var b=l.getPointer(a.e);k.set({x2:b.x,y2:b.y}),l.renderAll()}}),l.on("mouse:up",function(b){o=!1;var d=l.getPointer(b.e),e=[d.x,d.y];if(n=[Math.floor(e[1]/c),Math.floor(e[0]/c)],l.remove(k),m[0]!==n[0]||m[1]!==n[1]){var f=q();if(-1!==f){var h=g[f];h=m.reverse().join("").concat(n.reverse().join("")).split(""),h=h.map(function(a){return a*c+c/2});var i=new a.Line(h,{stroke:"black",strokeLineCap:"round",strokeWidth:c/2,originX:"center",originY:"center",selectable:!1});r(g[f]),g.splice(f,1),l.add(i),0===g.length&&v()}}m=[],n=[]});var v=function(){}}(fabric,document,SIZE,NUMCASE,GRID,reponse,words); var SIZE=30,NUMCASE=10,GRID=[["S","S","S","A","U","B","A","G","N","E"],["E","P","A","A","M","V","E","N","C","E"],["L","U","L","M","I","R","A","M","A","S"],["R","A","O","G","E","X","A","C","O","E"],["A","L","N","E","G","N","A","R","O","R"],["T","O","U","L","O","N","G","L","R","E"],["N","D","S","T","N","U","E","I","E","Y"],["I","N","P","E","E","N","I","L","D","H"],["C","A","S","S","U","J","E","R","F","L"],["E","B","E","L","S","I","S","S","A","C"]],words=["AIX","APT","ARLES","AUBAGNE","AUPS","AVIGNON","BANDOL","CANNES","CASSIS","DIGNE","FREJUS","HYERES","LUNEL","MIRAMAS","NICE","ORANGE","SALON","SORGUES","TOULON","VENCE"],reponse="BA";!function(a,b,c,d,e,f,g){var h,i,j,k,l=new a.Canvas("c",{selection:!1}),m=[],n=[],o=!1;l.setDimensions({width:c*d+d,height:c*d+d});var p=a.util.createClass(a.Rect,{type:"labeledRect",initialize:function(a){a=a||{},this.callSuper("initialize",a),this.set("label",a.label||"")},toObject:function(){return a.util.object.extend(this.callSuper("toObject"),{label:this.get("label")})},_render:function(a){this.callSuper("_render",a),a.font="20px Helvetica",a.fillStyle="#333",a.fillText(this.label,-this.width/2+5,-this.height/2+20)}}),q=function(){var a,b,c,d=-1,f=m[0]===n[0],h=m[1]===n[1],i="";if(f){for(b=Math.min(m[1],n[1]),c=Math.max(m[1],n[1]),a=b;c>=a;a++)i+=e[m[0]][a];return Math.max(g.indexOf(i),g.indexOf(i.split("").reverse().join("")))}if(h){for(b=Math.min(m[0],n[0]),c=Math.max(m[0],n[0]),a=b;c>=a;a++)i+=e[a][m[1]];return Math.max(g.indexOf(i),g.indexOf(i.split("").reverse().join("")))}return d},r=function(a){var c=b.getElementById("words").getElementsByTagName("li"),d=c.length;for(j=0;d>j;j++)if(c[j].textContent===a){c[j].className="validate";break}};for(h=0;d>h;h++)for(i=0;d>i;i++){var s=new p({left:h*c,top:i*c,fill:"white",stroke:"black",width:c,height:c,label:e[i][h],selectable:!1});l.add(s)}for(var t=0;t<g.length;t++){var u=b.createElement("li");u.innerHTML=g[t].toUpperCase(),b.getElementById("words").appendChild(u)}l.on("mouse:down",function(b){o=!0;var d=l.getPointer(b.e),e=[d.x,d.y,d.x,d.y];m=[Math.floor(e[1]/c),Math.floor(e[0]/c)],k=new a.Line(e,{stroke:"black",strokeLineCap:"round",strokeWidth:c/2,originX:"center",originY:"center"}),l.add(k)}),l.on("mouse:move",function(a){if(o){var b=l.getPointer(a.e);k.set({x2:b.x,y2:b.y}),l.renderAll()}}),l.on("mouse:up",function(b){o=!1;var d=l.getPointer(b.e),e=[d.x,d.y];if(n=[Math.floor(e[1]/c),Math.floor(e[0]/c)],l.remove(k),m[0]!==n[0]||m[1]!==n[1]){var f=q();if(-1!==f){var h=g[f];h=m.reverse().join("").concat(n.reverse().join("")).split(""),h=h.map(function(a){return a*c+c/2});var i=new a.Line(h,{stroke:"black",strokeLineCap:"round",strokeWidth:c/2,originX:"center",originY:"center",selectable:!1});r(g[f]),g.splice(f,1),l.add(i),0===g.length&&v()}}m=[],n=[]});var v=function(){}}(fabric,document,SIZE,NUMCASE,GRID,reponse,words);

View File

@ -12,8 +12,8 @@ h1 {
color: #6C9BD9; color: #6C9BD9;
font-size: 50px; font-size: 50px;
} }
ul {list-style: none; float: left; margin: 100px 0 50px 0; line-height: 28px;} ul {list-style: none; float: left; margin: 50px 30px; line-height: 20px; font-size: 16px}
ul li.validate {color: green; font-weight: bold; text-decoration : line-through;} ul li.validate {color: green; font-weight: bold; text-decoration : line-through;}
ul li.validate:before {content: '\2713 '; color: green; font-weight: bold;} ul li.validate:before {content: '\2713 '; color: green; font-weight: bold;}
.canvas-container {float: left; margin: 100px 30px 30px 50px;} .canvas-container {float: left; margin: 50px 30px;}
#playground {background: url(feuille-de-papier.jpg) top left no-repeat; display: block; width: 600px; height:600px; margin: 0 auto;} #playground {display: block; width: 600px; height:600px; margin: 0 auto;}

View File

@ -4,20 +4,14 @@
<title>Mot mélés</title> <title>Mot mélés</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/fabric.1.4.0.min.js"></script> <script src="js/fabric.1.4.0.min.js"></script>
<script src="js/const.js"></script> <link rel="stylesheet" type="text/css" href="css/motsmeles.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
</head> </head>
<body> <body>
<h1>Mots Mélés</h1> <h1>Mots Mélés</h1>
<div id="playground"> <div id="playground">
<div id="firstGame">
<canvas id="c"></canvas> <canvas id="c"></canvas>
<ul id="words"></ul>
<ul id="words">
</ul>
</div> </div>
</div> <script src="js/motsmeles.min.js"></script>
<script src="js/script.js"></script>
</body> </body>
</html> </html>