Front IDILL :
search by curves added
search by type added
notifications added
timeline improved
Binary file front_idill/lib/paper.js has changed
--- a/front_idill/lib/underscore-min.js Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/lib/underscore-min.js Thu May 24 10:30:05 2012 +0200
@@ -1,30 +1,32 @@
-// Underscore.js 1.2.3
-// (c) 2009-2011 Jeremy Ashkenas, DocumentCloud Inc.
+// Underscore.js 1.3.3
+// (c) 2009-2012 Jeremy Ashkenas, DocumentCloud Inc.
// Underscore is freely distributable under the MIT license.
// Portions of Underscore are inspired or borrowed from Prototype,
// Oliver Steele's Functional, and John Resig's Micro-Templating.
// For all details and documentation:
// http://documentcloud.github.com/underscore
-(function(){function r(a,c,d){if(a===c)return a!==0||1/a==1/c;if(a==null||c==null)return a===c;if(a._chain)a=a._wrapped;if(c._chain)c=c._wrapped;if(a.isEqual&&b.isFunction(a.isEqual))return a.isEqual(c);if(c.isEqual&&b.isFunction(c.isEqual))return c.isEqual(a);var e=l.call(a);if(e!=l.call(c))return false;switch(e){case "[object String]":return a==String(c);case "[object Number]":return a!=+a?c!=+c:a==0?1/a==1/c:a==+c;case "[object Date]":case "[object Boolean]":return+a==+c;case "[object RegExp]":return a.source==
-c.source&&a.global==c.global&&a.multiline==c.multiline&&a.ignoreCase==c.ignoreCase}if(typeof a!="object"||typeof c!="object")return false;for(var f=d.length;f--;)if(d[f]==a)return true;d.push(a);var f=0,g=true;if(e=="[object Array]"){if(f=a.length,g=f==c.length)for(;f--;)if(!(g=f in a==f in c&&r(a[f],c[f],d)))break}else{if("constructor"in a!="constructor"in c||a.constructor!=c.constructor)return false;for(var h in a)if(m.call(a,h)&&(f++,!(g=m.call(c,h)&&r(a[h],c[h],d))))break;if(g){for(h in c)if(m.call(c,
-h)&&!f--)break;g=!f}}d.pop();return g}var s=this,F=s._,o={},k=Array.prototype,p=Object.prototype,i=k.slice,G=k.concat,H=k.unshift,l=p.toString,m=p.hasOwnProperty,v=k.forEach,w=k.map,x=k.reduce,y=k.reduceRight,z=k.filter,A=k.every,B=k.some,q=k.indexOf,C=k.lastIndexOf,p=Array.isArray,I=Object.keys,t=Function.prototype.bind,b=function(a){return new n(a)};if(typeof exports!=="undefined"){if(typeof module!=="undefined"&&module.exports)exports=module.exports=b;exports._=b}else typeof define==="function"&&
-define.amd?define("underscore",function(){return b}):s._=b;b.VERSION="1.2.3";var j=b.each=b.forEach=function(a,c,b){if(a!=null)if(v&&a.forEach===v)a.forEach(c,b);else if(a.length===+a.length)for(var e=0,f=a.length;e<f;e++){if(e in a&&c.call(b,a[e],e,a)===o)break}else for(e in a)if(m.call(a,e)&&c.call(b,a[e],e,a)===o)break};b.map=function(a,c,b){var e=[];if(a==null)return e;if(w&&a.map===w)return a.map(c,b);j(a,function(a,g,h){e[e.length]=c.call(b,a,g,h)});return e};b.reduce=b.foldl=b.inject=function(a,
-c,d,e){var f=arguments.length>2;a==null&&(a=[]);if(x&&a.reduce===x)return e&&(c=b.bind(c,e)),f?a.reduce(c,d):a.reduce(c);j(a,function(a,b,i){f?d=c.call(e,d,a,b,i):(d=a,f=true)});if(!f)throw new TypeError("Reduce of empty array with no initial value");return d};b.reduceRight=b.foldr=function(a,c,d,e){var f=arguments.length>2;a==null&&(a=[]);if(y&&a.reduceRight===y)return e&&(c=b.bind(c,e)),f?a.reduceRight(c,d):a.reduceRight(c);var g=b.toArray(a).reverse();e&&!f&&(c=b.bind(c,e));return f?b.reduce(g,
-c,d,e):b.reduce(g,c)};b.find=b.detect=function(a,c,b){var e;D(a,function(a,g,h){if(c.call(b,a,g,h))return e=a,true});return e};b.filter=b.select=function(a,c,b){var e=[];if(a==null)return e;if(z&&a.filter===z)return a.filter(c,b);j(a,function(a,g,h){c.call(b,a,g,h)&&(e[e.length]=a)});return e};b.reject=function(a,c,b){var e=[];if(a==null)return e;j(a,function(a,g,h){c.call(b,a,g,h)||(e[e.length]=a)});return e};b.every=b.all=function(a,c,b){var e=true;if(a==null)return e;if(A&&a.every===A)return a.every(c,
-b);j(a,function(a,g,h){if(!(e=e&&c.call(b,a,g,h)))return o});return e};var D=b.some=b.any=function(a,c,d){c||(c=b.identity);var e=false;if(a==null)return e;if(B&&a.some===B)return a.some(c,d);j(a,function(a,b,h){if(e||(e=c.call(d,a,b,h)))return o});return!!e};b.include=b.contains=function(a,c){var b=false;if(a==null)return b;return q&&a.indexOf===q?a.indexOf(c)!=-1:b=D(a,function(a){return a===c})};b.invoke=function(a,c){var d=i.call(arguments,2);return b.map(a,function(a){return(c.call?c||a:a[c]).apply(a,
-d)})};b.pluck=function(a,c){return b.map(a,function(a){return a[c]})};b.max=function(a,c,d){if(!c&&b.isArray(a))return Math.max.apply(Math,a);if(!c&&b.isEmpty(a))return-Infinity;var e={computed:-Infinity};j(a,function(a,b,h){b=c?c.call(d,a,b,h):a;b>=e.computed&&(e={value:a,computed:b})});return e.value};b.min=function(a,c,d){if(!c&&b.isArray(a))return Math.min.apply(Math,a);if(!c&&b.isEmpty(a))return Infinity;var e={computed:Infinity};j(a,function(a,b,h){b=c?c.call(d,a,b,h):a;b<e.computed&&(e={value:a,
-computed:b})});return e.value};b.shuffle=function(a){var c=[],b;j(a,function(a,f){f==0?c[0]=a:(b=Math.floor(Math.random()*(f+1)),c[f]=c[b],c[b]=a)});return c};b.sortBy=function(a,c,d){return b.pluck(b.map(a,function(a,b,g){return{value:a,criteria:c.call(d,a,b,g)}}).sort(function(a,c){var b=a.criteria,d=c.criteria;return b<d?-1:b>d?1:0}),"value")};b.groupBy=function(a,c){var d={},e=b.isFunction(c)?c:function(a){return a[c]};j(a,function(a,b){var c=e(a,b);(d[c]||(d[c]=[])).push(a)});return d};b.sortedIndex=
-function(a,c,d){d||(d=b.identity);for(var e=0,f=a.length;e<f;){var g=e+f>>1;d(a[g])<d(c)?e=g+1:f=g}return e};b.toArray=function(a){return!a?[]:a.toArray?a.toArray():b.isArray(a)?i.call(a):b.isArguments(a)?i.call(a):b.values(a)};b.size=function(a){return b.toArray(a).length};b.first=b.head=function(a,b,d){return b!=null&&!d?i.call(a,0,b):a[0]};b.initial=function(a,b,d){return i.call(a,0,a.length-(b==null||d?1:b))};b.last=function(a,b,d){return b!=null&&!d?i.call(a,Math.max(a.length-b,0)):a[a.length-
-1]};b.rest=b.tail=function(a,b,d){return i.call(a,b==null||d?1:b)};b.compact=function(a){return b.filter(a,function(a){return!!a})};b.flatten=function(a,c){return b.reduce(a,function(a,e){if(b.isArray(e))return a.concat(c?e:b.flatten(e));a[a.length]=e;return a},[])};b.without=function(a){return b.difference(a,i.call(arguments,1))};b.uniq=b.unique=function(a,c,d){var d=d?b.map(a,d):a,e=[];b.reduce(d,function(d,g,h){if(0==h||(c===true?b.last(d)!=g:!b.include(d,g)))d[d.length]=g,e[e.length]=a[h];return d},
-[]);return e};b.union=function(){return b.uniq(b.flatten(arguments,true))};b.intersection=b.intersect=function(a){var c=i.call(arguments,1);return b.filter(b.uniq(a),function(a){return b.every(c,function(c){return b.indexOf(c,a)>=0})})};b.difference=function(a){var c=b.flatten(i.call(arguments,1));return b.filter(a,function(a){return!b.include(c,a)})};b.zip=function(){for(var a=i.call(arguments),c=b.max(b.pluck(a,"length")),d=Array(c),e=0;e<c;e++)d[e]=b.pluck(a,""+e);return d};b.indexOf=function(a,
-c,d){if(a==null)return-1;var e;if(d)return d=b.sortedIndex(a,c),a[d]===c?d:-1;if(q&&a.indexOf===q)return a.indexOf(c);for(d=0,e=a.length;d<e;d++)if(d in a&&a[d]===c)return d;return-1};b.lastIndexOf=function(a,b){if(a==null)return-1;if(C&&a.lastIndexOf===C)return a.lastIndexOf(b);for(var d=a.length;d--;)if(d in a&&a[d]===b)return d;return-1};b.range=function(a,b,d){arguments.length<=1&&(b=a||0,a=0);for(var d=arguments[2]||1,e=Math.max(Math.ceil((b-a)/d),0),f=0,g=Array(e);f<e;)g[f++]=a,a+=d;return g};
-var E=function(){};b.bind=function(a,c){var d,e;if(a.bind===t&&t)return t.apply(a,i.call(arguments,1));if(!b.isFunction(a))throw new TypeError;e=i.call(arguments,2);return d=function(){if(!(this instanceof d))return a.apply(c,e.concat(i.call(arguments)));E.prototype=a.prototype;var b=new E,g=a.apply(b,e.concat(i.call(arguments)));return Object(g)===g?g:b}};b.bindAll=function(a){var c=i.call(arguments,1);c.length==0&&(c=b.functions(a));j(c,function(c){a[c]=b.bind(a[c],a)});return a};b.memoize=function(a,
-c){var d={};c||(c=b.identity);return function(){var b=c.apply(this,arguments);return m.call(d,b)?d[b]:d[b]=a.apply(this,arguments)}};b.delay=function(a,b){var d=i.call(arguments,2);return setTimeout(function(){return a.apply(a,d)},b)};b.defer=function(a){return b.delay.apply(b,[a,1].concat(i.call(arguments,1)))};b.throttle=function(a,c){var d,e,f,g,h,i=b.debounce(function(){h=g=false},c);return function(){d=this;e=arguments;var b;f||(f=setTimeout(function(){f=null;h&&a.apply(d,e);i()},c));g?h=true:
-a.apply(d,e);i();g=true}};b.debounce=function(a,b){var d;return function(){var e=this,f=arguments;clearTimeout(d);d=setTimeout(function(){d=null;a.apply(e,f)},b)}};b.once=function(a){var b=false,d;return function(){if(b)return d;b=true;return d=a.apply(this,arguments)}};b.wrap=function(a,b){return function(){var d=G.apply([a],arguments);return b.apply(this,d)}};b.compose=function(){var a=arguments;return function(){for(var b=arguments,d=a.length-1;d>=0;d--)b=[a[d].apply(this,b)];return b[0]}};b.after=
-function(a,b){return a<=0?b():function(){if(--a<1)return b.apply(this,arguments)}};b.keys=I||function(a){if(a!==Object(a))throw new TypeError("Invalid object");var b=[],d;for(d in a)m.call(a,d)&&(b[b.length]=d);return b};b.values=function(a){return b.map(a,b.identity)};b.functions=b.methods=function(a){var c=[],d;for(d in a)b.isFunction(a[d])&&c.push(d);return c.sort()};b.extend=function(a){j(i.call(arguments,1),function(b){for(var d in b)b[d]!==void 0&&(a[d]=b[d])});return a};b.defaults=function(a){j(i.call(arguments,
-1),function(b){for(var d in b)a[d]==null&&(a[d]=b[d])});return a};b.clone=function(a){return!b.isObject(a)?a:b.isArray(a)?a.slice():b.extend({},a)};b.tap=function(a,b){b(a);return a};b.isEqual=function(a,b){return r(a,b,[])};b.isEmpty=function(a){if(b.isArray(a)||b.isString(a))return a.length===0;for(var c in a)if(m.call(a,c))return false;return true};b.isElement=function(a){return!!(a&&a.nodeType==1)};b.isArray=p||function(a){return l.call(a)=="[object Array]"};b.isObject=function(a){return a===
-Object(a)};b.isArguments=function(a){return l.call(a)=="[object Arguments]"};if(!b.isArguments(arguments))b.isArguments=function(a){return!(!a||!m.call(a,"callee"))};b.isFunction=function(a){return l.call(a)=="[object Function]"};b.isString=function(a){return l.call(a)=="[object String]"};b.isNumber=function(a){return l.call(a)=="[object Number]"};b.isNaN=function(a){return a!==a};b.isBoolean=function(a){return a===true||a===false||l.call(a)=="[object Boolean]"};b.isDate=function(a){return l.call(a)==
-"[object Date]"};b.isRegExp=function(a){return l.call(a)=="[object RegExp]"};b.isNull=function(a){return a===null};b.isUndefined=function(a){return a===void 0};b.noConflict=function(){s._=F;return this};b.identity=function(a){return a};b.times=function(a,b,d){for(var e=0;e<a;e++)b.call(d,e)};b.escape=function(a){return(""+a).replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'").replace(/\//g,"/")};b.mixin=function(a){j(b.functions(a),function(c){J(c,
-b[c]=a[c])})};var K=0;b.uniqueId=function(a){var b=K++;return a?a+b:b};b.templateSettings={evaluate:/<%([\s\S]+?)%>/g,interpolate:/<%=([\s\S]+?)%>/g,escape:/<%-([\s\S]+?)%>/g};b.template=function(a,c){var d=b.templateSettings,d="var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('"+a.replace(/\\/g,"\\\\").replace(/'/g,"\\'").replace(d.escape,function(a,b){return"',_.escape("+b.replace(/\\'/g,"'")+"),'"}).replace(d.interpolate,function(a,b){return"',"+b.replace(/\\'/g,
-"'")+",'"}).replace(d.evaluate||null,function(a,b){return"');"+b.replace(/\\'/g,"'").replace(/[\r\n\t]/g," ")+";__p.push('"}).replace(/\r/g,"\\r").replace(/\n/g,"\\n").replace(/\t/g,"\\t")+"');}return __p.join('');",e=new Function("obj","_",d);return c?e(c,b):function(a){return e.call(this,a,b)}};var n=function(a){this._wrapped=a};b.prototype=n.prototype;var u=function(a,c){return c?b(a).chain():a},J=function(a,c){n.prototype[a]=function(){var a=i.call(arguments);H.call(a,this._wrapped);return u(c.apply(b,
-a),this._chain)}};b.mixin(b);j("pop,push,reverse,shift,sort,splice,unshift".split(","),function(a){var b=k[a];n.prototype[a]=function(){b.apply(this._wrapped,arguments);return u(this._wrapped,this._chain)}});j(["concat","join","slice"],function(a){var b=k[a];n.prototype[a]=function(){return u(b.apply(this._wrapped,arguments),this._chain)}});n.prototype.chain=function(){this._chain=true;return this};n.prototype.value=function(){return this._wrapped}}).call(this);
+(function(){function r(a,c,d){if(a===c)return 0!==a||1/a==1/c;if(null==a||null==c)return a===c;a._chain&&(a=a._wrapped);c._chain&&(c=c._wrapped);if(a.isEqual&&b.isFunction(a.isEqual))return a.isEqual(c);if(c.isEqual&&b.isFunction(c.isEqual))return c.isEqual(a);var e=l.call(a);if(e!=l.call(c))return!1;switch(e){case "[object String]":return a==""+c;case "[object Number]":return a!=+a?c!=+c:0==a?1/a==1/c:a==+c;case "[object Date]":case "[object Boolean]":return+a==+c;case "[object RegExp]":return a.source==
+c.source&&a.global==c.global&&a.multiline==c.multiline&&a.ignoreCase==c.ignoreCase}if("object"!=typeof a||"object"!=typeof c)return!1;for(var f=d.length;f--;)if(d[f]==a)return!0;d.push(a);var f=0,g=!0;if("[object Array]"==e){if(f=a.length,g=f==c.length)for(;f--&&(g=f in a==f in c&&r(a[f],c[f],d)););}else{if("constructor"in a!="constructor"in c||a.constructor!=c.constructor)return!1;for(var h in a)if(b.has(a,h)&&(f++,!(g=b.has(c,h)&&r(a[h],c[h],d))))break;if(g){for(h in c)if(b.has(c,h)&&!f--)break;
+g=!f}}d.pop();return g}var s=this,I=s._,o={},k=Array.prototype,p=Object.prototype,i=k.slice,J=k.unshift,l=p.toString,K=p.hasOwnProperty,y=k.forEach,z=k.map,A=k.reduce,B=k.reduceRight,C=k.filter,D=k.every,E=k.some,q=k.indexOf,F=k.lastIndexOf,p=Array.isArray,L=Object.keys,t=Function.prototype.bind,b=function(a){return new m(a)};"undefined"!==typeof exports?("undefined"!==typeof module&&module.exports&&(exports=module.exports=b),exports._=b):s._=b;b.VERSION="1.3.3";var j=b.each=b.forEach=function(a,
+c,d){if(a!=null)if(y&&a.forEach===y)a.forEach(c,d);else if(a.length===+a.length)for(var e=0,f=a.length;e<f;e++){if(e in a&&c.call(d,a[e],e,a)===o)break}else for(e in a)if(b.has(a,e)&&c.call(d,a[e],e,a)===o)break};b.map=b.collect=function(a,c,b){var e=[];if(a==null)return e;if(z&&a.map===z)return a.map(c,b);j(a,function(a,g,h){e[e.length]=c.call(b,a,g,h)});if(a.length===+a.length)e.length=a.length;return e};b.reduce=b.foldl=b.inject=function(a,c,d,e){var f=arguments.length>2;a==null&&(a=[]);if(A&&
+a.reduce===A){e&&(c=b.bind(c,e));return f?a.reduce(c,d):a.reduce(c)}j(a,function(a,b,i){if(f)d=c.call(e,d,a,b,i);else{d=a;f=true}});if(!f)throw new TypeError("Reduce of empty array with no initial value");return d};b.reduceRight=b.foldr=function(a,c,d,e){var f=arguments.length>2;a==null&&(a=[]);if(B&&a.reduceRight===B){e&&(c=b.bind(c,e));return f?a.reduceRight(c,d):a.reduceRight(c)}var g=b.toArray(a).reverse();e&&!f&&(c=b.bind(c,e));return f?b.reduce(g,c,d,e):b.reduce(g,c)};b.find=b.detect=function(a,
+c,b){var e;G(a,function(a,g,h){if(c.call(b,a,g,h)){e=a;return true}});return e};b.filter=b.select=function(a,c,b){var e=[];if(a==null)return e;if(C&&a.filter===C)return a.filter(c,b);j(a,function(a,g,h){c.call(b,a,g,h)&&(e[e.length]=a)});return e};b.reject=function(a,c,b){var e=[];if(a==null)return e;j(a,function(a,g,h){c.call(b,a,g,h)||(e[e.length]=a)});return e};b.every=b.all=function(a,c,b){var e=true;if(a==null)return e;if(D&&a.every===D)return a.every(c,b);j(a,function(a,g,h){if(!(e=e&&c.call(b,
+a,g,h)))return o});return!!e};var G=b.some=b.any=function(a,c,d){c||(c=b.identity);var e=false;if(a==null)return e;if(E&&a.some===E)return a.some(c,d);j(a,function(a,b,h){if(e||(e=c.call(d,a,b,h)))return o});return!!e};b.include=b.contains=function(a,c){var b=false;if(a==null)return b;if(q&&a.indexOf===q)return a.indexOf(c)!=-1;return b=G(a,function(a){return a===c})};b.invoke=function(a,c){var d=i.call(arguments,2);return b.map(a,function(a){return(b.isFunction(c)?c||a:a[c]).apply(a,d)})};b.pluck=
+function(a,c){return b.map(a,function(a){return a[c]})};b.max=function(a,c,d){if(!c&&b.isArray(a)&&a[0]===+a[0])return Math.max.apply(Math,a);if(!c&&b.isEmpty(a))return-Infinity;var e={computed:-Infinity};j(a,function(a,b,h){b=c?c.call(d,a,b,h):a;b>=e.computed&&(e={value:a,computed:b})});return e.value};b.min=function(a,c,d){if(!c&&b.isArray(a)&&a[0]===+a[0])return Math.min.apply(Math,a);if(!c&&b.isEmpty(a))return Infinity;var e={computed:Infinity};j(a,function(a,b,h){b=c?c.call(d,a,b,h):a;b<e.computed&&
+(e={value:a,computed:b})});return e.value};b.shuffle=function(a){var b=[],d;j(a,function(a,f){d=Math.floor(Math.random()*(f+1));b[f]=b[d];b[d]=a});return b};b.sortBy=function(a,c,d){var e=b.isFunction(c)?c:function(a){return a[c]};return b.pluck(b.map(a,function(a,b,c){return{value:a,criteria:e.call(d,a,b,c)}}).sort(function(a,b){var c=a.criteria,d=b.criteria;return c===void 0?1:d===void 0?-1:c<d?-1:c>d?1:0}),"value")};b.groupBy=function(a,c){var d={},e=b.isFunction(c)?c:function(a){return a[c]};
+j(a,function(a,b){var c=e(a,b);(d[c]||(d[c]=[])).push(a)});return d};b.sortedIndex=function(a,c,d){d||(d=b.identity);for(var e=0,f=a.length;e<f;){var g=e+f>>1;d(a[g])<d(c)?e=g+1:f=g}return e};b.toArray=function(a){return!a?[]:b.isArray(a)||b.isArguments(a)?i.call(a):a.toArray&&b.isFunction(a.toArray)?a.toArray():b.values(a)};b.size=function(a){return b.isArray(a)?a.length:b.keys(a).length};b.first=b.head=b.take=function(a,b,d){return b!=null&&!d?i.call(a,0,b):a[0]};b.initial=function(a,b,d){return i.call(a,
+0,a.length-(b==null||d?1:b))};b.last=function(a,b,d){return b!=null&&!d?i.call(a,Math.max(a.length-b,0)):a[a.length-1]};b.rest=b.tail=function(a,b,d){return i.call(a,b==null||d?1:b)};b.compact=function(a){return b.filter(a,function(a){return!!a})};b.flatten=function(a,c){return b.reduce(a,function(a,e){if(b.isArray(e))return a.concat(c?e:b.flatten(e));a[a.length]=e;return a},[])};b.without=function(a){return b.difference(a,i.call(arguments,1))};b.uniq=b.unique=function(a,c,d){var d=d?b.map(a,d):a,
+e=[];a.length<3&&(c=true);b.reduce(d,function(d,g,h){if(c?b.last(d)!==g||!d.length:!b.include(d,g)){d.push(g);e.push(a[h])}return d},[]);return e};b.union=function(){return b.uniq(b.flatten(arguments,true))};b.intersection=b.intersect=function(a){var c=i.call(arguments,1);return b.filter(b.uniq(a),function(a){return b.every(c,function(c){return b.indexOf(c,a)>=0})})};b.difference=function(a){var c=b.flatten(i.call(arguments,1),true);return b.filter(a,function(a){return!b.include(c,a)})};b.zip=function(){for(var a=
+i.call(arguments),c=b.max(b.pluck(a,"length")),d=Array(c),e=0;e<c;e++)d[e]=b.pluck(a,""+e);return d};b.indexOf=function(a,c,d){if(a==null)return-1;var e;if(d){d=b.sortedIndex(a,c);return a[d]===c?d:-1}if(q&&a.indexOf===q)return a.indexOf(c);d=0;for(e=a.length;d<e;d++)if(d in a&&a[d]===c)return d;return-1};b.lastIndexOf=function(a,b){if(a==null)return-1;if(F&&a.lastIndexOf===F)return a.lastIndexOf(b);for(var d=a.length;d--;)if(d in a&&a[d]===b)return d;return-1};b.range=function(a,b,d){if(arguments.length<=
+1){b=a||0;a=0}for(var d=arguments[2]||1,e=Math.max(Math.ceil((b-a)/d),0),f=0,g=Array(e);f<e;){g[f++]=a;a=a+d}return g};var H=function(){};b.bind=function(a,c){var d,e;if(a.bind===t&&t)return t.apply(a,i.call(arguments,1));if(!b.isFunction(a))throw new TypeError;e=i.call(arguments,2);return d=function(){if(!(this instanceof d))return a.apply(c,e.concat(i.call(arguments)));H.prototype=a.prototype;var b=new H,g=a.apply(b,e.concat(i.call(arguments)));return Object(g)===g?g:b}};b.bindAll=function(a){var c=
+i.call(arguments,1);c.length==0&&(c=b.functions(a));j(c,function(c){a[c]=b.bind(a[c],a)});return a};b.memoize=function(a,c){var d={};c||(c=b.identity);return function(){var e=c.apply(this,arguments);return b.has(d,e)?d[e]:d[e]=a.apply(this,arguments)}};b.delay=function(a,b){var d=i.call(arguments,2);return setTimeout(function(){return a.apply(null,d)},b)};b.defer=function(a){return b.delay.apply(b,[a,1].concat(i.call(arguments,1)))};b.throttle=function(a,c){var d,e,f,g,h,i,j=b.debounce(function(){h=
+g=false},c);return function(){d=this;e=arguments;f||(f=setTimeout(function(){f=null;h&&a.apply(d,e);j()},c));g?h=true:i=a.apply(d,e);j();g=true;return i}};b.debounce=function(a,b,d){var e;return function(){var f=this,g=arguments;d&&!e&&a.apply(f,g);clearTimeout(e);e=setTimeout(function(){e=null;d||a.apply(f,g)},b)}};b.once=function(a){var b=false,d;return function(){if(b)return d;b=true;return d=a.apply(this,arguments)}};b.wrap=function(a,b){return function(){var d=[a].concat(i.call(arguments,0));
+return b.apply(this,d)}};b.compose=function(){var a=arguments;return function(){for(var b=arguments,d=a.length-1;d>=0;d--)b=[a[d].apply(this,b)];return b[0]}};b.after=function(a,b){return a<=0?b():function(){if(--a<1)return b.apply(this,arguments)}};b.keys=L||function(a){if(a!==Object(a))throw new TypeError("Invalid object");var c=[],d;for(d in a)b.has(a,d)&&(c[c.length]=d);return c};b.values=function(a){return b.map(a,b.identity)};b.functions=b.methods=function(a){var c=[],d;for(d in a)b.isFunction(a[d])&&
+c.push(d);return c.sort()};b.extend=function(a){j(i.call(arguments,1),function(b){for(var d in b)a[d]=b[d]});return a};b.pick=function(a){var c={};j(b.flatten(i.call(arguments,1)),function(b){b in a&&(c[b]=a[b])});return c};b.defaults=function(a){j(i.call(arguments,1),function(b){for(var d in b)a[d]==null&&(a[d]=b[d])});return a};b.clone=function(a){return!b.isObject(a)?a:b.isArray(a)?a.slice():b.extend({},a)};b.tap=function(a,b){b(a);return a};b.isEqual=function(a,b){return r(a,b,[])};b.isEmpty=
+function(a){if(a==null)return true;if(b.isArray(a)||b.isString(a))return a.length===0;for(var c in a)if(b.has(a,c))return false;return true};b.isElement=function(a){return!!(a&&a.nodeType==1)};b.isArray=p||function(a){return l.call(a)=="[object Array]"};b.isObject=function(a){return a===Object(a)};b.isArguments=function(a){return l.call(a)=="[object Arguments]"};b.isArguments(arguments)||(b.isArguments=function(a){return!(!a||!b.has(a,"callee"))});b.isFunction=function(a){return l.call(a)=="[object Function]"};
+b.isString=function(a){return l.call(a)=="[object String]"};b.isNumber=function(a){return l.call(a)=="[object Number]"};b.isFinite=function(a){return b.isNumber(a)&&isFinite(a)};b.isNaN=function(a){return a!==a};b.isBoolean=function(a){return a===true||a===false||l.call(a)=="[object Boolean]"};b.isDate=function(a){return l.call(a)=="[object Date]"};b.isRegExp=function(a){return l.call(a)=="[object RegExp]"};b.isNull=function(a){return a===null};b.isUndefined=function(a){return a===void 0};b.has=function(a,
+b){return K.call(a,b)};b.noConflict=function(){s._=I;return this};b.identity=function(a){return a};b.times=function(a,b,d){for(var e=0;e<a;e++)b.call(d,e)};b.escape=function(a){return(""+a).replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'").replace(/\//g,"/")};b.result=function(a,c){if(a==null)return null;var d=a[c];return b.isFunction(d)?d.call(a):d};b.mixin=function(a){j(b.functions(a),function(c){M(c,b[c]=a[c])})};var N=0;b.uniqueId=
+function(a){var b=N++;return a?a+b:b};b.templateSettings={evaluate:/<%([\s\S]+?)%>/g,interpolate:/<%=([\s\S]+?)%>/g,escape:/<%-([\s\S]+?)%>/g};var u=/.^/,n={"\\":"\\","'":"'",r:"\r",n:"\n",t:"\t",u2028:"\u2028",u2029:"\u2029"},v;for(v in n)n[n[v]]=v;var O=/\\|'|\r|\n|\t|\u2028|\u2029/g,P=/\\(\\|'|r|n|t|u2028|u2029)/g,w=function(a){return a.replace(P,function(a,b){return n[b]})};b.template=function(a,c,d){d=b.defaults(d||{},b.templateSettings);a="__p+='"+a.replace(O,function(a){return"\\"+n[a]}).replace(d.escape||
+u,function(a,b){return"'+\n_.escape("+w(b)+")+\n'"}).replace(d.interpolate||u,function(a,b){return"'+\n("+w(b)+")+\n'"}).replace(d.evaluate||u,function(a,b){return"';\n"+w(b)+"\n;__p+='"})+"';\n";d.variable||(a="with(obj||{}){\n"+a+"}\n");var a="var __p='';var print=function(){__p+=Array.prototype.join.call(arguments, '')};\n"+a+"return __p;\n",e=new Function(d.variable||"obj","_",a);if(c)return e(c,b);c=function(a){return e.call(this,a,b)};c.source="function("+(d.variable||"obj")+"){\n"+a+"}";return c};
+b.chain=function(a){return b(a).chain()};var m=function(a){this._wrapped=a};b.prototype=m.prototype;var x=function(a,c){return c?b(a).chain():a},M=function(a,c){m.prototype[a]=function(){var a=i.call(arguments);J.call(a,this._wrapped);return x(c.apply(b,a),this._chain)}};b.mixin(b);j("pop,push,reverse,shift,sort,splice,unshift".split(","),function(a){var b=k[a];m.prototype[a]=function(){var d=this._wrapped;b.apply(d,arguments);var e=d.length;(a=="shift"||a=="splice")&&e===0&&delete d[0];return x(d,
+this._chain)}});j(["concat","join","slice"],function(a){var b=k[a];m.prototype[a]=function(){return x(b.apply(this._wrapped,arguments),this._chain)}});m.prototype.chain=function(){this._chain=true;return this};m.prototype.value=function(){return this._wrapped}}).call(this);
--- a/front_idill/src/index.html Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/index.html Thu May 24 10:30:05 2012 +0200
@@ -28,10 +28,14 @@
<link rel="stylesheet" type="text/css" href="./mosaic/css/reset.css" />
<link rel="stylesheet/less" type="text/css" href="./mosaic/css/mosaic.less" />
<script type="text/javascript" src="../lib/less-1.3.0.min.js"></script>
+ <script type="text/javascript" src="../lib/underscore-min.js"></script>
<script type="text/javascript" src="../lib/jquery.min.js"></script>
<script type="text/javascript" src="./mosaic/js/mosaic.js"></script>
<script type="text/javascript" src="./mosaic/js/localMosaic.js"></script>
<script type="text/javascript" src="./player/metadataplayer/LdtPlayer-core.js"></script>
+ <script type="text/javascript" src="../lib/paper.js"></script>
+ <link rel="stylesheet" type="text/css" href="./search/css/searchCanvas.css" />
+ <script type="text/javascript" src="./search/js/searchCanvas.js"></script>
</head>
<body>
@@ -46,14 +50,16 @@
<!-- Scripts principaux. -->
<script type="text/javascript">
//Longueur de la mosaïques et nombre d'images à afficher (seront importés des paramètres du Middleware).
- var length = 7, imagesToShow = 42;
+ var length = 5, imagesToShow = 20, totalImages = 23;
//Temps de chargement du prezoom en ms (seront importés des paramètres du Middleware).
var timePrezoom = 500, timePreUnzoom = 200, timeZoom = 500, timeUnzoom = 400;
var timeNeighbourGlowing = 1000, timeNeighbourUnglowing = 1000, timeMovingToNeighbour = 1000;
+ var timeSearchFade = 2000;
+ var timeNotifyFade = 2000;
var zoomPercentage = 0.80, prezoomPercentage = 0.25;
var zoomedMargin = 42;
//On instancie la mosaïque.
- var mos = new mosaic(length, imagesToShow, zoomPercentage, prezoomPercentage, zoomedMargin);
+ var mos = new mosaic(length, imagesToShow, totalImages, zoomPercentage, prezoomPercentage, zoomedMargin);
//On spécifie les attributs de temps.
mos.zoomTime = timeZoom;
mos.unzoomTime = timeUnzoom;
@@ -62,9 +68,11 @@
mos.timeNeighbourGlowing = timeNeighbourGlowing;
mos.timeNeighbourUnglowing = timeNeighbourUnglowing;
mos.timeMovingToNeighbour = timeMovingToNeighbour;
+ mos.timeSearchFade = timeSearchFade;
+ mos.timeNotifyFade = timeNotifyFade;
//On instancie une mosaïque locale pour le zoom total (pas encore implémenté).
- var lMos = new localMosaic(length, imagesToShow, zoomedMargin);
- mos.localMos = lMos;
+ //var lMos = new localMosaic(length, imagesToShow, zoomedMargin);
+ //mos.localMos = lMos;
//Tableau d'images de test pour peupler la mosaïque.
/*var imgs = [];
for(var i = 0 ; i < 42 ; i++)
@@ -82,6 +90,7 @@
$(document).ready(function ()
{
mos.loadMosaic();
+ //mos.newSearch();
$('.snapshotDivs').mouseenter(function ()
{
@@ -90,10 +99,55 @@
});
$('body').keypress(function (event)
{
- //Si on a appuié sur la touche 'q' ou 'Q';
- if(event.which == 113 || event.which == 81)
+ //Sinon si on a appuyé sur 's' ou 'S'.
+ if(event.which == 103 || event.which == 71)
{
- mos.unzoom();
+ //Si on est déjà en recherche par courbes.
+ if(mos.currentMode == "SEARCH" || mos.currentMode == "FILTER")
+ {
+ //On quitte cette recherche.
+ mos.leaveSearch();
+ //Si on était en mode recherche.
+ if(mos.currentMode == "SEARCH")
+ {
+ //On revient dans la vidéo.
+ mos.currentMode = "VIDEO";
+ }
+ else
+ {
+ //Sinon c'est qu'on était dans la mosaïque.
+ mos.currentMode = "MOSAIC";
+ }
+ }
+ else
+ {
+ //Si on est en plein écran.
+ if(mos.fullscreen)
+ {
+ //On entre en mode recherche.
+ mos.currentMode = "SEARCH";
+ }
+ //Sinon.
+ else
+ {
+ //On entre en mode filtrage.
+ mos.currentMode = "FILTER";
+ }
+
+ mos.startSearch();
+ }
+ }
+ //Si c'est a ou A.
+ else if(event.which == 65 || event.which == 97)
+ {
+ if(!mos.helpDisplayed)
+ {
+ mos.notifyHelp();
+ }
+ else
+ {
+ mos.removeHelp();
+ }
}
});
});
--- a/front_idill/src/mosaic/css/mosaic.less Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/mosaic/css/mosaic.less Thu May 24 10:30:05 2012 +0200
@@ -28,10 +28,18 @@
@snapshots-margin-value: 8px;
@snapshots-margin: @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value;
@black: #000000;
+@notify-selection-background-image-path: url("../../pictos/notifications/selectionner.png");
+@notify-search-background-image-path: url("../../pictos/notifications/rechercher.png");
+@notify-point-background-image-path: url("../../pictos/notifications/confirmer.png");
+@notify-help-background-color: rgba(100, 100, 100, 0.9);
+@notify-help-border-width: 2px;
+@notify-help-margin: 15px;
+@notify-help-search-background-image-path: url("../../pictos/help/recherche.png");
+@notify-help-controls-background-image-path: url("../../pictos/help/controles.png");
body
{
- //overflow: hidden;
+ overflow: hidden;
background-color: @black;
}
@@ -129,4 +137,136 @@
video
{
//position: absolute;
+}
+
+.notifications
+{
+ position: absolute;
+ width: 100px;
+ height: 100px;
+ background-repeat: no-repeat;
+ background-position: 0px 0px;
+ background-size: 100px 100px;
+ opacity: 0;
+ margin: 15px;
+ z-index: 400;
+}
+
+#notify_selection
+{
+ background-image: @notify-selection-background-image-path;
+}
+
+#notify_search
+{
+ background-image: @notify-search-background-image-path;
+}
+
+#notify_point
+{
+ background-image: @notify-point-background-image-path;
+}
+
+/*
+ * Aide
+ */
+#notify_help
+{
+ position: absolute;
+ margin: @notify-help-margin;
+ border-style: solid;
+ border-width: @notify-help-border-width;
+ border-color: #fff;
+ background-color: @notify-help-background-color;
+}
+
+#help_search
+{
+ float: left;
+ top: 0%;
+ width: 50%;
+ height: 100%;
+ background: transparent;
+}
+
+#help_controls
+{
+ float: left;
+ top: 0%;
+ width: 50%;
+ height: 100%;
+ background: transparent;
+}
+
+#help_sep
+{
+ position: absolute;
+ top: 10%;
+ left: 50%;
+ width: 1px;
+ height: 80%;
+ background-color: #fff;
+}
+
+#search_title, #controls_title
+{
+ position: relative;
+ color: #fff;
+ //font-family: DIN-Medium, Fallback, sans-serif;
+ font-size: 30px;
+ text-align: center;
+ font-weight: bold;
+ margin-top: 15px;
+ margin-bottom: 15px;
+}
+
+#search_img
+{
+ background-image: @notify-help-search-background-image-path;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-size: 150px 150px;
+ height: 150px;
+}
+
+#controls_img
+{
+ background-image: @notify-help-controls-background-image-path;
+ background-position: center center;
+ background-repeat: no-repeat;
+ //background-size: 150px 150px;
+ height: 150px;
+}
+
+#search_2hands_text, #search_body_text, #controls_1hand_text
+{
+ position: relative;
+ clear: both;
+ color: #fff;
+ //font-family: DIN-Medium, Fallback, sans-serif;
+ font-size: 15px;
+ text-align: center;
+ font-weight: bold;
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+
+#search_2hands_imgs, #controls_1hand_imgs
+{
+ padding-left: 40px;
+}
+
+.notify_imgs_small
+{
+ float: left;
+ width: 80px;
+ height: 80px;
+ background-position: 0px 0px;
+ //background-size: 80px 80px;
+ background-repeat: no-repeat;
+}
+
+.notify_imgs_small
+{
+ margin: 4px;
}
\ No newline at end of file
--- a/front_idill/src/mosaic/js/mosaic.js Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/mosaic/js/mosaic.js Thu May 24 10:30:05 2012 +0200
@@ -22,7 +22,7 @@
* Elle contient sa longueur, le nombre d'images total, une liste d'urls pour les vidéos, leurs snapshots principaux et leur position.
* Contient également les dimensions en px de la mosaïque.
*/
-function mosaic(len, imgToShow, zoomPercentage, prezoomPercentage, zoomedMargin)
+function mosaic(len, imgToShow, imgTotal, zoomPercentage, prezoomPercentage, zoomedMargin)
{
//S'il s'agit d'un rectangle.
if(imgToShow % len == 0)
@@ -30,12 +30,24 @@
//Longueur horizontale.
this.length = len;
//Nombre d'images dans la mosaïque.
- this.imagesToShow = imgToShow;
+ this.imagesToShow = imgToShow;
+ this.imagesTotal = imgTotal;
//Tableaux des urls des vidéos, des snapshots et de leur position dans la mosaïque.
this.videos = [];
this.urls = [];
this.imgs = [];
- this.ids = [];
+ this.ids = [];
+ //On remplit le tableau d'ids.
+ for(var i = 0 ; i < this.imagesTotal ; i++)
+ this.ids.push(i);
+ //On les mélange.
+ this.ids.sort(function()
+ {
+ return 0.5 - Math.random()
+ });
+
+ console.log(this.ids);
+
//Dimensions de la mosaïque en pixels.
this.width;
this.height;
@@ -53,11 +65,14 @@
this.timeNeighbourGlowing;
this.timeNeighbourUnglowing;
this.timeMovingToNeighbour;
+ this.timeSearchFade;
+ this.timeNotifyFade;
//Booléens permettant ou non certaines intéractions selon le contexte.
this.zoomed;
this.fullscreen;
this.canMoveToNeighbour;
+ this.helpDisplayed;
//Mode actuel.
this.currentMode;
@@ -80,8 +95,17 @@
//ID du snapshot du milieu lors d'un zoom.
this.centerId;
+ //Lecteur.
this.player;
+ //Coordonnées et dimensions d'un snapshot zoomé.
+ this.snTop = 0;
+ this.snLeft = 0;
+ this.snWidth = 0;
+ this.snHeight = 0;
+
+ this.searchCanvas;
+
this.loadFromJson('./player/json/videos.json');
}
else
@@ -100,6 +124,7 @@
this.previousPrezoomDiv = '';
this.fullscreen = false;
this.canMoveToNeighbour = false;
+ this.helpDisplayed = false;
var str = '';
if(this.imgs.length >= this.imagesToShow)
@@ -150,6 +175,9 @@
this.MPTop_margin = ($(document).height() - $('#mainPanel').height())/2;
$('#mainPanel').css('margin-top', this.MPTop_margin).css('margin-bottom', this.MPTop_margin);
+ //On affiche les notifications.
+ this.notifySelectionSearchMosaicFull();
+
$('.snapshotDivs').mouseenter(function ()
{
//On effectue un prézoom dès qu'on va sur une image.
@@ -175,6 +203,10 @@
{
return;
}
+
+ //On enlève les notifications initiales si elles existent.
+ this.removeSelectionSearchMosaicFull();
+
//Mosaïque.
var mosaic = this;
//Dimensions de la mosaïque.
@@ -272,7 +304,10 @@
height: finalDivHeight - margin,
top: finalDivTop + margin,
left: finalDivLeft
- }, this.preZoomTime);
+ }, this.preZoomTime, function()
+ {
+ mosaic.notifyPointMosaicPrezoom();
+ });
});
//Si on clique sur le snapshot prézoomé, on enclenche un zoom total sur ce snapshot.
@@ -295,6 +330,8 @@
{
return;
}
+
+ this.removePointMosaicPrezoom();
//On spécifie la marge afin de centrer le prédézoom.
var margin = this.marginWidth;
@@ -332,6 +369,8 @@
{
return;
}
+
+ this.removePointMosaicPrezoom();
//On prend les attributs nécessaires au calculs.
var margin = this.marginWidth, len = this.length, imgs = this.imagesToShow;
@@ -389,8 +428,11 @@
mos.currentMode = 'VIDEO';
console.log('h : ' + -newZoomLeft + " " + zoomedImg.position().left);
+
+ mos.snTop = (zoomedImg.position().top + newZoomTop + mos.MPTop_margin), mos.snLeft = (zoomedImg.position().left + newZoomLeft);
+ mos.snWidth = newSnWidth + 1, mos.snHeight = newSnHeight + 1;
- mos.loadPlayer((zoomedImg.position().top + newZoomTop + mos.MPTop_margin), (zoomedImg.position().left + newZoomLeft), newSnWidth + 1, newSnHeight + 1);
+ mos.loadPlayer(mos.snTop, mos.snLeft, mos.snWidth, mos.snHeight, newZoomTop, newZoomLeft);
/*mos.unload();
mos.localMos.loadLocalMosaic(newZoomTop, newZoomLeft, newSnWidth, newSnHeight, mos.imgs, tab[1]);*/
@@ -400,7 +442,7 @@
/*
* Chargement du player basé sur le metadataplayer.
*/
-mosaic.prototype.loadPlayer = function(newZoomTop, newZoomLeft, newSnWidth, newSnHeight)
+mosaic.prototype.loadPlayer = function(newZoomTop, newZoomLeft, newSnWidth, newSnHeight, zoomTop, zoomLeft)
{
//On configure les options de lancement.
IriSP.libFiles.defaultDir = "../lib/";
@@ -411,14 +453,15 @@
console.log('VIDEO[' + this.centerId + '] : ' + videoToPlay);
console.log('MD[' + this.centerId + '] : ' + currentMetadata);
- console.log(newZoomTop + " " + newZoomLeft);
-
var _metadata = {
url: currentMetadata,
format: 'ldt'
};
+ console.log(zoomTop + " m" + this.marginWidth);
var _config = {
gui: {
+ zoomTop: zoomTop - this.marginWidth*2,
+ zoomLeft: zoomLeft,
width: newSnWidth,
height: newSnHeight,
container: 'LdtPlayer',
@@ -467,6 +510,11 @@
{
return;
}
+
+ this.snTop = 0;
+ this.snLeft = 0;
+ this.Width = 0;
+ this.snHeight = 0;
//On charge les attributs nécessaires aux calculs.
var sWidth = this.snapshotWidth, sHeight = this.snapshotHeight;
@@ -478,7 +526,8 @@
var src = zoomedImg.attr('src');
zoomedImg.attr('src', src.replace('snapshots/', 'snapshots-little/'));
- $('div').remove('.LdtPlayer');
+ mos.player.widgets[0].freePlayer();
+ $('.LdtPlayer').remove();
$('body').append('<div class="LdtPlayer" id="LdtPlayer"></div>');
//On rend leur opacité aux snapshots. Qui ne sont alors plus grisés.
@@ -505,6 +554,8 @@
mos.currentMode = 'MOSAIC';
//On ne permet plus le déplacement vers les voisins.
$('.snapshotDivs').unbind('mouseenter', mos.selectNeighbour);
+ //On remet les notifications initiales.
+ mos.notifySelectionSearchMosaicFull();
});
}
@@ -691,7 +742,8 @@
$(this).css('opacity', '0');
neighbourFrame.remove();
- $('div').remove('.LdtPlayer');
+ mos.player.widgets[0].freePlayer();
+ $('.LdtPlayer').remove();
$('body').append('<div class="LdtPlayer" id="LdtPlayer"></div>');
//On grise le snapshot qu'on vient de quitter.
@@ -718,7 +770,7 @@
mos.previousZoomedSN = $('#snapshotDiv-' + mos.centerId);
mos.listenToNeighbours();
- mos.loadPlayer((destinationImg.position().top + MPCurrentTop + mos.MPTop_margin), (destinationImg.position().left + MPCurrentLeft), destinationImg.width(), destinationImg.height());
+ mos.loadPlayer((destinationImg.position().top + MPCurrentTop + mos.MPTop_margin), (destinationImg.position().left + MPCurrentLeft), destinationImg.width(), destinationImg.height(), MPCurrentTop, MPCurrentLeft);
});
});
}
@@ -776,6 +828,7 @@
mosaic.prototype.loadFromJson = function(path)
{
var _this = this;
+ var i = 0;
$.getJSON(path, function(data)
{
@@ -786,12 +839,15 @@
{
$.getJSON(val_video.metadata, function(meta)
{
- _this.affectVideoById(val_video.metadata, meta.medias[0].url.replace('rtmp://', 'http://').replace('/ddc_player/', '/'));
+ _this.affectVideoById(val_video.metadata, meta.medias[0].url.replace('rtmp://', 'http://').replace('/ddc_player/', '/').replace('mp4:', '').replace('.m4v', '.mp4'));
//console.log(meta.medias[0].url.replace('rtmp://', 'http://').replace('/ddc_player/', '/'));
});
- _this.imgs.push(val_video.snapshot);
- _this.urls.push(val_video.metadata);
+ // _this.imgs.push(val_video.snapshot);
+ // _this.urls.push(val_video.metadata);
+ _this.imgs[_this.ids[i]] = val_video.snapshot;
+ _this.urls[_this.ids[i]] = val_video.metadata;
+ i++;
});
});
console.log('rdy');
@@ -812,4 +868,267 @@
break;
}
}
+}
+
+/*
+ * Lance une recherche par courbes.
+ */
+mosaic.prototype.startSearch = function()
+{
+ var top, left, width, height, margin_top, inMosaic;
+ //Si on est dans le cas d'un filtrage de mosaïque.
+ if(this.currentMode == "FILTER")
+ {
+ var mainPanel = $('#mainPanel');
+ top = mainPanel.position().top;
+ left = mainPanel.position().left;
+ width = mainPanel.width();
+ height = mainPanel.height();
+ margin_top = this.MPTop_margin;
+ inMosaic = true;
+ }
+ //Sinon si c'est une recherche dans la vidéo.
+ else if(this.currentMode == "SEARCH")
+ {
+ top = this.snTop;
+ left = this.snLeft;
+ width = this.snWidth;
+ height = this.snHeight;
+ margin_top = '0px';
+ inMosaic = false;
+ }
+
+ this.searchCanvas = new searchCanvas(top, left, width, height, margin_top, this.timeSearchFade, inMosaic);
+ this.searchCanvas.create();
+}
+
+/*
+ * Quitte une recherche par courbes.
+ */
+mosaic.prototype.leaveSearch = function()
+{
+ this.searchCanvas.leaveSearch();
+}
+
+/* ===============================================
+ * *
+ * ZONE DES NOTIFICATIONS *
+ * *
+ =============================================== */
+
+/*
+ * Affiche la notification de sélection/recherche lorsque la mosaique est complète.
+*/
+mosaic.prototype.notifySelectionSearchMosaicFull = function()
+{
+ //On spécifie les notifications en div.
+ var notification_selection = "<div id='notify_selection' class='notifications'></div>";
+ var notification_search = "<div id='notify_search' class='notifications'></div>";
+
+ //On les ajoute à la mosaïque.
+ $('#mainPanel').append(notification_selection + notification_search);
+
+ //On calcule leurs coordonnées et dimensions.
+ var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
+ var notify_margin = parseInt($('.notifications').css('margin'));
+ var selection_left = $(window).width() / 2 - (notify_width * 2 + notify_margin * 3) / 2;
+ var search_left = selection_left + notify_width + notify_margin;
+
+ //On les positionne.
+ $('#notify_selection').css(
+ {
+ left: selection_left
+ });
+ $('#notify_search').css(
+ {
+ left: search_left
+ });
+
+ //On les fait apparaître.
+ $('.notifications').css(
+ {
+ opacity: "0.9"
+ });
+}
+
+/*
+ * Supprime la notification de sélection/recherche lorsque la mosaique est complète.
+*/
+mosaic.prototype.removeSelectionSearchMosaicFull = function()
+{
+ $('#notify_selection, #notify_search').remove();
+}
+
+/*
+ * Affiche la notification de maintient du pointage lors d'une phase de prézoom.
+*/
+mosaic.prototype.notifyPointMosaicPrezoom = function()
+{
+ if($('#notify_point').length > 0)
+ {
+ return;
+ }
+
+ //On spécifie les notifications en div.
+ var notification_point = "<div id='notify_point' class='notifications'></div>";
+
+ //On les ajoute à la mosaïque.
+ $('#mainPanel').append(notification_point);
+ console.log('Append');
+ //On calcule leurs coordonnées et dimensions.
+ var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
+ var notify_margin = parseInt($('.notifications').css('margin'));
+ var point_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
+
+ //On les positionne.
+ $('#notify_point').css(
+ {
+ left: point_left
+ });
+
+ //On les fait apparaître.
+ $('.notifications').css(
+ {
+ opacity: "0.9"
+ });
+}
+
+/*
+ * Supprime la notification de maintient du pointage.
+*/
+mosaic.prototype.removePointMosaicPrezoom = function()
+{
+ $('#notify_point').remove();
+}
+
+/*
+ * Affiche l'aide.
+*/
+mosaic.prototype.notifyHelp = function()
+{
+ if(this.helpDisplayed)
+ {
+ return;
+ }
+
+ this.removeSelectionSearchMosaicFull();
+ this.removePointMosaicPrezoom();
+
+ this.helpDisplayed = true;
+
+ var search_2hands_tab = ['no_motion', 'right_angle', 'contact', 'grand_jete', 'circle', 'screw', 'arc', 'rythme', 'slow', 'up_down', 'wave', 'wheel'];
+ var search_body_tab = ['bend', 'fall', 'jump', 'hello', 'knee_up'];
+ var controls_1hand_tab = ['selection'];
+
+ //On spécifie les notifications en div.
+ var search_title = "<div id='search_title'></div>";
+ var search_img = "<div id='search_img' class='notify_imgs'></div>";
+ var search_2hands_text = "<div id='search_2hands_text'></div>";
+ var search_2hands_imgs = "<div id='search_2hands_imgs' class='notify_imgs_big'>";
+
+ for(var i = 0 ; i < search_2hands_tab.length ; i++)
+ {
+ search_2hands_imgs += "<div id='2hands_" + search_2hands_tab[i] + "' class='notify_imgs_small'></div>";
+ }
+ search_2hands_imgs += "</div>";
+
+ var search_body_text = "<div id='search_body_text'></div>";
+ var search_body_imgs = "<div id='search_2hands_imgs' class='notify_imgs'>"
+
+ for(var i = 0 ; i < search_body_tab.length ; i++)
+ {
+ search_body_imgs += "<div id='body_" + search_body_tab[i] + "' class='notify_imgs_small'></div>";
+ }
+ search_body_imgs += "</div>";
+
+ var controls_title = "<div id='controls_title'></div>";
+ var controls_img = "<div id='controls_img' class='notify_imgs'></div>";
+ var controls_1hand_text = "<div id='controls_1hand_text'></div>";
+ var controls_1hand_imgs = "<div id='controls_1hand_imgs' class='notify_imgs'>";
+
+ for(var i = 0 ; i < controls_1hand_tab.length ; i++)
+ {
+ controls_1hand_imgs += "<div id='1hand_" + controls_1hand_tab[i] + "' class='notify_imgs_small'></div>";
+ }
+ controls_1hand_imgs += "</div>";
+
+ var help_search = "<div id='help_search'>" + search_title + search_img + search_2hands_text + search_2hands_imgs + search_body_text + search_body_imgs + "</div>";
+ var help_controls = "<div id='help_controls'>" + controls_title + controls_img + controls_1hand_text + controls_1hand_imgs + "</div>";
+
+ var notification_help = "<div id='notify_help'>" + help_search + "<div id='help_sep'></div>" + help_controls + "</div>";
+
+ //On les ajoute à la mosaïque.
+ $('body').append(notification_help);
+
+ //On calcule leurs coordonnées et dimensions.
+ var notify_width = $(window).width(), notify_height = $(window).height();
+ var notify_margin = parseInt($('#notify_help').css('margin'));
+ var notify_ = 10;
+
+ //On les positionne.
+ $('#notify_help').css(
+ {
+ left: "0px",
+ top: "0px",
+ width: notify_width - notify_margin * 2,
+ height: notify_height - notify_margin * 2,
+ "margin-top": notify_margin_top
+ });
+
+ var search_width = $('#help_search').width();
+
+ $('#search_title').html('Recherche');
+ $('#search_2hands_text').html('Gestes à effectuer avec les deux mains');
+ $('#search_body_text').html('Gestes à effectuer avec le corps entier');
+
+ for(var i = 0 ; i < search_2hands_tab.length ; i++)
+ {
+ $("#2hands_" + search_2hands_tab[i]).css("background-image", "url('./pictos/help/" + search_2hands_tab[i] + ".png')");
+ //console.log("url('../../pictos/help/" + search_2hands_tab[i] + ".png')");
+ }
+
+ for(var i = 0 ; i < search_body_tab.length ; i++)
+ {
+ $("#body_" + search_body_tab[i]).css("background-image", "url('./pictos/help/" + search_body_tab[i] + ".png')");
+ //console.log("url('../../pictos/help/" + search_2hands_tab[i] + ".png')");
+ }
+
+ $('#controls_title').html('Contrôles');
+ $('#controls_1hand_text').html('Gestes à effectuer avec une seule main');
+
+ for(var i = 0 ; i < controls_1hand_tab.length ; i++)
+ {
+ $("#1hand_" + controls_1hand_tab[i]).css("background-image", "url('./pictos/help/" + controls_1hand_tab[i] + ".png')");
+ //console.log("url('../../pictos/help/" + search_2hands_tab[i] + ".png')");
+ }
+
+ //On les fait apparaître.
+ $('#notify_help').css(
+ {
+ opacity: "1"
+ });
+
+ $('.notify_imgs_big').css(
+ {
+ opacity: "1"
+ });
+}
+
+/*
+ * Supprime l'aide.
+*/
+mosaic.prototype.removeHelp = function()
+{
+ if(!this.helpDisplayed)
+ {
+ return;
+ }
+
+ var _this = this;
+
+ $('#notify_help').fadeOut(this.timeNotifyFade, function()
+ {
+ _this.helpDisplayed = false;
+ $('#notify_help').remove();
+ });
}
\ No newline at end of file
--- a/front_idill/src/mosaic/mosaic/css/mosaic.anc.less Mon May 14 17:20:35 2012 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,107 +0,0 @@
-/*
-* This file is part of the TraKERS\Front IDILL package.
-*
-* (c) IRI <http://www.iri.centrepompidou.fr/>
-*
-* For the full copyright and license information, please view the LICENSE
-* file that was distributed with this source code.
-*/
-
-/*
- * Projet : TraKERS
- * Module : Front IDILL
- * Fichier : mosaic.less
- *
- * Auteur : alexandre.bastien@iri.centrepompidou.fr
- *
- * Fonctionnalités : Définit les propriétés d'apparence des éléments de base de la mosaïque (les snapshots, la mosaïque en elle-même).
- *
- * Avertissement : Afin que ce fichier puisse compiler, il est nécessaire de lancer index.html depuis un chemin ne commencant pas par file:///.
- * C'est pourquoi j'utilise WAMP pour le lancer.
- */
-
-@mosaic-border-tickness: 1px;
-@mosaic-background-color: #202020;
-@mosaic-background-image-path: url("../../img/background.png");
-@selected-snapshot-background-image-path: url("../../img/selected_background.png");
-@snapshots-background-color: #8D8D8D;
-@snapshots-margin-value: 5px;
-@snapshots-margin: @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value;
-@black: #000000;
-
-body
-{
- overflow: hidden;
- background-color: @black;
-}
-
-/*
- * Il s'agit des propriétés de la mosaïque en elle même.
- * On désactive les barres de défilement, on peut la placer à n'importe qu'elle position, elle doit être aussi large que la fenêtre du navigateur.
- * Son fond se répète.
- */
-#mainPanel
-{
- overflow: hidden;
- position: absolute;
- width: 100%;
- top: 0px;
- left: 0px;
- background-image: @mosaic-background-image-path;
- background-repeat: repeat;
-}
-
-/*
- * Les divs contenant les snapshots (ou les "voisins" aussi en cas de zoom total). Ils se positionnent par défaut de gauche à droite, à l'horizontale et wrap dès
- * qu'ils ont atteint la bordure de fenêtre de droite.
- */
-.snapshotDivs, .neighbourDivs
-{
- background-color: @black;
- margin: @snapshots-margin;
- float: left;
-}
-
-/*
- * Les snapshots sont des images, elles doivent remplir l'intégralité de leurs divs (snapshotDivs).
- */
-.snapshots
-{
- width: 100%;
- height: 100%;
-}
-
-/*
- * Ce sont des divs créés spécialement lors d'un prézoom. Leur fonction est d'afficher un clone du snapshot, superposé au précédent et de grandir un peu de manière
- * à faire ressortir visuellement le snapshot pointé. Leur bordure est d'une couleur différente au fond, ce qui permet de les discerner plus facilement dans la mosaïque.
- * au départ, lors de sa création, il est caché, mais apparaît dès que l'image est chargée.
- */
-.prezoomContainers
-{
- position: absolute;
- display: none;
- background-image: @selected-snapshot-background-image-path;
- background-repeat: repeat;
-}
-
-/*
- * Cette classe est attachée à des divs destinés à remplir les bordures d'une mosaïque locale.
- */
-.blacks
-{
- background-color: @black;
- float: left;
-}
-
-/*
- * C'est une classe appliquée aux divs "voisins", afin de les colorer lorsque l'utilisateur intéragit avec eux.
- * Ils se positionnent exactement sur le voisin qu'ils représentent, à la manière du clone de prézoom (prezoomContainer), bien que celui-là n'est qu'un div simple
- * ne contenant pas d'image.
- * Au départ, l'opacité est à 0, ce qui signifie que ce div est invisible. L'opacité change lors d'intéractions avec cet objet. Le div apparaît alors.
- */
-.cyan
-{
- position: absolute;
- background-color: #94C6C5;
- opacity: 0;
-}
\ No newline at end of file
--- a/front_idill/src/mosaic/mosaic/css/mosaic.less Mon May 14 17:20:35 2012 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,132 +0,0 @@
-/*
-* This file is part of the TraKERS\Front IDILL package.
-*
-* (c) IRI <http://www.iri.centrepompidou.fr/>
-*
-* For the full copyright and license information, please view the LICENSE
-* file that was distributed with this source code.
-*/
-
-/*
- * Projet : TraKERS
- * Module : Front IDILL
- * Fichier : mosaic.less
- *
- * Auteur : alexandre.bastien@iri.centrepompidou.fr
- *
- * Fonctionnalités : Définit les propriétés d'apparence des éléments de base de la mosaïque (les snapshots, la mosaïque en elle-même).
- *
- * Avertissement : Afin que ce fichier puisse compiler, il est nécessaire de lancer index.html depuis un chemin ne commencant pas par file:///.
- * C'est pourquoi j'utilise WAMP pour le lancer.
- */
-
-@mosaic-border-tickness: 1px;
-@mosaic-background-color: #202020;
-@mosaic-background-image-path: url("../../img/background.png");
-@selected-snapshot-background-image-path: url("../../img/selected_background.png");
-@snapshots-background-color: #8D8D8D;
-@snapshots-margin-value: 8px;
-@snapshots-margin: @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value @snapshots-margin-value;
-@black: #000000;
-
-body
-{
- //overflow: hidden;
- background-color: @black;
-}
-
-/*
- * Il s'agit des propriétés de la mosaïque en elle même.
- * On désactive les barres de défilement, on peut la placer à n'importe qu'elle position, elle doit être aussi large que la fenêtre du navigateur.
- * Son fond se répète.
- */
-#mainPanel
-{
- overflow: hidden;
- position: absolute;
- width: 100%;
- top: 0px;
- left: 0px;
- background-image: @mosaic-background-image-path;
- background-repeat: repeat;
-}
-
-/*
- * Les divs contenant les snapshots (ou les "voisins" aussi en cas de zoom total). Ils se positionnent par défaut de gauche à droite, à l'horizontale et wrap dès
- * qu'ils ont atteint la bordure de fenêtre de droite.
- */
-.snapshotDivs, .neighbourDivs
-{
- background-color: @black;
- margin: @snapshots-margin;
- float: left;
-}
-
-/*
- * Les snapshots sont des images, elles doivent remplir l'intégralité de leurs divs (snapshotDivs).
- */
-.snapshots
-{
- width: 100%;
- height: 100%;
-}
-
-/*
- * Ce sont des divs créés spécialement lors d'un prézoom. Leur fonction est d'afficher un clone du snapshot, superposé au précédent et de grandir un peu de manière
- * à faire ressortir visuellement le snapshot pointé. Leur bordure est d'une couleur différente au fond, ce qui permet de les discerner plus facilement dans la mosaïque.
- * au départ, lors de sa création, il est caché, mais apparaît dès que l'image est chargée.
- */
-.prezoomContainers
-{
- position: absolute;
- display: none;
- background-image: @selected-snapshot-background-image-path;
- background-repeat: repeat;
-}
-
-/*
- * Cette classe est attachée à des divs destinés à remplir les bordures d'une mosaïque locale.
- */
-.blacks
-{
- background-color: @black;
- float: left;
-}
-
-/*
- * C'est une classe appliquée aux divs "voisins", afin de les colorer lorsque l'utilisateur intéragit avec eux.
- * Ils se positionnent exactement sur le voisin qu'ils représentent, à la manière du clone de prézoom (prezoomContainer), bien que celui-là n'est qu'un div simple
- * ne contenant pas d'image.
- * Au départ, l'opacité est à 0, ce qui signifie que ce div est invisible. L'opacité change lors d'intéractions avec cet objet. Le div apparaît alors.
- */
-.neighbourFrame
-{
- position: absolute;
- //background-color: #94C6C5;
- //background-color: rgba(148, 198, 197, 1);
- background-image: @selected-snapshot-background-image-path;
- background-repeat: repeat;
- opacity: 0;
-}
-
-/*
- *
- */
-.neighbourImgBg
-{
- position: absolute;
- background-image: @mosaic-background-image-path;
-}
-
-/*
- *
- */
-.neighbourImg
-{
- position: absolute;
-}
-
-video
-{
- //position: absolute;
-}
\ No newline at end of file
--- a/front_idill/src/mosaic/mosaic/css/reset.css Mon May 14 17:20:35 2012 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,48 +0,0 @@
-/* http://meyerweb.com/eric/tools/css/reset/
- v2.0 | 20110126
- License: none (public domain)
-*/
-
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
- margin: 0;
- padding: 0;
- border: 0;
- font-size: 100%;
- font: inherit;
- vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
- display: block;
-}
-body {
- line-height: 1;
-}
-ol, ul {
- list-style: none;
-}
-blockquote, q {
- quotes: none;
-}
-blockquote:before, blockquote:after,
-q:before, q:after {
- content: '';
- content: none;
-}
-table {
- border-collapse: collapse;
- border-spacing: 0;
-}
\ No newline at end of file
--- a/front_idill/src/mosaic/mosaic/js/localMosaic.js Mon May 14 17:20:35 2012 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,106 +0,0 @@
-/*
-* This file is part of the TraKERS\Front IDILL package.
-*
-* (c) IRI <http://www.iri.centrepompidou.fr/>
-*
-* For the full copyright and license information, please view the LICENSE
-* file that was distributed with this source code.
-*/
-
-/*
- * Projet : TraKERS
- * Module : Front IDILL
- * Fichier : localMosaic.js
- *
- * Auteur : alexandre.bastien@iri.centrepompidou.fr
- *
- * Fonctionnalités : Définit la "classe" mosaïque locale (lors d'un zoom sur une mosaïque) et définit des fonctions d'intéractions.
- */
-
-/*
- * Classe définissant la mosaïque locale.
- * Elle sera toujours de la forme 3x3, même si toutes les cases ne seront pas remplies par des snapshots (cas des bords et coins).
-*/
-function localMosaic(len, imgToShow, marginWidth)
-{
- if(imgToShow % len == 0)
- {
- this.length = len;
- this.imagesToShow = imgToShow;
- this.centerId;
- this.urls = [];
- this.imgs = [];
- this.ids = [];
- this.width;
- this.height;
- this.marginWidth = marginWidth;
- this.zoomed;
- this.snapshotTop;
- this.snapshotLeft;
- this.snapshotWidth;
- this.snapshotHeight;
- }
- else
- {
- //Affiche un message d'erreur.
- }
-}
-
-/*
- * Crée la mosaïque locale, qui est une partie de la mosaïque de mosaic.js.
- * Il y a le snapshot sur lequel on a zoomé, et les 8 snapshots voisins.
-*/
-localMosaic.prototype.createLocalMosaic = function()
-{
- var str = '';
-
- var t = this.coord1Dto2D(this.centerId);
- var localId;
-
- for(var a = t[1] - 1 ; a < t[1] + 2 ; a++)
- for(var b = t[0] - 1 ; b < t[0] + 2 ; b++)
- if(a > -1 && a < this.imagesToShow / this.length && b > -1 && b < this.length)
- {
- localId = this.coord2Dto1D(a, b);
- str += '<div class="snapshotDivs"><img id="snapshot-' + localId + '" class="snapshots" src="snapshots-little/' + this.imgs[localId] + '" /></div>';
- }
- else
- str += '<div class="blacks"></div>';
-
- return str;
-}
-
-/*
- * Permet de charger la mosaïque locale.
-*/
-localMosaic.prototype.loadLocalMosaic = function(snTop, snLeft, snWidth, snHeight, imgsTab, id)
-{
- //On affecte les chemins vers les images à la mosaïque.
- this.imgs = imgsTab;
- this.centerId = id;
- this.snapshotTop = snTop;//*(newPreMPHeight/initMPHeight) - this.zoomedMargin/2 + (initMPHeight - initMPHeight * this.zoomPercentage)/2 + 'px';
- this.previousMPLeft = snLeft;
- this.snapshotWidth = snWidth;
- this.snapshotHeight = snHeight;
- //On met à jour la mosaïque.
- $('#mainPanel').html(this.createLocalMosaic(id));
- $('.snapshotDivs').css('width', snWidth).css('height', snHeight).css('margin', this.marginWidth/2);
- // var lMosTop = , newZoomLeft = -this.previousZoomedSN.position().left*(newPreMPWidth/initMPWidth) - this.zoomedMargin/2 + (initMPWidth - initMPWidth * this.zoomPercentage)/2 + 'px';
- $('#mainPanel').css('top', 0).css('left', 0);
-}
-
-/*
- * Change de 1 à 2 dimensions pour les coordonnées des snapshots dans la mosaïque.
-*/
-localMosaic.prototype.coord1Dto2D = function(i)
-{
- return [i%length, Math.floor(i/this.length)];
-}
-
-/*
- * Change de 2 à 1 dimension pour les coordonnées des snapshots dans la mosaïque.
-*/
-localMosaic.prototype.coord2Dto1D = function(i, j)
-{
- return j * this.length + i;
-}
\ No newline at end of file
--- a/front_idill/src/mosaic/mosaic/js/mosaic.js Mon May 14 17:20:35 2012 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,815 +0,0 @@
-/*
-* This file is part of the TraKERS\Front IDILL package.
-*
-* (c) IRI <http://www.iri.centrepompidou.fr/>
-*
-* For the full copyright and license information, please view the LICENSE
-* file that was distributed with this source code.
-*/
-
-/*
- * Projet : TraKERS
- * Module : Front IDILL
- * Fichier : mosaic.js
- *
- * Auteur : alexandre.bastien@iri.centrepompidou.fr
- *
- * Fonctionnalités : Définit la "classe" mosaïque et définit des fonctions d'intéractions.
- */
-
-/*
- * Classe définissant la mosaïque.
- * Elle contient sa longueur, le nombre d'images total, une liste d'urls pour les vidéos, leurs snapshots principaux et leur position.
- * Contient également les dimensions en px de la mosaïque.
- */
-function mosaic(len, imgToShow, zoomPercentage, prezoomPercentage, zoomedMargin)
-{
- //S'il s'agit d'un rectangle.
- if(imgToShow % len == 0)
- {
- //Longueur horizontale.
- this.length = len;
- //Nombre d'images dans la mosaïque.
- this.imagesToShow = imgToShow;
- //Tableaux des urls des vidéos, des snapshots et de leur position dans la mosaïque.
- this.videos = [];
- this.urls = [];
- this.imgs = [];
- this.ids = [];
- //Dimensions de la mosaïque en pixels.
- this.width;
- this.height;
- //Dimensions d'un snapshot en pixels.
- this.snapshotWidth;
- this.snapshotHeight;
- //Espacement entre les snapshots en pixels.
- this.marginWidth;
-
- //Temps d'intéractions/d'animations.
- this.preZoomTime;
- this.preUnzoomTime;
- this.zoomTime;
- this.unzoomTime;
- this.timeNeighbourGlowing;
- this.timeNeighbourUnglowing;
- this.timeMovingToNeighbour;
-
- //Booléens permettant ou non certaines intéractions selon le contexte.
- this.zoomed;
- this.fullscreen;
- this.canMoveToNeighbour;
-
- //Mode actuel.
- this.currentMode;
- //Snapshot sur lequel on a zoomé.
- this.previousZoomedSN;
- //Son ID.
- this.previousId;
- //Largeur de la marge pour le centrage vertical de la mosaïque.
- this.MPTop_margin;
- this.top_margin;
- //Pourcentage d'agrandissement lors d'un prézoom et d'un zoom.
- this.prezoomPercentage = prezoomPercentage;
- this.zoomPercentage = zoomPercentage;
- //Espacement des snapshots après un zoom.
- this.zoomedMargin = zoomedMargin;
- //Mosaïque locale.
- this.localMos;
- //Position des voisins lors d'un zoom.
- this.neighboursIds = [];
- //ID du snapshot du milieu lors d'un zoom.
- this.centerId;
-
- this.player;
-
- this.loadFromJson('./player/json/videos.json');
- }
- else
- {
- //Affiche un message d'erreur.
- }
-}
-
-/*
- * Méthode d'affichage de la mosaïque.
- * Génère une matrice de imgs.
- */
-mosaic.prototype.createMosaic = function()
-{
- this.previousZoomedSN = '';
- this.previousPrezoomDiv = '';
- this.fullscreen = false;
- this.canMoveToNeighbour = false;
- var str = '';
-
- if(this.imgs.length >= this.imagesToShow)
- {
- for(var i = 0 ; i < this.imagesToShow ; i++)
- {
- //On charge les images de petite taille pour ne pas surcharger la mosaïque lors de l'affichage global.
- str += '<div id="snapshotDiv-' + i + '" class="snapshotDivs"><img id="snapshot-' + i + '" class="snapshots" src="snapshots-little/' + this.imgs[i] + '" /></div>';
- }
- }
-
- console.log(this.imagesToShow);
-
- return str;
-}
-
-/*
- * Permet de raffraichir la mosaïque.
- */
-mosaic.prototype.loadMosaic = function()
-{
- var createMosaic = this.createMosaic();
-
- if(createMosaic == '')
- {
- return;
- }
-
- var _this = this;
-
- //On affecte les chemins vers les images à la mosaïque.
- this.previousZoomedSN;
- //this.width =
- //On met à jour la mosaïque.
- $('#mainPanel').html(createMosaic);
- //On récupère la taille des bordures.
- this.marginWidth = $('.snapshotDivs').css('margin-bottom');
- this.marginWidth = parseFloat(mos.marginWidth)*2;
- //On calcule la taille des divs contenant les snapshots.
- this.width = $('#mainPanel').innerWidth();
- //On ne calculera pas tout de suite la hauteur de la mosaique étant donnée qu'elle est calculée par la suite dynamiquement.
- this.snapshotWidth = this.width / this.length - this.marginWidth;
- this.snapshotHeight = this.snapshotWidth*9/16;
- $('.snapshotDivs').css('width', this.snapshotWidth).css('height', this.snapshotHeight).css('margin', this.marginWidth/2);
-
- this.height = $('#mainPanel').innerHeight();
- //On centre verticalement la mosaïque.
- this.MPTop_margin = ($(document).height() - $('#mainPanel').height())/2;
- $('#mainPanel').css('margin-top', this.MPTop_margin).css('margin-bottom', this.MPTop_margin);
-
- $('.snapshotDivs').mouseenter(function ()
- {
- //On effectue un prézoom dès qu'on va sur une image.
- _this.preZoom($(this));
- });
- $('body').keypress(function (event)
- {
- //Si on a appuié sur la touche 'q' ou 'Q';
- if(event.which == 113 || event.which == 81)
- {
- _this.unzoom();
- }
- });
-}
-
-/*
- * Zoom sur la position d'une image, 1ère partie. Durant le laps de temps de time ms, l'utilisateur a le choix de zoomer sur une autre image.
- * Après ce laps de temps, l'image zoom complétement et il n'est plus possible de sélectionner une autre image par pointage.
- */
-mosaic.prototype.preZoom = function(snapshot)
-{
- if(this.fullscreen)
- {
- return;
- }
- //Mosaïque.
- var mosaic = this;
- //Dimensions de la mosaïque.
- var h = this.height, w = this.width;
- //Longueur en images, nombre d'images et taille de bordure de la mosaïque.
- var len = this.length, imgs = this.imagesToShow, margin = this.marginWidth;
- //Dimensions et position d'un snapshot dans la mosaïque.
- var snHeight = this.snapshotHeight, snWidth = this.snapshotWidth;
- var sTop = snapshot.position().top, sLeft = snapshot.position().left;
- var prezoomPercentage = this.prezoomPercentage;
-
- //ID de l'image actuelle.
- var currentId = $('img', snapshot).attr('id');
-
- //Si un zoom est déjà en cours, on ne zoom sur rien d'autre en attendant que ce snapshot ai dézoomé en cas de mouseleave.
- if(this.zoomed)
- {
- if($('#preZoomContainer-' + currentId) != $(this) && this.previousZoomedSN != '' && this.previousId != '')
- {
- this.preUnzoom();
- }
- else
- {
- return;
- }
- }
-
- //On indique qu'on a zoomé et on spécifie le snapshot sur lequel on a zoomé.
- this.zoomed = true;
- this.previousZoomedSN = snapshot;
- this.previousId = currentId;
-
- //On récupère les attributs de l'image.
- var fakeImg = $('img', snapshot);
- //On forme la balise de la fausse image et on passe son url pour les grands snapshots.
- fakeImg = '<img id="fake-' + currentId + '" class="snapshots" src="' + fakeImg.attr('src').replace('-little/', '/') + '" />';
- //On génère un faux snapshot identique au précédent et qu'on va coller dessus.
- var fakeSnapshot = '<div id="prezoomContainer-' + currentId + '" class="prezoomContainers"><div id="prezoomSnapshot-' + currentId + '" class="snapshotDivs">' + fakeImg + '</div></div>';
-
- //On l'ajoute à la mosaïque.
- $('#mainPanel').append(fakeSnapshot);
- //On modifie ses attributs.
- $('#fake-' + currentId).load(function()
- {
- $('#prezoomContainer-' + currentId).css('display', 'block');
- $('#prezoomContainer-' + currentId).css('top', sTop).css('left', sLeft).css('width', (snWidth + margin)).css('height', (snHeight + margin));
- $('#prezoomSnapshot-' + currentId).css('width', (snWidth)).css('height', (snHeight));
-
- //Dimensions et coordonnées initiales du div sur lequel on zoom.
- var initialDivWidth = $('#prezoomContainer-' + currentId).width(), initialDivHeight = $('#prezoomContainer-' + currentId).height();
- var initialDivTop = $('#prezoomContainer-' + currentId).position().top, initialDivLeft = $('#prezoomContainer-' + currentId).position().left;
- //Dimensions et coordonnées finales du div.
- var finalDivWidth = initialDivWidth * (prezoomPercentage+1), diffWidth = finalDivWidth - initialDivWidth, finalDivHeight = initialDivHeight + diffWidth;
- var finalDivTop = (initialDivTop - (finalDivHeight - snHeight)/2), finalDivLeft = (initialDivLeft - (finalDivWidth - snWidth)/2);
-
- //CAS PARTICULIER pour la position du snapshot zoomé : les bordures.
- if(finalDivTop < 0)
- {
- finalDivTop = -margin;
- }
- if(finalDivTop + finalDivHeight > h)
- {
- finalDivTop = h - finalDivHeight;
- }
- if(finalDivLeft < 0)
- {
- finalDivLeft = 0;
- }
- if(finalDivLeft + finalDivWidth + margin*2 > w)
- {
- finalDivLeft = w - finalDivWidth - margin*2;
- }
-
- ////Code de debug.
- ////CAUTION////
- /*var red = '<div id="red"></div>';
- if($('#red') != null || $('#red') != undefined)
- $('body').append(red);
- $('#red').css('background-color', '#FF0000').css('position', 'absolute').css('top', '0px').css('left', '0px').css('width', '100px').css('height', '100px');
- $('#red').css('top', finalDivTop).css('left', finalDivLeft).css('width', finalDivWidth).css('height', finalDivHeight);*/
- //alert("initial : " + initialDivWidth + " " + initialDivHeight + " ; final : " + finalDivWidth + " " + finalDivHeight);
- ////CAUTION////
-
- //On prézoom le div en le centrant sur le milieu du snapshot pointé.
- $('#prezoomSnapshot-' + currentId).animate(
- {
- width: finalDivWidth + margin,
- height: finalDivHeight - margin*2,
- top: finalDivTop + margin,
- left: finalDivLeft + margin
- }, this.preZoomTime);
- $('#prezoomContainer-' + currentId).animate(
- {
- width: finalDivWidth + margin*2,
- height: finalDivHeight - margin,
- top: finalDivTop + margin,
- left: finalDivLeft
- }, this.preZoomTime);
- });
-
- //Si on clique sur le snapshot prézoomé, on enclenche un zoom total sur ce snapshot.
- $('#prezoomContainer-' + currentId).click(function ()
- {
- if(this.previousZoomedSN != '')
- {
- mosaic.zoom();
- }
- });
-}
-
-/*
- * Dézoome sur la position de l'image. Il est à noter que ce dézoome diffère du dézoom global dans la mesure où celui-ci ne concerne que l'image sur laquelle on a zoomé.
- */
-mosaic.prototype.preUnzoom = function()
-{
- //Si on n'a pas zoomé, on quitte la fonction.
- if(!this.zoomed)
- {
- return;
- }
-
- //On spécifie la marge afin de centrer le prédézoom.
- var margin = this.marginWidth;
- //ID du snapshot précédemment pointé.
- var id = this.previousId;
- //On ne zoom plus.
- this.zoomed = false;
- //On rétrécit le snapshot de prézoom, puis on le supprime en donnant l'illusion qu'il s'agissait du véritable snapshot, alors qu'en fait c'était un clone.
- $('#prezoomSnapshot-' + id).animate(
- {
- width: this.snapshotWidth,
- height: this.snapshotHeight,
- top: this.previousZoomedSN.position().top,
- left: this.previousZoomedSN.position().left
- }, this.preUnzoomTime);
- $('#prezoomContainer-' + id).animate(
- {
- width: this.snapshotWidth + margin,
- height: this.snapshotHeight + margin,
- top: this.previousZoomedSN.position().top,
- left: this.previousZoomedSN.position().left
- }, this.preUnzoomTime, function(){ $(this).remove(); this.zoomed = false; });
-}
-
-
-/*
- * Zoom d'un snapshot en plein écran.
- */
-mosaic.prototype.zoom = function()
-{
- var mos = this;
-
- //Si la mosaïque est en pleine écran, pas la peine de zoomer.
- if(this.fullscreen)
- {
- return;
- }
-
- //On prend les attributs nécessaires au calculs.
- var margin = this.marginWidth, len = this.length, imgs = this.imagesToShow;
- var initMPWidth = this.previousZoomedSN.width() * len + margin*len, initMPHeight = this.previousZoomedSN.height() * (imgs / len) + margin*(imgs / len);
- var newMPWidth = initMPWidth * len + this.zoomedMargin * (len), newMPHeight = initMPHeight * (imgs / len) + this.zoomedMargin * ((imgs / len));
- var newPreMPWidth = initMPWidth * len * this.zoomPercentage + this.zoomedMargin * (len), newPreMPHeight = initMPHeight * (imgs / len) * this.zoomPercentage + this.zoomedMargin * ((imgs / len));
-
- //Dimensions et coordonnées initiales du div sur lequel on zoom.
- var initialDivWidth = this.previousZoomedSN.width(), initialDivHeight = this.previousZoomedSN.height();
- var initialDivTop = this.previousZoomedSN.position().top, initialDivLeft = this.previousZoomedSN.position().left;
- //Dimensions et coordonnées finales du div.
- var finalDivWidth = initialDivWidth * (this.zoomPercentage+1), finalDivHeight = initialDivHeight * (this.zoomPercentage+1);
- var newZoomTop = -this.previousZoomedSN.position().top*(newPreMPHeight/initMPHeight) - this.zoomedMargin/2 + (initMPHeight - initMPHeight * this.zoomPercentage)/2, newZoomLeft = -this.previousZoomedSN.position().left*(newPreMPWidth/initMPWidth) - this.zoomedMargin/2 + (initMPWidth - initMPWidth * this.zoomPercentage)/2;
- var newSnWidth = initMPWidth * this.zoomPercentage, newSnHeight = initMPHeight * this.zoomPercentage;
-
- this.preUnzoom(this);
- /*SINGULARITE*/
- this.fullscreen = true;
-
- //On passe l'image du snapshot pointé en HD.
- var zoomedImg = $('img', this.previousZoomedSN);
- var src = zoomedImg.attr('src');
- zoomedImg.attr('src', src.replace('-little/', '/'));
-
- //On récupère son ID.
- var tab, zoomedImgId;
- tab = mos.previousId.split('-');
- zoomedImgId = tab[1];
-
- //Les snapshots baissent alors en opacité, donnant l'impression qu'ils sont grisés.
- $('.snapshotDivs').animate(
- {
- width: newSnWidth,
- height: newSnHeight,
- margin: this.zoomedMargin/2 + 'px',
- opacity: '0.4'
- }, this.zoomTime);
- //Le snapshot du milieu revient à une opacité optimale, ce qui attire l'attention de l'utilisateur.
- $(this.previousZoomedSN).animate(
- {
- opacity: '1'
- }, this.zoomTime);
- //On zoome sur la mosaïque.
- $('#mainPanel').animate(
- {
- width: newPreMPWidth,
- height: newPreMPHeight,
- top: newZoomTop,
- left: newZoomLeft
- }, this.zoomTime, function()
- {
- //On charge les interactions avec les voisins.
- mos.centerId = zoomedImgId;
- mos.listenToNeighbours();
- mos.currentMode = 'VIDEO';
-
- console.log('h : ' + -newZoomLeft + " " + zoomedImg.position().left);
-
- mos.loadPlayer((zoomedImg.position().top + newZoomTop + mos.MPTop_margin), (zoomedImg.position().left + newZoomLeft), newSnWidth + 1, newSnHeight + 1);
-
- /*mos.unload();
- mos.localMos.loadLocalMosaic(newZoomTop, newZoomLeft, newSnWidth, newSnHeight, mos.imgs, tab[1]);*/
- });
-}
-
-/*
- * Chargement du player basé sur le metadataplayer.
-*/
-mosaic.prototype.loadPlayer = function(newZoomTop, newZoomLeft, newSnWidth, newSnHeight)
-{
- //On configure les options de lancement.
- IriSP.libFiles.defaultDir = "../lib/";
- IriSP.widgetsDir = "./player/metadataplayer/"
-
- var videoToPlay = this.videos[this.centerId];
- var currentMetadata = this.urls[this.centerId];
- console.log('VIDEO[' + this.centerId + '] : ' + videoToPlay);
- console.log('MD[' + this.centerId + '] : ' + currentMetadata);
-
- console.log(newZoomTop + " " + newZoomLeft);
-
- var _metadata = {
- url: currentMetadata,
- format: 'ldt'
- };
- var _config = {
- gui: {
- width: newSnWidth,
- height: newSnHeight,
- container: 'LdtPlayer',
- default_options: {
- metadata: _metadata
- },
- css:'./player/metadataplayer/LdtPlayer-core.css',
- widgets: [
- {
- type: "Timeline"
- }
- ]
- },
- player:{
- type: 'html5', // player type
- video: videoToPlay,
- live: true,
- height: newSnHeight,
- width: newSnWidth,
- autostart: true
- }
- };
-
- //On positionne le player.
- $('.LdtPlayer').css(
- {
- //display: 'none',
- position: 'absolute',
- 'background-color': '#000000',
- top: newZoomTop,
- left: newZoomLeft
- });
-
- //On démarre le player.
- this.player = null;
- this.player = new IriSP.Metadataplayer(_config, _metadata);
-}
-
-/*
- * Retour à la taille normale de la mosaïque.
- */
-mosaic.prototype.unzoom = function()
-{
- //Si on n'est pas en plein écran, on quitte.
- if(!this.fullscreen)
- {
- return;
- }
-
- //On charge les attributs nécessaires aux calculs.
- var sWidth = this.snapshotWidth, sHeight = this.snapshotHeight;
- var mpWidth = this.width, mpHeight = this.height;
- var mos = this;
-
- //On passe le snapshot sur lequel on a zoomé en SD.
- var zoomedImg = $('img', this.previousZoomedSN);
- var src = zoomedImg.attr('src');
- zoomedImg.attr('src', src.replace('snapshots/', 'snapshots-little/'));
-
- $('div').remove('.LdtPlayer');
- $('body').append('<div class="LdtPlayer" id="LdtPlayer"></div>');
-
- //On rend leur opacité aux snapshots. Qui ne sont alors plus grisés.
- $('.snapshotDivs').animate(
- {
- width: sWidth,
- height: sHeight,
- margin: this.marginWidth/2 + 'px',
- opacity: '1'
- }, this.unzoomTime);
- //On dézoom sur la mosaïque.
- $('#mainPanel').animate(
- {
- width: mpWidth,
- height: mpHeight,
- top: '0px',
- left: '0px'
- }, this.unzoomTime, function()
- {
- //On n'est plus en plein écran, et on ne peut plus se déplacer vers le prochain voisin.
- mos.fullscreen = false;
- mos.canMoveToNeighbour = false;
- //On revient en mode MOSAIC.
- mos.currentMode = 'MOSAIC';
- //On ne permet plus le déplacement vers les voisins.
- $('.snapshotDivs').unbind('mouseenter', mos.selectNeighbour);
- });
-}
-
-/*
- * Affecte les listeners mouseenter aux voisins lors d'une vue en plein écran.
- */
-mosaic.prototype.listenToNeighbours = function()
-{
- ////TEST
- //$('.test').empty();
- this.canMoveToNeighbour = false;
- var currentLine = Math.floor(this.centerId / this.length), currentColumn = this.centerId % this.length;
- var zoomedImg = $('img', this.previousZoomedSN);
- var mos = this;
-
- //On cherche l'ID des voisins.
- //Si le voisin de gauche est sur la même ligne, on n'est pas sur la bordure de gauche.
- this.neighboursIds[0] = (currentColumn > 0) ? (this.centerId - 1) : -1;
- //Si le voisin de droite est sur la même ligne, on n'est pas sur la bordure de droite.
- this.neighboursIds[1] = (currentColumn < this.length) ? (+this.centerId + 1) : -1;
- //Si le voisin du haut est sur la même colonne, on n'est pas sur la bordure du haut.
- this.neighboursIds[2] = (currentLine > 0) ? (this.centerId - this.length) : -1;
- //Si le voisin du bas est sur la même colonne, on n'est pas sur la bordure du bas.
- this.neighboursIds[3] = (currentLine < (this.imagesToShow / this.length)) ? (+this.centerId + this.length) : -1;
-
- //ID du cadre voisin.
- var preId;
-
- for(var i = 0 ; i < this.neighboursIds.length ; i++)
- {
- if(this.neighboursIds[i] != -1)
- {
- preId = '#neighbourFrameBorder-' + this.neighboursIds[i];
- //On permet le déplacement vers les voisins.
- // $('#snapshotDiv-' + this.neighboursIds[i] + ', ' + preId + '-left,' + preId + '-right,' + preId + '-up,' + preId + '-down').mouseenter(mos.selectNeighbour);
- $('#snapshotDiv-' + this.neighboursIds[i]).mouseenter(mos.selectNeighbour);
- }
- }
-}
-
-/*
- * Change la coloration d'une bordure où on se positionne lors d'une vue en plein écran.
- */
-mosaic.prototype.selectNeighbour = function()
-{
- ////TEST
- //$('.test').append(mos.currentMode + " " + $(this).attr('id') + " " + 'snapshotDiv-' + mos.centerId + ',');
-
- //Si on est en mode VIDEO (plein écran) ET si le snapshot pointé est un voisin.
- if((mos.currentMode == 'VIDEO') && ($(this).attr('id') != 'snapshotDiv-' + mos.centerId))
- {
- //On crée le cadre qui va être superposé au voisin.
- //On le colle au voisin.
- var tab = $(this).attr('id').split('-');
- var snapshotId = tab[1];
- var neighbourFrame = '';
- var marginValue = parseFloat($(this).css('margin'));
-
- neighbourFrame += '<div class="neighbourFrame" id="neighbourFrame-' + snapshotId + '"><div class="neighbourImgBg" id="neighbourImgBg-' + snapshotId + '"><div class="neighbourImg" id="neighbourImg-' + snapshotId + '"></div></div></div>';
-
- $('#mainPanel').append(neighbourFrame);
-
- //On positionne le div de background juste au niveau du voisin.
- $('#neighbourFrame-' + snapshotId).css(
- {
- 'top': (+$(this).position().top + marginValue),
- 'left': (+$(this).position().left + marginValue),
- 'width': $(this).width(),
- 'height': $(this).height()
- });
- //On positionne le div de background noir juste au niveau de l'image du voisin.
- $('#neighbourImgBg-' + snapshotId).css(
- {
- 'top': marginValue,
- 'left': marginValue,
- 'width': $(this).width() - marginValue*2,
- 'height': $(this).height() - marginValue*2,
- });
- //On met par dessus le div de l'image clonée du voisin.
- $('#neighbourImg-' + snapshotId).css(
- {
- 'top': 0,
- 'left': 0,
- 'width': $(this).width() - marginValue*2,
- 'height': $(this).height() - marginValue*2,
- 'background-image': 'url("' + $('img', $(this)).attr('src') + '")',
- 'background-size': $(this).width() + 'px ' + $(this).height() + 'px',
- 'background-position': -marginValue + 'px ' + -marginValue + 'px',
- 'opacity': '0.4'
- });
-
- var fId = '#neighbourFrame-' + snapshotId;
-
- $(fId).animate(
- {
- //On le fait apparaître.
- opacity: '1'
- }, timeNeighbourGlowing, function()
- {
- //On peut désormais se déplacer vers ce voisin.
- mos.canMoveToNeighbour = true;
- });
- //Lorsqu'on quitte un des snapshots (bien entendu le voisin en question), on retire le cadre.
- $(fId).mouseleave(mos.deselectNeighbour)
- //Si on clique sur le voisin ou son cadre, on passe au voisin suivant.
- $(fId).click(mos.moveToNeighbour);
- }
-}
-
-/*
- * Change la coloration d'une bordure quittée lors d'une vue en plein écran.
- */
-mosaic.prototype.deselectNeighbour = function()
-{
- ////TEST
- //$('.test').append('un,');
-
- //On ne peut plus se déplacer vers les voisins.
- mos.canMoveToNeighbour = false;
-
- //On récupère le voisin.
- var neighbourFrame = $(this);
-
- //Si on est en mode VIDEO.
- if(mos.currentMode == 'VIDEO')
- {
- //On le fait disparaître progressivement.
- neighbourFrame.animate(
- {
- opacity: '0'
- }, timeNeighbourUnglowing, function()
- {
- //Une fois invisible, on le supprime.
- neighbourFrame.remove();
- });
- }
-}
-
-/*
- * Lors d'une vue en plein écran, on se déplace vers le voisin dont l'id a été spécifié dans la fonction appelante.
- */
-mosaic.prototype.moveToNeighbour = function()
-{
- //Si on ne peut pas se déplacer vers les voisins, on quitte.
- if(!mos.canMoveToNeighbour)
- {
- return;
- }
-
- //On obtient l'ID de destination.
- var tab = $(this).attr('id').split('-');
- var destinationId = tab[1];
-
- //On charge les attributs nécessaires aux calculs.
- var MPCurrentTop = $('#mainPanel').position().top, MPCurrentLeft = $('#mainPanel').position().left;
- var divideCoeffTop = Math.floor(destinationId / mos.length) == 0 ? 1 : Math.floor(destinationId / mos.length);
- var divideCoeffLeft = destinationId % mos.length == 0 ? 1 : destinationId % mos.length;
- var neighbourFrameTop = $('#snapshotDiv-' + destinationId).position().top, neighbourFrameLeft = $('#snapshotDiv-' + destinationId).position().left;
-
- //On définit pour le déplacement vertical s'il est nécessaire de se déplacer en haut ou en bas.
- if(mos.previousZoomedSN.position().top > neighbourFrameTop)
- MPCurrentTop += Math.abs(neighbourFrameTop - mos.previousZoomedSN.position().top);
- else if(mos.previousZoomedSN.position().top < neighbourFrameTop)
- MPCurrentTop -= Math.abs(neighbourFrameTop - mos.previousZoomedSN.position().top);
- //On définit pour le déplacement horizontal s'il est nécessaire de se déplacer à gauche ou à droite.
- if(mos.previousZoomedSN.position().left > neighbourFrameLeft)
- MPCurrentLeft += Math.abs(neighbourFrameLeft - mos.previousZoomedSN.position().left);
- else if(mos.previousZoomedSN.position().left < neighbourFrameLeft)
- MPCurrentLeft -= Math.abs(neighbourFrameLeft - mos.previousZoomedSN.position().left);
-
- //On passe le snapshot de destination en HD.
- var destinationImg = $('#snapshot-' + destinationId);
- var destinationImgSrc = destinationImg.attr('src');
- destinationImg.attr('src', destinationImgSrc.replace('snapshots-little/', 'snapshots/'));
-
- //On passe l'ancien snapshot en SD.
- var currentImgSrc = $('img', mos.previousZoomedSN).attr('src');
- $('img', mos.previousZoomedSN).attr('src', currentImgSrc.replace('snapshots/', 'snapshots-little/'));
-
- //On obtient l'ID du div de coloration du snapshot vers lequel on se déplace afin de le supprimer.
- var neighbourFrame = $(this);
- var tab = neighbourFrame.attr('id').split('-');
- mos.centerId = tab[1];
- $(this).css('opacity', '0');
- neighbourFrame.remove();
-
- $('div').remove('.LdtPlayer');
- $('body').append('<div class="LdtPlayer" id="LdtPlayer"></div>');
-
- //On grise le snapshot qu'on vient de quitter.
- mos.previousZoomedSN.animate(
- {
- opacity: '0.4'
- });
-
- //On se déplace.
- $('#mainPanel').animate(
- {
- top: MPCurrentTop,
- left: MPCurrentLeft
- }, timeMovingToNeighbour, function()
- {
- //On fait apparaître le snapshot vers lequel on s'est déplacé.
- $('#snapshotDiv-' + destinationId).animate(
- {
- opacity: '1'
- }, mos.zoomTime, function()
- {
- //On recharge les voisins.
- $('.snapshotDivs').unbind('mouseenter', mos.selectNeighbour);
- mos.previousZoomedSN = $('#snapshotDiv-' + mos.centerId);
- mos.listenToNeighbours();
-
- mos.loadPlayer((destinationImg.position().top + MPCurrentTop + mos.MPTop_margin), (destinationImg.position().left + MPCurrentLeft), destinationImg.width(), destinationImg.height());
- });
- });
-}
-
-/*
- * Déchargement du contenu de la mosaïque pour le chargement de la mosaïque locale.
- */
-mosaic.prototype.unload = function()
-{
- //On supprime les event listeners des objets de la mosaïque.
- $('.snapshotDivs').unbind();
- $('.snapshots').unbind();
- $('.prezoomContainers').unbind();
- //On supprime physiquement les objets.
- $('#mainPanel').empty();
-}
-
-/*
- * Centre verticalement un snapshot.
- */
-/*function verticalCenterImg(mosaic, img)
-{
- //On récupère sa hauteur.
- var image_height = img.height();
- //Calcule la marge du haut de chaque div pour le centrage.
- if(mosaic.top_margin == undefined)
- mosaic.top_margin = (mosaic.snapshotHeight > image_height) ? (mosaic.snapshotHeight - image_height)/2 : (image_height - mosaic.snapshotHeight)/2;
- //On centre le snapshot.
- img.css('margin-top', mosaic.top_margin).css('margin-bottom', mosaic.top_margin);
-}*/
-
-/*
- * Permet de tester l'égalité des éléments de deux objets.
- * Pour ce faire on compare les éléments définissant ces objets.
- */
-$.fn.equals = function(compareTo)
-{
- if (!compareTo || !compareTo.length || this.length!=compareTo.length)
- {
- return false;
- }
- for (var i=0; i<this .length; i++)
- {
- if (this[i]!==compareTo[i])
- {
- return false;
- }
- }
- return true;
-}
-
-/*
- * Charge les vidéos, les snapshots et les annotations depuis un fichier json.
-*/
-mosaic.prototype.loadFromJson = function(path)
-{
- var _this = this;
-
- $.getJSON(path, function(data)
- {
- $.each(data, function(key, val)
- {
- // console.log(val);
- $.each(val, function(key_video, val_video)
- {
- $.getJSON(val_video.metadata, function(meta)
- {
- _this.affectVideoById(val_video.metadata, meta.medias[0].url.replace('rtmp://', 'http://').replace('/ddc_player/', '/'));
- //console.log(meta.medias[0].url.replace('rtmp://', 'http://').replace('/ddc_player/', '/'));
- });
-
- _this.imgs.push(val_video.snapshot);
- _this.urls.push(val_video.metadata);
- });
- });
- console.log('rdy');
- _this.loadMosaic();
- });
-}
-
-/*
- * Affecte une vidéo au tableau des vidéos selon son id
-*/
-mosaic.prototype.affectVideoById = function(metadata_id, video)
-{
- for (i = 0 ; i < this.urls.length ; i++)
- {
- if(this.urls[i] == metadata_id)
- {
- this.videos[i] = video;
- break;
- }
- }
-}
\ No newline at end of file
Binary file front_idill/src/pictos/big/hover/arc.png has changed
Binary file front_idill/src/pictos/big/hover/bend.png has changed
Binary file front_idill/src/pictos/big/hover/circle.png has changed
Binary file front_idill/src/pictos/big/hover/contact.png has changed
Binary file front_idill/src/pictos/big/hover/fall.png has changed
Binary file front_idill/src/pictos/big/hover/grand_jete.png has changed
Binary file front_idill/src/pictos/big/hover/hello.png has changed
Binary file front_idill/src/pictos/big/hover/jump.png has changed
Binary file front_idill/src/pictos/big/hover/knee_up.png has changed
Binary file front_idill/src/pictos/big/hover/no_motion.png has changed
Binary file front_idill/src/pictos/big/hover/right_angle.png has changed
Binary file front_idill/src/pictos/big/hover/run.png has changed
Binary file front_idill/src/pictos/big/hover/rythme.png has changed
Binary file front_idill/src/pictos/big/hover/screw.png has changed
Binary file front_idill/src/pictos/big/hover/slow.png has changed
Binary file front_idill/src/pictos/big/hover/up_down.png has changed
Binary file front_idill/src/pictos/big/hover/wave.png has changed
Binary file front_idill/src/pictos/big/hover/wheel.png has changed
Binary file front_idill/src/pictos/big/normal/arc.png has changed
Binary file front_idill/src/pictos/big/normal/bend.png has changed
Binary file front_idill/src/pictos/big/normal/circle.png has changed
Binary file front_idill/src/pictos/big/normal/contact.png has changed
Binary file front_idill/src/pictos/big/normal/fall.png has changed
Binary file front_idill/src/pictos/big/normal/grand_jete.png has changed
Binary file front_idill/src/pictos/big/normal/hello.png has changed
Binary file front_idill/src/pictos/big/normal/inconnu.png has changed
Binary file front_idill/src/pictos/big/normal/jump.png has changed
Binary file front_idill/src/pictos/big/normal/knee_up.png has changed
Binary file front_idill/src/pictos/big/normal/no_motion.png has changed
Binary file front_idill/src/pictos/big/normal/right_angle.png has changed
Binary file front_idill/src/pictos/big/normal/run.png has changed
Binary file front_idill/src/pictos/big/normal/rythme.png has changed
Binary file front_idill/src/pictos/big/normal/screw.png has changed
Binary file front_idill/src/pictos/big/normal/slow.png has changed
Binary file front_idill/src/pictos/big/normal/up_down.png has changed
Binary file front_idill/src/pictos/big/normal/wave.png has changed
Binary file front_idill/src/pictos/big/normal/wheel.png has changed
Binary file front_idill/src/pictos/big/valid/arc.png has changed
Binary file front_idill/src/pictos/big/valid/bend.png has changed
Binary file front_idill/src/pictos/big/valid/circle.png has changed
Binary file front_idill/src/pictos/big/valid/contact.png has changed
Binary file front_idill/src/pictos/big/valid/fall.png has changed
Binary file front_idill/src/pictos/big/valid/grand_jete.png has changed
Binary file front_idill/src/pictos/big/valid/hello.png has changed
Binary file front_idill/src/pictos/big/valid/jump.png has changed
Binary file front_idill/src/pictos/big/valid/knee_up.png has changed
Binary file front_idill/src/pictos/big/valid/no_motion.png has changed
Binary file front_idill/src/pictos/big/valid/right_angle.png has changed
Binary file front_idill/src/pictos/big/valid/run.png has changed
Binary file front_idill/src/pictos/big/valid/rythme.png has changed
Binary file front_idill/src/pictos/big/valid/screw.png has changed
Binary file front_idill/src/pictos/big/valid/slow.png has changed
Binary file front_idill/src/pictos/big/valid/up_down.png has changed
Binary file front_idill/src/pictos/big/valid/wave.png has changed
Binary file front_idill/src/pictos/big/valid/wheel.png has changed
Binary file front_idill/src/pictos/help/arc.png has changed
Binary file front_idill/src/pictos/help/bend.png has changed
Binary file front_idill/src/pictos/help/circle.png has changed
Binary file front_idill/src/pictos/help/contact.png has changed
Binary file front_idill/src/pictos/help/controles.png has changed
Binary file front_idill/src/pictos/help/fall.png has changed
Binary file front_idill/src/pictos/help/grand_jete.png has changed
Binary file front_idill/src/pictos/help/hello.png has changed
Binary file front_idill/src/pictos/help/img bak/arc.png has changed
Binary file front_idill/src/pictos/help/img bak/bend.png has changed
Binary file front_idill/src/pictos/help/img bak/circle.png has changed
Binary file front_idill/src/pictos/help/img bak/contact.png has changed
Binary file front_idill/src/pictos/help/img bak/controles big.png has changed
Binary file front_idill/src/pictos/help/img bak/fall.png has changed
Binary file front_idill/src/pictos/help/img bak/grand_jete.png has changed
Binary file front_idill/src/pictos/help/img bak/hello.png has changed
Binary file front_idill/src/pictos/help/img bak/jump.png has changed
Binary file front_idill/src/pictos/help/img bak/knee_up.png has changed
Binary file front_idill/src/pictos/help/img bak/no_motion.png has changed
Binary file front_idill/src/pictos/help/img bak/recherche big.png has changed
Binary file front_idill/src/pictos/help/img bak/right_angle.png has changed
Binary file front_idill/src/pictos/help/img bak/rythme.png has changed
Binary file front_idill/src/pictos/help/img bak/screw.png has changed
Binary file front_idill/src/pictos/help/img bak/selection.png has changed
Binary file front_idill/src/pictos/help/img bak/slow.png has changed
Binary file front_idill/src/pictos/help/img bak/up_down.png has changed
Binary file front_idill/src/pictos/help/img bak/wave.png has changed
Binary file front_idill/src/pictos/help/img bak/wheel.png has changed
Binary file front_idill/src/pictos/help/jump.png has changed
Binary file front_idill/src/pictos/help/knee_up.png has changed
Binary file front_idill/src/pictos/help/no_motion.png has changed
Binary file front_idill/src/pictos/help/recherche.png has changed
Binary file front_idill/src/pictos/help/right_angle.png has changed
Binary file front_idill/src/pictos/help/rythme.png has changed
Binary file front_idill/src/pictos/help/screw.png has changed
Binary file front_idill/src/pictos/help/selection.png has changed
Binary file front_idill/src/pictos/help/slow.png has changed
Binary file front_idill/src/pictos/help/up_down.png has changed
Binary file front_idill/src/pictos/help/wave.png has changed
Binary file front_idill/src/pictos/help/wheel.png has changed
Binary file front_idill/src/pictos/notifications/changer_video1.png has changed
Binary file front_idill/src/pictos/notifications/changer_video2.png has changed
Binary file front_idill/src/pictos/notifications/changer_video3.png has changed
Binary file front_idill/src/pictos/notifications/changer_video4.png has changed
Binary file front_idill/src/pictos/notifications/confirmer.png has changed
Binary file front_idill/src/pictos/notifications/inconnu.png has changed
Binary file front_idill/src/pictos/notifications/mosaique1.png has changed
Binary file front_idill/src/pictos/notifications/mosaique2.png has changed
Binary file front_idill/src/pictos/notifications/rechercher.png has changed
Binary file front_idill/src/pictos/notifications/selectionner.png has changed
Binary file front_idill/src/pictos/notifications/suivant1.png has changed
Binary file front_idill/src/pictos/notifications/suivant2.png has changed
Binary file front_idill/src/pictos/small/arc.png has changed
Binary file front_idill/src/pictos/small/arret.png has changed
Binary file front_idill/src/pictos/small/bend.png has changed
Binary file front_idill/src/pictos/small/circle.png has changed
Binary file front_idill/src/pictos/small/contact.png has changed
Binary file front_idill/src/pictos/small/fall.png has changed
Binary file front_idill/src/pictos/small/grand_jete.png has changed
Binary file front_idill/src/pictos/small/jump.png has changed
Binary file front_idill/src/pictos/small/knee-up.png has changed
Binary file front_idill/src/pictos/small/right-angle.png has changed
Binary file front_idill/src/pictos/small/run.png has changed
Binary file front_idill/src/pictos/small/rythme.png has changed
Binary file front_idill/src/pictos/small/screw.png has changed
Binary file front_idill/src/pictos/small/slow.png has changed
Binary file front_idill/src/pictos/small/updown.png has changed
Binary file front_idill/src/pictos/small/vague.png has changed
Binary file front_idill/src/pictos/small/volant.png has changed
Binary file front_idill/src/pictos/small/wave.png has changed
--- a/front_idill/src/player/json/videos.json Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/player/json/videos.json Thu May 24 10:30:05 2012 +0200
@@ -1,11 +1,15 @@
{
"videos" : [
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/23256da6-66b9-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "mue.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/ba4d888c-66b7-11e1-91ba-00145ea4a2be?callback=?",
+ "snapshot": "50 shots.png",
"gestures": [
{
- "gesture_name": "",
+ "gesture_name": "bend",
+ "snapshot": ""
+ },
+ {
+ "gesture_name": "circle",
"snapshot": ""
}
]
@@ -27,7 +31,7 @@
"snapshot": ""
},
{
- "gesture_name": "updown",
+ "gesture_name": "bend",
"snapshot": ""
},
{
@@ -37,11 +41,37 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/b411a6dc-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "-s-pression.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f80bd9fe-66b6-11e1-91ba-00145ea4a2be?callback=?",
+ "snapshot": "encontro cotidianos.png",
"gestures": [
{
- "gesture_name": "",
+ "gesture_name": "contact",
+ "snapshot": ""
+ },
+ {
+ "gesture_name": "circle",
+ "snapshot": ""
+ },
+ {
+ "gesture_name": "screw",
+ "snapshot": ""
+ },
+ {
+ "gesture_name": "run",
+ "snapshot": ""
+ }
+ ]
+ },
+ {
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f1cee904-66b7-11e1-80f6-00145ea4a2be?callback=?",
+ "snapshot": "fenella.png",
+ "gestures": [
+ {
+ "gesture_name": "knee-up",
+ "snapshot": ""
+ },
+ {
+ "gesture_name": "circle",
"snapshot": ""
}
]
@@ -57,22 +87,18 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/9e92ebdc-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "hannah.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/d610e47e-66b7-11e1-80f6-00145ea4a2be?callback=?",
+ "snapshot": "instrument.png",
"gestures": [
{
- "gesture_name": "wave",
- "snapshot": ""
- },
- {
- "gesture_name": "run",
+ "gesture_name": "",
"snapshot": ""
}
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/82cd7e30-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "vrtti.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/e2b5b9e8-562c-11e1-b3c3-00145ea49a02?callback=?",
+ "snapshot": "joudance 2 in asakusa_stage1.png",
"gestures": [
{
"gesture_name": "",
@@ -81,8 +107,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/0d8f65f6-66b8-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "palms.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/23256da6-66b9-11e1-80f6-00145ea4a2be?callback=?",
+ "snapshot": "mue.png",
"gestures": [
{
"gesture_name": "",
@@ -91,8 +117,18 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f1cee904-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "fenella.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/c66bfa64-66b6-11e1-91ba-00145ea4a2be?callback=?",
+ "snapshot": "new under the sun.png",
+ "gestures": [
+ {
+ "gesture_name": "",
+ "snapshot": ""
+ }
+ ]
+ },
+ {
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/cfd63004-66b8-11e1-80f6-00145ea4a2be?callback=?",
+ "snapshot": "nid de lune.png",
"gestures": [
{
"gesture_name": "",
@@ -119,6 +155,16 @@
]
},
{
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/294f727c-66b8-11e1-91ba-00145ea4a2be?callback=?",
+ "snapshot": "sliced.png",
+ "gestures": [
+ {
+ "gesture_name": "",
+ "snapshot": ""
+ }
+ ]
+ },
+ {
"metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/3f1f08e6-66b9-11e1-80f6-00145ea4a2be?callback=?",
"snapshot": "stronger.png",
"gestures": [
@@ -141,96 +187,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/ba4d888c-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "50 shots.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/7c912bce-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "body trail cctv.png",
- "gestures": [
- {
- "gesture_name": "screw",
- "snapshot": ""
- },
- {
- "gesture_name": "contact",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f80bd9fe-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "encontro cotidianos.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/d610e47e-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "instrument.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/dc8c4d62-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "jeu de societe.png",
- "gestures": [
- {
- "gesture_name": "wave",
- "snapshot": ""
- },
- {
- "gesture_name": "run",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/e2b5b9e8-562c-11e1-b3c3-00145ea49a02?callback=?",
- "snapshot": "joudance 2 in asakusa_stage1.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/cfd63004-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "nid de lune.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/4b4aa85c-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "molecule no.1.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/eba1967a-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "mine.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/82cd7e30-66b7-11e1-80f6-00145ea4a2be?callback=?",
+ "snapshot": "vrtti.png",
"gestures": [
{
"gesture_name": "",
@@ -249,38 +207,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/c66bfa64-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "new under the sun.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/294f727c-66b8-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "sliced.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/670c5054-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "field n.8.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/23256da6-66b9-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "mue.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/15a75eea-8870-11e1-9bba-00145ea4a2be?callback=?",
+ "snapshot": "alger.png",
"gestures": [
{
"gesture_name": "",
@@ -289,34 +217,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/076230fe-66b9-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "deep end dance.png",
- "gestures": [
- {
- "gesture_name": "circle",
- "snapshot": ""
- },
- {
- "gesture_name": "jump",
- "snapshot": ""
- },
- {
- "gesture_name": "contact",
- "snapshot": ""
- },
- {
- "gesture_name": "updown",
- "snapshot": ""
- },
- {
- "gesture_name": "wave",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/b411a6dc-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "-s-pression.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/ffbe189a-886e-11e1-9ee2-00145ea4a2be?callback=?",
+ "snapshot": "animalz.png",
"gestures": [
{
"gesture_name": "",
@@ -325,52 +227,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/98517ca6-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "i am my mother.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/9e92ebdc-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "hannah.png",
- "gestures": [
- {
- "gesture_name": "wave",
- "snapshot": ""
- },
- {
- "gesture_name": "run",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/82cd7e30-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "vrtti.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/0d8f65f6-66b8-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "palms.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f1cee904-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "fenella.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/a52dc4c4-886f-11e1-9bba-00145ea4a2be?callback=?",
+ "snapshot": "exotica.png",
"gestures": [
{
"gesture_name": "",
@@ -379,48 +237,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/2f8b92b6-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "patria.png",
- "gestures": [
- {
- "gesture_name": "circle",
- "snapshot": ""
- },
- {
- "gesture_name": "updown",
- "snapshot": ""
- },
- {
- "gesture_name": "slow",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/3f1f08e6-66b9-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "stronger.png",
- "gestures": [
- {
- "gesture_name": "jump",
- "snapshot": ""
- },
- {
- "gesture_name": "circle",
- "snapshot": ""
- },
- {
- "gesture_name": "contact",
- "snapshot": ""
- },
- {
- "gesture_name": "beat",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/ba4d888c-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "50 shots.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/8a29e4f0-886f-11e1-9ee2-00145ea4a2be?callback=?",
+ "snapshot": "respire.png",
"gestures": [
{
"gesture_name": "",
@@ -429,32 +247,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/7c912bce-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "body trail cctv.png",
- "gestures": [
- {
- "gesture_name": "screw",
- "snapshot": ""
- },
- {
- "gesture_name": "contact",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f80bd9fe-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "encontro cotidianos.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/d610e47e-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "instrument.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/2377411e-9f74-11e1-9f9f-00145ea4a2be?callback=?",
+ "snapshot": "flying lesson.png",
"gestures": [
{
"gesture_name": "",
@@ -463,32 +257,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/dc8c4d62-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "jeu de societe.png",
- "gestures": [
- {
- "gesture_name": "wave",
- "snapshot": ""
- },
- {
- "gesture_name": "run",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/e2b5b9e8-562c-11e1-b3c3-00145ea49a02?callback=?",
- "snapshot": "joudance 2 in asakusa_stage1.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/cfd63004-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "nid de lune.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/e3d42dc4-9f73-11e1-9f9f-00145ea4a2be?callback=?",
+ "snapshot": "aside.png",
"gestures": [
{
"gesture_name": "",
@@ -497,18 +267,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/4b4aa85c-66b7-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "molecule no.1.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/eba1967a-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "mine.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/a98a7bc4-8870-11e1-9ee2-00145ea4a2be?callback=?",
+ "snapshot": "the rat.png",
"gestures": [
{
"gesture_name": "",
@@ -517,38 +277,8 @@
]
},
{
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/60d03074-66b8-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "you are you.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/c66bfa64-66b6-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "new under the sun.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/294f727c-66b8-11e1-91ba-00145ea4a2be?callback=?",
- "snapshot": "sliced.png",
- "gestures": [
- {
- "gesture_name": "",
- "snapshot": ""
- }
- ]
- },
- {
- "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/670c5054-66b7-11e1-80f6-00145ea4a2be?callback=?",
- "snapshot": "field n.8.png",
+ "metadata": "http://ldt.iri.centrepompidou.fr//ldtplatform/ldt/cljson/id/f47e1578-8870-11e1-9ee2-00145ea4a2be?callback=?",
+ "snapshot": "tank man tango a tianmen memorial.png",
"gestures": [
{
"gesture_name": "",
--- a/front_idill/src/player/metadataplayer/Timeline.css Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/player/metadataplayer/Timeline.css Thu May 24 10:30:05 2012 +0200
@@ -97,8 +97,8 @@
}
#MB_Pic, .search_MBPic {
- width: 24px;
- height: 30px;
+ width: 38px;
+ height: 45px;
background-position: 0px 0px;
background-repeat: no-repeat;
}
\ No newline at end of file
--- a/front_idill/src/player/metadataplayer/Timeline.js Mon May 14 17:20:35 2012 +0200
+++ b/front_idill/src/player/metadataplayer/Timeline.js Thu May 24 10:30:05 2012 +0200
@@ -19,9 +19,10 @@
this.paused = false
this.top_epsilon = 0;
this.imgDir = "player/img/";
- this.markersDir = "player/markers/";
+ this.markersDir = "pictos/small/";
+ this.player = player;
- this.gestures = ["swipe-down", "jump", "circle", "screw", "bend", "join-hands", "arc", "pendulum", "knee-up", "right-angle", "wave", "slow", "hello", "beat", "cross", "wheel", "contact", "run"];
+ this.gestures = ["fall", "jump", "circle", "screw", "bend", "arc", "pendulum", "knee-up", "right-angle", "wave", "slow", "hello", "no-motion", "wheel", "contact", "run"];
this.annotations = this.annotationsFilter(this.source.getAnnotations(), this.gestures, this.isGesture);
@@ -199,6 +200,8 @@
var key = this.whichKey(e.which);
var time = 0;
+ console.log($(this));
+
if(key > -1 && key < 11)
{
time = this.source.getDuration().getSeconds()/10*key;
@@ -236,18 +239,34 @@
if(key == 13)
{
- this.currentMode = "SEARCH";
- this.hideMarkersSearch("screw");
- /*this.currentMode = "SEARCH";
- this.showMarkersSearchByType("screw");*/
- }
-
- if(key == 14)
- {
- this.currentMode = "SEARCH";
- this.hideMarkersSearch("contact");
- /*this.currentMode = "SEARCH";
- this.showMarkersSearchByType("contact");*/
+ var gesturesStr = '';
+ for(var i = 0 ; i < this.gestures.length ; i++)
+ {
+ gesturesStr += this.gestures[i] + ", ";
+ }
+ gesturesStr = gesturesStr.substr(0, gesturesStr.length - 2);
+
+ /*if(IriSP.jQuery('#notify_search_1gesture').length > 0)
+ {
+ this.removeSearch1Gesture();
+ }*/
+
+ var typeName = prompt("Please enter a type name among (" + gesturesStr + ").", "");
+
+ this.notifySearch1Gesture(typeName, "valid");
+
+ if(typeName != '' || typeName != undefined)
+ {
+ if(_.include(this.gestures, typeName))
+ {
+ this.currentMode = "SEARCH";
+ this.hideMarkersSearch(typeName);
+ }
+ else
+ {
+ alert("Unknown gesture type. Operation aborted.");
+ }
+ }
}
if(key == 21)
@@ -284,8 +303,8 @@
return 11;
}
- //q ou Q pour quitter une recherche.
- if(code == 113 || code == 81)
+ //m ou M pour quitter une recherche.
+ if(code == 109 || code == 77)
{
return 12;
}
@@ -296,16 +315,11 @@
return 21;
}
- //a ou A pour une recherche de type screw.
- if(code == 97 || code == 65)
+ //n ou N pour une recherche par type.
+ if(code == 110 || code == 78)
{
return 13;
}
- //z ou Z pour une recherche de type contact.
- if(code == 122 || code == 90)
- {
- return 14;
- }
switch(code)
{
@@ -651,8 +665,6 @@
return;
}
- console.log('in');
-
var _this = this;
//On récupère les annotations.
@@ -727,6 +739,7 @@
IriSP.jQuery(".search_Marker").fadeOut(this.markerShowTime, function()
{
IriSP.jQuery("div").remove(".search_Marker");
+ _this.removeSearch1Gesture();
if(type == undefined)
{
@@ -736,13 +749,101 @@
{
// console.log(_this.currentMode);
_this.showMarkersSearchByType(type);
+ _this.notifySearch1Gesture(type, "valid");
return;
}
});
if(IriSP.jQuery(".search_Marker").length == 0 && type != undefined)
{
+ if(type == undefined || !_.include(this.gestures, type))
+ {
+ this.notifySearch1Gesture(type, "none");
+ }
// console.log(this.currentMode);
this.showMarkersSearchByType(type);
}
+}
+
+IriSP.Widgets.Timeline.prototype.freePlayer = function()
+{
+ IriSP.jQuery('body').unbind();
+ IriSP.jQuery('.notifications').remove();
+}
+
+/*
+ * Affiche la notification de validation/survol de gesture de recherche.
+ * Mode prend pour valeurs : "valid" ou "hover".
+*/
+IriSP.Widgets.Timeline.prototype.notifySearch1Gesture = function(gestureName, mode)
+{
+ console.log('C');
+ if(IriSP.jQuery('#notify_search_1gesture').length > 0)
+ {
+ return;
+ }
+
+ var _this = this;
+
+ //On spécifie les notifications en div.
+ var notification_search_1gesture = "<div id='notify_search_1gesture' class='notifications'></div>";
+
+ //On les ajoute à la mosaïque.
+ $('#mainPanel').append(notification_search_1gesture);
+
+ console.log(this.player.config.gui.zoomTop + " " + this.player.config.gui.zoomLeft);
+
+ //On calcule leurs coordonnées et dimensions.
+ var notify_width = $('.notifications').width(), notify_height = $('.notifications').height();
+ var notify_margin = parseInt($('.notifications').css('margin'));
+ var point_left = $(window).width() / 2 - (notify_width) / 2 - notify_margin;
+
+ if(_.include(this.gestures, gestureName))
+ {
+ IriSP.jQuery('#notify_search_1gesture').css('background-image', 'url("./pictos/big/' + mode + '/' + gestureName.replace('-', '_') + '.png")');
+ }
+ else if(mode == 'none')
+ {
+ IriSP.jQuery('#notify_search_1gesture').css('background-image', 'url("./pictos/big/normal/inconnu.png")');
+ }
+
+ if(mode != 'none')
+ {
+ IriSP.jQuery('#notify_search_1gesture').mouseover(function()
+ {
+ IriSP.jQuery(this).css('background-image', 'url("./pictos/big/hover/' + gestureName + '.png")');
+ }).mouseout(function()
+ {
+ IriSP.jQuery(this).css('background-image', 'url("./pictos/big/valid/' + gestureName + '.png")');
+ }).click(function()
+ {
+ _this.removeSearch1Gesture();
+ _this.hideMarkersSearch();
+ });
+ }
+
+ var notifyTop = this.player.config.gui.zoomTop, notifyLeft = this.player.config.gui.zoomLeft;
+
+ //On les positionne.
+ $('#notify_search_1gesture').css(
+ {
+ top: -notifyTop,
+ left: -notifyLeft + (IriSP.jQuery(window).width() - notify_width) / 2
+ });
+
+ //On les fait apparaître.
+ $('.notifications').css(
+ {
+ opacity: "0.9"
+ });
+}
+
+/*
+ * Supprime la notification de recherche de gesture.
+*/
+IriSP.Widgets.Timeline.prototype.removeSearch1Gesture = function()
+{
+ console.log('R');
+ console.trace();
+ IriSP.jQuery('#notify_search_1gesture').remove();
}
\ No newline at end of file
