Intégration images dans Mémory

This commit is contained in:
alexandre-pereira 2015-03-15 19:38:11 +01:00
parent 0cfce7d1f9
commit 4ef3e7e8b3
8 changed files with 74 additions and 97 deletions

View File

@ -22,9 +22,9 @@ class APIController extends Controller {
public function refByName($reg = "") {
if(!empty($reg))
$res = User::referents()->name($reg)->get();
$res = Referent::where('nom', 'like', '%'.$reg.'%')->orWhere('prenom', 'like', '%'.$reg.'%')->select(['nom', 'prenom', 'image', 'id'])->get();
else
$res = User::referents()->get();
$res = User::referents()->get(5);
return Response::json($res->toArray());
}

View File

@ -27,8 +27,10 @@ class GameController extends Controller {
}
public function playMemo() {
return view('frontend/memo');
$idRef = Cookie::get('referent');
$configjeu = Referent::find($idRef)->configjeu()->where('actifPuzzle', '=', '1')->first();
$oes = $configjeu->oeuvres;
return view('frontend/memo', ['oeuvres' => $oes]);
}
public function chooseDifPuzzle() {

View File

@ -108,7 +108,7 @@ class ReferentController extends Controller {
$mesoeuvres = $me->configjeu->find($idListe);
return view('backend/ref_home',['meslistes' => $meslistes, 'mesoeuvres' => $mesoeuvres, 'me' => $me, 'listeoeuvres' => $listeoeuvres,
'auteurs' => Auteur::all(), 'domaines' => Domaine::all(), 'matieres' => Matiere::all(), 'techniques' => Technique::all()
'auteurs' => Auteur::all(), 'domaines' => Domaine::all(), 'matieres' => Matiere::all(), 'techniques' => Technique::all(), 'paramjeu' => json_decode($mesoeuvres->parametres)
]);
}
@ -155,7 +155,7 @@ class ReferentController extends Controller {
if(!$valid)
Session::flash('erreur', 'Les paramètres du jeu sont incorrect. Rééessayez.');
else {
Session::flash('message', 'Vos modifications ont été prisent en compte.');
Session::flash('message', 'Vos modifications ont été prise en compte.');
$configjeu->parametres = json_encode($paramsToSave);
$configjeu->save();
}

View File

@ -1 +0,0 @@
"document"in self&&("classList"in document.createElement("_")?!function(){"use strict";var a=document.createElement("_");if(a.classList.add("c1","c2"),!a.classList.contains("c2")){var b=function(a){var b=DOMTokenList.prototype[a];DOMTokenList.prototype[a]=function(a){var c,d=arguments.length;for(c=0;d>c;c++)a=arguments[c],b.call(this,a)}};b("add"),b("remove")}if(a.classList.toggle("c3",!1),a.classList.contains("c3")){var c=DOMTokenList.prototype.toggle;DOMTokenList.prototype.toggle=function(a,b){return 1 in arguments&&!this.contains(a)==!b?b:c.call(this,a)}}a=null}():!function(a){"use strict";if("Element"in a){var b="classList",c="prototype",d=a.Element[c],e=Object,f=String[c].trim||function(){return this.replace(/^\s+|\s+$/g,"")},g=Array[c].indexOf||function(a){for(var b=0,c=this.length;c>b;b++)if(b in this&&this[b]===a)return b;return-1},h=function(a,b){this.name=a,this.code=DOMException[a],this.message=b},i=function(a,b){if(""===b)throw new h("SYNTAX_ERR","An invalid or illegal string was specified");if(/\s/.test(b))throw new h("INVALID_CHARACTER_ERR","String contains an invalid character");return g.call(a,b)},j=function(a){for(var b=f.call(a.getAttribute("class")||""),c=b?b.split(/\s+/):[],d=0,e=c.length;e>d;d++)this.push(c[d]);this._updateClassName=function(){a.setAttribute("class",this.toString())}},k=j[c]=[],l=function(){return new j(this)};if(h[c]=Error[c],k.item=function(a){return this[a]||null},k.contains=function(a){return a+="",-1!==i(this,a)},k.add=function(){var a,b=arguments,c=0,d=b.length,e=!1;do a=b[c]+"",-1===i(this,a)&&(this.push(a),e=!0);while(++c<d);e&&this._updateClassName()},k.remove=function(){var a,b,c=arguments,d=0,e=c.length,f=!1;do for(a=c[d]+"",b=i(this,a);-1!==b;)this.splice(b,1),f=!0,b=i(this,a);while(++d<e);f&&this._updateClassName()},k.toggle=function(a,b){a+="";var c=this.contains(a),d=c?b!==!0&&"remove":b!==!1&&"add";return d&&this[d](a),b===!0||b===!1?b:!c},k.toString=function(){return this.join(" ")},e.defineProperty){var m={get:l,enumerable:!0,configurable:!0};try{e.defineProperty(d,b,m)}catch(n){-2146823252===n.number&&(m.enumerable=!1,e.defineProperty(d,b,m))}}else e[c].__defineGetter__&&d.__defineGetter__(b,l)}}(self));

9
SRC/public/js/masonry.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -98,7 +98,7 @@
this.flippedTiles = 0;
this.chosenLevel = "";
this.numMoves = 0;
this._setupGameWrapper(1);
this._setupGameWrapper(3);
}
/**
@ -233,7 +233,10 @@
* class from the gamePlayEvents function.
*/
Memory.prototype._gameCardsMatch = function() {
"document"in self&&("classList"in document.createElement("_")?!function(){"use strict";var a=document.createElement("_");if(a.classList.add("c1","c2"),!a.classList.contains("c2")){var b=function(a){var b=DOMTokenList.prototype[a];DOMTokenList.prototype[a]=function(a){var c,d=arguments.length;for(c=0;d>c;c++)a=arguments[c],b.call(this,a)}};b("add"),b("remove")}if(a.classList.toggle("c3",!1),a.classList.contains("c3")){var c=DOMTokenList.prototype.toggle;DOMTokenList.prototype.toggle=function(a,b){return 1 in arguments&&!this.contains(a)==!b?b:c.call(this,a)}}a=null}():!function(a){"use strict";if("Element"in a){var b="classList",c="prototype",d=a.Element[c],e=Object,f=String[c].trim||function(){return this.replace(/^\s+|\s+$/g,"")},g=Array[c].indexOf||function(a){for(var b=0,c=this.length;c>b;b++)if(b in this&&this[b]===a)return b;return-1},h=function(a,b){this.name=a,this.code=DOMException[a],this.message=b},i=function(a,b){if(""===b)throw new h("SYNTAX_ERR","An invalid or illegal string was specified");if(/\s/.test(b))throw new h("INVALID_CHARACTER_ERR","String contains an invalid character");return g.call(a,b)},j=function(a){for(var b=f.call(a.getAttribute("class")||""),c=b?b.split(/\s+/):[],d=0,e=c.length;e>d;d++)this.push(c[d]);this._updateClassName=function(){a.setAttribute("class",this.toString())}},k=j[c]=[],l=function(){return new j(this)};if(h[c]=Error[c],k.item=function(a){return this[a]||null},k.contains=function(a){return a+="",-1!==i(this,a)},k.add=function(){var a,b=arguments,c=0,d=b.length,e=!1;do a=b[c]+"",-1===i(this,a)&&(this.push(a),e=!0);while(++c<d);e&&this._updateClassName()},k.remove=function(){var a,b,c=arguments,d=0,e=c.length,f=!1;do for(a=c[d]+"",b=i(this,a);-1!==b;)this.splice(b,1),f=!0,b=i(this,a);while(++d<e);f&&this._updateClassName()},k.toggle=function(a,b){a+="";var c=this.contains(a),d=c?b!==!0&&"remove":b!==!1&&"add";return d&&this[d](a),b===!0||b===!1?b:!c},k.toString=function(){return this.join(" ")},e.defineProperty){var m={get:l,enumerable:!0,configurable:!0};try{e.defineProperty(d,b,m)}catch(n){-2146823252===n.number&&(m.enumerable=!1,e.defineProperty(d,b,m))}}else e[c].__defineGetter__&&d.__defineGetter__(b,l)}}(self));
Memory.prototype._gameCardsMatch = function() {
// cache this
var self = this;
@ -337,10 +340,6 @@
var self = this;
if (this.options.onGameEnd() === false) {
this._clearGame();
this.gameMessages.innerHTML = '<h2 class="mg__onend--heading"><i class="fa fa-trophy fa-5x"></i></h2>\
<p class="mg__onend--message">Vous avez gagné votre partie en ' + this.numMoves + ' coups.</p>\
<button id="mg__onend--restart" class="mg__button"><i class="fa fa-refresh fa-spin fa-3x"></i></button>';
this.game.appendChild(this.gameMessages);
document.getElementById("mg__onend--restart").addEventListener( "click", function(e) {
self.resetGame();
});

View File

@ -105,50 +105,50 @@
<div class="form-group">
<label for="p1" class="col-sm-4 control-label">Dimensions 1 étoile</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="p1" id="p1" placeholder="2">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->p1}}" name="p1" id="p1" placeholder="2">
</div>
</div>
<div class="form-group">
<label for="p2" class="col-sm-4 control-label">Dimensions 2 étoiles</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="p2" id="p2" placeholder="3">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->p2}}" name="p2" id="p2" placeholder="3">
</div>
</div>
<div class="form-group">
<label for="p3" class="col-sm-4 control-label">Dimensions 3 étoiles</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="p3" id="p3" placeholder="4">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->p3}}" name="p3" id="p3" placeholder="4">
</div>
</div>
<div class="form-group">
<label for="pt" class="col-sm-4 control-label">Tableaux par partie</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="pt" id="pt" placeholder="3">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->pt}}" name="pt" id="pt" placeholder="3">
</div>
</div>
<legend>Mémo</legend>
<div class="form-group">
<label for="m1" class="col-sm-4 control-label">Nb. de tableaux 1 étoile</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="m1" id="m1" placeholder="2">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->m1}}" name="m1" id="m1" placeholder="2">
</div>
</div>
<div class="form-group">
<label for="m2" class="col-sm-4 control-label">Nb. de tableaux 2 étoiles</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="m2" id="m2" placeholder="3">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->m2}}" name="m2" id="m2" placeholder="3">
</div>
</div>
<div class="form-group">
<label for="m3" class="col-sm-4 control-label">Nb. de tableaux 3 étoiles</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="m3" id="m3" placeholder="4">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->m3}}" name="m3" id="m3" placeholder="4">
</div>
</div>
<div class="form-group">
<label for="mt" class="col-sm-4 control-label">Tableaux par partie</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="mt" id="mt" placeholder="3">
<input type="number" min="1" max="10" class="form-control" value="{{$paramjeu->mt}}" name="mt" id="mt" placeholder="3">
</div>
</div>
<div class="form-group">
@ -237,9 +237,18 @@
@section('page-css')
<link rel="stylesheet" href="{{ URL::to('css/image-picker.css') }}">
<link rel="stylesheet" href="{{ URL::to('css/bootstrap-multiselect.css') }}">
<style>
.thumbnails .thumbnail {
margin-bottom: 0;
}
.thumbnails .li {
margin: 0;
}
</style>
@endsection
@section('page-scripts')
<script src="{{ URL::to('js/image-picker.min.js') }}"></script>
<script src="{{ URL::to('js/masonry.min.js') }}"></script>
<script src="{{ URL::to('js/image-picker.min.js') }}"></script>
<script src="{{ URL::to('js/bootstrap-multiselect.js') }}"></script>
<script>
@ -248,6 +257,14 @@ $("select.multiple").imagepicker();
$('#imagesSearched').load('{{ URL::to('api/searchOeuvres') }}', function(){$("select.multiple").imagepicker();});
function fitGrid(){
/*$('.thumbnails').masonry({
itemSelector: 'li',
gutterWidth: 10
}).masonry('reload');*/
};
$('#imagesSearched').on('click', '.pager a', function (event) {
event.preventDefault();
if ( $(this).attr('href') != '#' ) {
@ -278,9 +295,11 @@ $("#recherche").on('submit', function(event){
$('#imagesSearched').empty();
$('#imagesSearched').append(data);
$("select.multiple").imagepicker();
fitGrid();
});
});
/*

View File

@ -2,6 +2,15 @@
@section('page-css')
<link rel="stylesheet" href="/css/memory.css">
<style>
.mg__tile--inside {
overflow: hidden;
}
.mg__tile--inside img {
max-width: 100%;
}
</style>
@endsection
@section('content')
@ -12,85 +21,25 @@
@endsection
@section('page-scripts')
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/js/classList.min.js"></script>
<script src="/js/memory.js"></script>
<script>
(function(){
var myMem = new Memory({
wrapperID : "my-memory-game",
cards : [
{
id : 1,
img: "/pictures/default/monsters-01.png"
},
{
id : 2,
img: "/pictures/default/monsters-02.png"
},
{
id : 3,
img: "/pictures/default/monsters-03.png"
},
{
id : 4,
img: "/pictures/default/monsters-04.png"
},
{
id : 5,
img: "/pictures/default/monsters-05.png"
},
{
id : 6,
img: "/pictures/default/monsters-06.png"
},
{
id : 7,
img: "/pictures/default/monsters-07.png"
},
{
id : 8,
img: "/pictures/default/monsters-08.png"
},
{
id : 9,
img: "/pictures/default/monsters-09.png"
},
{
id : 10,
img: "/pictures/default/monsters-10.png"
},
{
id : 11,
img: "/pictures/default/monsters-11.png"
},
{
id : 12,
img: "/pictures/default/monsters-12.png"
},
{
id : 13,
img: "/pictures/default/monsters-13.png"
},
{
id : 14,
img: "/pictures/default/monsters-14.png"
},
{
id : 15,
img: "/pictures/default/monsters-15.png"
},
{
id : 16,
img: "/pictures/default/monsters-16.png"
}
],
onGameStart : function() { return false; },
onGameEnd : function() { return false; }
});
})();
var cards2 = [];
@foreach($oeuvres as $o)
cards2.push(
{
id : '{{$o->id}}',
img : 'http://www.augustins.org/documents/10180/156407/{{ $o->image}}'}
);
@endforeach
var myMem = new Memory({
wrapperID : "my-memory-game",
cards : cards2,
onGameStart : function() { return false; },
onGameEnd : function() { return false; }
});
</script>
@endsection