|
@@ -15,6 +15,7 @@ function map() {
|
|
|
options: {
|
|
|
iconSize: [15, 49],
|
|
|
iconAnchor: [7.5, 5],
|
|
|
+ alt: 'cc',
|
|
|
}
|
|
|
});
|
|
|
|
|
@@ -23,16 +24,11 @@ function map() {
|
|
|
|
|
|
for (var i = 0; i < dyn_data.mappoints.length; i++) {
|
|
|
var id = dyn_data.mappoints[i].id;
|
|
|
+
|
|
|
markers[id] = L.marker([dyn_data.mappoints[i].lat, dyn_data.mappoints[i].long], {icon: greenIcon}).bindPopup(dyn_data.mappoints[i].title).addTo(mymap);
|
|
|
- // console.log("dyn_datad2", dyn_data.mappoints[i].title);
|
|
|
markers[id]._icon.id = id;
|
|
|
- }
|
|
|
|
|
|
- var mappoints = $('#streetmap img');
|
|
|
- for (var i = 0; i < dyn_data.mappoints.length; i++) {
|
|
|
- var target = dyn_data.mappoints[i].target;
|
|
|
- console.log('target',target);
|
|
|
- mappoints.attr('href', target );
|
|
|
+ var cible = dyn_data.mappoints[i].target;
|
|
|
}
|
|
|
};
|
|
|
|
|
@@ -263,7 +259,7 @@ function drag() {
|
|
|
// draggable
|
|
|
function dragcanvas() {
|
|
|
var $reseau = $('#reseaux-sociaux canvas');
|
|
|
- var $links = $('#links svg')
|
|
|
+ var $links = $('#links svg g')
|
|
|
|
|
|
$links.draggable({
|
|
|
scroll: false
|
|
@@ -424,7 +420,7 @@ function paperjs() {
|
|
|
path2.blendMode = 'multiply';
|
|
|
path2.closed = true;
|
|
|
path2.fullySelected = false;
|
|
|
- path._reseaux = "twitter";
|
|
|
+ path._reseaux = "instagram";
|
|
|
|
|
|
var path3 = new paper.Path({
|
|
|
fillColor: 'grey',
|
|
@@ -432,80 +428,162 @@ function paperjs() {
|
|
|
path3.blendMode = 'multiply';
|
|
|
path3.closed = true;
|
|
|
path3.fullySelected = false;
|
|
|
+ path._reseaux = "Whatsapp";
|
|
|
+
|
|
|
+ var path4 = new paper.Path({
|
|
|
+ fillColor: 'grey',
|
|
|
+ });
|
|
|
+ path4.blendMode = 'multiply';
|
|
|
+ path4.closed = true;
|
|
|
+ path4.fullySelected = false;
|
|
|
+ path._reseaux = "framasoft";
|
|
|
+
|
|
|
+ var path5 = new paper.Path({
|
|
|
+ fillColor: 'grey',
|
|
|
+ });
|
|
|
+ path5.blendMode = 'multiply';
|
|
|
+ path5.closed = true;
|
|
|
+ path5.fullySelected = false;
|
|
|
+ path._reseaux = "skype";
|
|
|
+
|
|
|
+ var path6 = new paper.Path({
|
|
|
+ fillColor: 'grey',
|
|
|
+ });
|
|
|
+ path6.blendMode = 'multiply';
|
|
|
+ path6.closed = true;
|
|
|
+ path6.fullySelected = false;
|
|
|
path._reseaux = "email";
|
|
|
|
|
|
- for (var i = 0; i <= amount.length; i++) {
|
|
|
- var maxPoint = new paper.Point(100, 100);
|
|
|
- var point = maxPoint;
|
|
|
- path.add(point);
|
|
|
- }
|
|
|
+ var path7 = new paper.Path({
|
|
|
+ fillColor: 'grey',
|
|
|
+ });
|
|
|
+ path7.blendMode = 'multiply';
|
|
|
+ path7.closed = true;
|
|
|
+ path7.fullySelected = false;
|
|
|
+ path._reseaux = "siteweb";
|
|
|
|
|
|
- for (var i = 0; i <= amount.length; i++) {
|
|
|
- var maxPoint = new paper.Point(100, 100);
|
|
|
- var point = maxPoint;
|
|
|
- path2.add(point);
|
|
|
- }
|
|
|
+ var path8 = new paper.Path({
|
|
|
+ fillColor: 'grey',
|
|
|
+ });
|
|
|
+ path8.blendMode = 'multiply';
|
|
|
+ path8.closed = true;
|
|
|
+ path8.fullySelected = false;
|
|
|
+ path._reseaux = "outilsgoogle";
|
|
|
|
|
|
for (var i = 0; i <= amount.length; i++) {
|
|
|
var maxPoint = new paper.Point(100, 100);
|
|
|
var point = maxPoint;
|
|
|
+ path.add(point);
|
|
|
+ path2.add(point);
|
|
|
path3.add(point);
|
|
|
+ path4.add(point);
|
|
|
+ path5.add(point);
|
|
|
+ path6.add(point);
|
|
|
+ path7.add(point);
|
|
|
+ path8.add(point);
|
|
|
+ // path3.add(point);
|
|
|
}
|
|
|
-
|
|
|
// dimension blob
|
|
|
// position blog
|
|
|
+ // for (var i = 0; i < amount.length; i++) {
|
|
|
+ // var RSin = Math.random();
|
|
|
+ // console.log('RSin',RSin);
|
|
|
+ // }
|
|
|
+
|
|
|
view.onFrame = function(event) {
|
|
|
|
|
|
for (var i = 0; i <= amount.length; i++) {
|
|
|
- var width = 350;
|
|
|
- var height = 200;
|
|
|
- movx = Math.cos(event.time * (0.02)) * 400;
|
|
|
- movy = Math.sin(event.time * (0.05)) * 200;
|
|
|
- var left = width + movx + 200;
|
|
|
- var top = height + movy;
|
|
|
+ // all
|
|
|
var segment = path.segments[i];
|
|
|
- var sinus = Math.sin(event.time * ( - 0.05) + i);
|
|
|
- var cos = Math.cos(event.time * ( - 0.05) + i);
|
|
|
- var rotatex = Math.sin(event.time * Math.PI/180) + i;
|
|
|
- segment.point.x = cos * width + left + 100;
|
|
|
- segment.point.y = sinus * height + top + 100;
|
|
|
- path.rotate(rotatex);
|
|
|
- path.smooth();
|
|
|
- }
|
|
|
-
|
|
|
- for (var i = 0; i <= amount.length; i++) {
|
|
|
- var width2 = 50;
|
|
|
- var height2 = 60;
|
|
|
- movx = Math.sin(event.time * (-0.025)) * 400;
|
|
|
- movy = Math.sin(event.time * (0.06)) * 300;
|
|
|
- var left = width2 - movx + 200;
|
|
|
- var top = height2 - movy;
|
|
|
var segment2 = path2.segments[i];
|
|
|
- var sinus = Math.sin(event.time * (0.5) + i);
|
|
|
- var cos = Math.cos(event.time * (0.5) + i);
|
|
|
- var rotatex2 = Math.sin(event.time * Math.PI/270) + i;
|
|
|
- segment2.point.x = cos * width2 + left + 400;
|
|
|
- segment2.point.y = sinus * height2 + top + 300;
|
|
|
- path2.rotate(rotatex2);
|
|
|
- path2.smooth();
|
|
|
- }
|
|
|
-
|
|
|
- for (var i = 0; i <= amount.length; i++) {
|
|
|
- var width3 = 150;
|
|
|
- var height3 = 60;
|
|
|
- movx = Math.sin(event.time * (0.025)) * 400;
|
|
|
- movy = Math.sin(event.time * (-0.1)) * 300;
|
|
|
- var left = width3 - movx + 100;
|
|
|
- var top = height3 - movy;
|
|
|
- var segment = path3.segments[i];
|
|
|
- var sinus = Math.sin(event.time * (0.3) + i);
|
|
|
- var cos = Math.cos(event.time * (0.3) + i);
|
|
|
+ var segment3 = path3.segments[i];
|
|
|
+ var segment4 = path4.segments[i];
|
|
|
+ var segment5 = path5.segments[i];
|
|
|
+ var segment6 = path6.segments[i];
|
|
|
+ var segment7 = path7.segments[i];
|
|
|
+ var segment8 = path8.segments[i];
|
|
|
+
|
|
|
+ // Size blob
|
|
|
+ // Facebook
|
|
|
+ var width = 350; var height = 200;
|
|
|
+ // instagram
|
|
|
+ var width2 = 50; var height2 = 60;
|
|
|
+ // Whatsapp
|
|
|
+ var width3 = 150; var height3 = 90;
|
|
|
+ var width4 = 100; var height4 = 160;
|
|
|
+ var width6 = 100; var height6 = 80;
|
|
|
+ var width5 = 40; var height5 = 100;
|
|
|
+ var width7 = 150; var height7 = 200;
|
|
|
+ var width8 = 30; var height8 = 10;
|
|
|
+
|
|
|
+ // vistesse de deplacement
|
|
|
+ var v = 0.01;
|
|
|
+
|
|
|
+ var movx = Math.sin(event.time * (v + 0.05)) * 400; var movy = Math.cos(event.time * (v + 0.02)) * 200;
|
|
|
+ var movx2 = Math.sin(event.time * (v + 0.02)) * 380; var movy2 = Math.cos(event.time * (v + 0.08)) * 210;
|
|
|
+ var movx3 = Math.sin(event.time * (v + 0.01)) * 360; var movy3 = Math.cos(event.time * (v + 0.01)) * 220;
|
|
|
+ var movx4 = Math.sin(event.time * (v + 0.04)) * 420; var movy4 = Math.cos(event.time * (v + 0.06)) * 180;
|
|
|
+ var movx5 = Math.sin(event.time * (v + 0.05)) * 440; var movy5 = Math.cos(event.time * (v + 0.05)) * 190;
|
|
|
+ var movx6 = Math.sin(event.time * (v + 0.02)) * 390; var movy6 = Math.cos(event.time * (v + 0.04)) * 230;
|
|
|
+ var movx8 = Math.sin(event.time * (v + 0.03)) * 410; var movy7 = Math.cos(event.time * (v + 0.03)) * 170;
|
|
|
+ var movx7 = Math.sin(event.time * (v + 0.04)) * 400; var movy8 = Math.cos(event.time * (v + 0.02)) * 200;
|
|
|
+
|
|
|
+ // contour blob
|
|
|
+ var sinus = Math.sin(event.time * ( - 0.05) + i); var cos = Math.cos(event.time * ( - 0.05) + i);
|
|
|
+ var sinus2 = Math.sin(event.time * ( 0.1) + i); var cos2 = Math.cos(event.time * ( 0.1) + i);
|
|
|
+ var sinus3 = Math.sin(event.time * (0.15) + i); var cos3 = Math.cos(event.time * (0.15) + i);
|
|
|
+ var sinus4 = Math.sin(event.time * (0.08) + i); var cos4 = Math.cos(event.time * (0.08) + i);
|
|
|
+ var sinus5 = Math.sin(event.time * ( - 0.2) + i); var cos5 = Math.cos(event.time * ( - 0.2) + i);
|
|
|
+ var sinus6 = Math.sin(event.time * (0.12) + i); var cos6 = Math.cos(event.time * (0.12) + i);
|
|
|
+ var sinus7 = Math.sin(event.time * ( - 0.25) + i); var cos7 = Math.cos(event.time * ( - 0.25) + i);
|
|
|
+ var sinus8 = Math.sin(event.time * (0.18) + i); var cos8 = Math.cos(event.time * (0.18) + i);
|
|
|
+
|
|
|
+ var rotatex = Math.sin(event.time * Math.PI/360) + i;
|
|
|
+ var rotatex2 = Math.sin(event.time * Math.PI/21) + i;
|
|
|
var rotatex3 = Math.sin(event.time * Math.PI/360) + i;
|
|
|
-
|
|
|
- segment.point.x = cos * width3 + left + 400;
|
|
|
- segment.point.y = sinus * height3 + top + 300;
|
|
|
+ var rotatex4 = Math.sin(event.time * Math.PI/75) + i;
|
|
|
+ var rotatex5 = Math.sin(event.time * Math.PI/123) + i;
|
|
|
+ var rotatex6 = Math.sin(event.time * Math.PI/354) + i;
|
|
|
+ var rotatex7 = Math.sin(event.time * Math.PI/76) + i;
|
|
|
+ var rotatex8 = Math.sin(event.time * Math.PI/10) + i;
|
|
|
+
|
|
|
+ var left = width - movx + 200; var top = height - movy + 200;
|
|
|
+ var left2 = width2 - movx2 + 200; var top2 = height2 - movy2 + 50;
|
|
|
+ var left3 = width3 - movx3 + 190; var top3 = height3 - movy3 + 30;
|
|
|
+ var left4 = width4 - movx4 + 50; var top4 = height4 - movy4 + 90;
|
|
|
+ var left5 = width5 - movx5 + 220; var top5 = height5 - movy5 + 25;
|
|
|
+ var left6 = width6 - movx6 + 160; var top6 = height6 - movy6 + 150;
|
|
|
+ var left7 = width7 - movx7 + 180; var top7 = height7 - movy7 + 160;
|
|
|
+ var left8 = width8 - movx8 + 220; var top8 = height8 - movy8 + 200;
|
|
|
+
|
|
|
+ segment.point.x = cos * width + left + 400; segment.point.y = sinus * height + top + 150;
|
|
|
+ segment2.point.x = cos2 * width2 + left2 + 400; segment2.point.y = sinus2 * height2 + top2 + 150;
|
|
|
+ segment3.point.x = cos3 * width3 + left3 + 400; segment3.point.y = sinus3 * height3 + top3 + 150;
|
|
|
+ segment4.point.x = cos4 * width4 + left4 + 400; segment4.point.y = sinus4 * height4 + top4 + 150;
|
|
|
+ segment5.point.x = cos5 * width5 + left5 + 400; segment5.point.y = sinus5 * height5 + top5 + 150;
|
|
|
+ segment6.point.x = cos6 * width6 + left6 + 400; segment6.point.y = sinus6 * height6 + top6 + 150;
|
|
|
+ segment7.point.x = cos7 * width7 + left7 + 400; segment7.point.y = sinus7 * height7 + top7 + 150;
|
|
|
+ segment8.point.x = cos8 * width8 + left8 + 400; segment8.point.y = sinus8 * height8 + top8 + 150;
|
|
|
+
|
|
|
+ // Rotate blob
|
|
|
+ path.rotate(rotatex);
|
|
|
+ path2.rotate(rotatex2);
|
|
|
path3.rotate(rotatex3);
|
|
|
+ path4.rotate(rotatex4);
|
|
|
+ path5.rotate(rotatex5);
|
|
|
+ path6.rotate(rotatex6);
|
|
|
+ path7.rotate(rotatex7);
|
|
|
+ path8.rotate(rotatex8);
|
|
|
+
|
|
|
+ // Smooth
|
|
|
+ path.smooth();
|
|
|
+ path2.smooth();
|
|
|
path3.smooth();
|
|
|
+ path4.smooth();
|
|
|
+ path5.smooth();
|
|
|
+ path6.smooth();
|
|
|
+ path7.smooth();
|
|
|
+ path8.smooth();
|
|
|
}
|
|
|
}
|
|
|
$("a[href^='#facebook']").click(function(){
|
|
@@ -524,19 +602,14 @@ function paperjs() {
|
|
|
|
|
|
}
|
|
|
|
|
|
-//
|
|
|
-// function clickcanvena() {
|
|
|
-// console.log('path_reseaux',path._reseaux);
|
|
|
-// }
|
|
|
-
|
|
|
$(document).ready(function() {
|
|
|
- paperjs();
|
|
|
+ // paperjs();
|
|
|
// clickcanvena();
|
|
|
clicklinkmap();
|
|
|
mCustomScrollbar();
|
|
|
clickhand();
|
|
|
drag();
|
|
|
- dragcanvas();
|
|
|
+ // dragcanvas();
|
|
|
map();
|
|
|
clicklinkmap();
|
|
|
// paperjs();
|