https://swedenhouse-hokuriku.com/wp/wp-content/themes/swedenhouse/js/sweetlink.js

1/**
2 * jQuery Sweet Link
3 * An utility to change element on whether smartphone or not.
4 * 
5 * @Author:   Takuma Ando
6 * @License:  under MIT Licencse
7 * @Version:  2.1
8 * @Created:  2012-12-12
9 * @Modified: 2013-01-29
10 */
11/**
12 * HOW TO USE:
13 *   1.KILL LINK ONLY ON PC: set 'sweetlink'
14 *      * 'onclick' attribute is also killed.
15 *   2.REMOVE ELEMENT ON PC: set 'sweetlink-element'
16 */
17!function($){
18	/* Default mobile user-agents */
19	var re = /iPhone|iPad|iPod|Android|Windows\sPhone|BlackBerry/;
20	
21	var SL = $.fn.sweetlink = {};
22	$.sweetlink = function(){
23		var a = arguments;
24		switch( true ){
25			case a[0] == 'init':
26				SL.init();
27				break;
28			case a[0] == 'style':
29				SL.createStyle();
30				break;
31			case a[0] == 'mobiles':
32				SL.mobiles = a[1];
33				break;
34			case $.isFunction(a[0]):
35				if( SL.mobiles.exec(window.navigator.userAgent) )
36					a[0]();
37				break;
38		}
39	};
40	SL.init = function(){
41		if( !SL.mobiles.exec(window.navigator.userAgent) ){
42			$('.sweetlink').not('.sweetlinked').each(function(){
43				$(this).addClass('sweetlinked').css('cursor','default').removeAttr('onclick').click(function(e){
44					e.preventDefault();
45					e.stopPropagation();
46				});
47			});
48			$('.sweetlink-element').not('.sweetlinked').addClass('sweetlinked').remove();
49		} else {
50			$('.sweetlink').not('.sweetlinked').filter('.sweetlink-icon-tel').each(function(){
51				$(this).addClass('sweetlinked');
52				var color = $(this).attr('class').match(/sweetlink\-icon\-0x([a-f0-9]+)/i)
53									? '#'+RegExp.$1
54									: 'black';
55				var shape = $(this).hasClass('sweetlink-icon-circle') ? 'circle' : 'rect';
56				SL.draw(this, shape, color);
57			});
58		}
59	};
60	SL.createStyle = function(){
61		if( !SL.mobiles.exec(window.navigator.userAgent) ){

62			document.write('<'+'style type="text/css">.sweetlink{cursor:default} .sweetlink-element{display:none}<'+'/style>');
63		}
64	};
65	SL.draw = function(target, shape, color){
66		var isCircle = shape == 'circle';
67		var w = isCircle ? 40 : 60;
68		var h = isCircle ? 40 : 25;
69		var position = {
70			top:  isCircle ? -10 : -h + 10,
71			left: isCircle ?  -w + 15 : -15
72		}
73		
74		var $icon = $('<canvas/>').attr({
75			width:  w,
76			height: h
77		}).css({
78			position: 'absolute',
79			top:      isCircle ? -10 : -h + 10,
80			left:     isCircle ?  -w + 15 : -15,
81			zIndex:   50,
82			width:    w+'px',
83			height:   h+'px'
84		}).appendTo($('body'));
85		var ctx = $icon.get(0).getContext('2d');
86		ctx.save();
87		ctx.beginPath();
88		if( isCircle ){
89			ctx.moveTo(40.0, 20.0);
90			ctx.bezierCurveTo(40.0, 31.0, 31.0, 40.0, 20.0, 40.0);
91			ctx.bezierCurveTo(9.0, 40.0, 0.0, 31.0, 0.0, 20.0);
92			ctx.bezierCurveTo(0.0, 9.0, 9.0, 0.0, 20.0, 0.0);
93			ctx.bezierCurveTo(31.0, 0.0, 40.0, 9.0, 40.0, 20.0);
94			ctx.closePath();
95		} else {
96			ctx.moveTo(60.0, 6.0);
97			ctx.lineTo(60.0, 14.0);
98			ctx.bezierCurveTo(60.0, 17.3, 57.3, 20.0, 54.0, 20.0);
99			ctx.lineTo(35.0, 20.0);
100			ctx.lineTo(30.0, 25.0);
101			ctx.lineTo(25.0, 20.0);
102			ctx.lineTo(6.0, 20.0);
103			ctx.bezierCurveTo(2.7, 20.0, 0.0, 17.3, 0.0, 14.0);
104			ctx.lineTo(0.0, 6.0);
105			ctx.bezierCurveTo(0.0, 2.7, 2.7, 0.0, 6.0, 0.0);
106			ctx.lineTo(54.0, 0.0);
107			ctx.bezierCurveTo(57.3, 0.0, 60.0, 2.7, 60.0, 6.0);
108			ctx.closePath();
109		}
110		ctx.fillStyle = color;
111		ctx.fill();
112		ctx.restore();
113		
114		ctx.save();
115		ctx.beginPath();
116		if( isCircle ){
117			ctx.translate(5,15);
118			ctx.moveTo(3.4, 9.7);
119			ctx.bezierCurveTo(3.5, 9.9, 3.4, 10.0, 3.3, 10.1);
120			ctx.bezierCurveTo(3.3, 10.1, 1.9, 10.6, 1.5, 10.0);
121			ctx.bezierCurveTo(-0.5, 7.4, -0.5, 3.1, 1.5, 0.5);
122			ctx.bezierCurveTo(1.9, -0.2, 3.1, 0.0, 3.1, 0.0);
123			ctx.bezierCurveTo(3.2, 0.0, 3.3, 0.2, 3.3, 0.4);
124			ctx.lineTo(2.9, 3.1);
125			ctx.bezierCurveTo(2.9, 3.2, 2.8, 3.4, 2.7, 3.4);
126			ctx.lineTo(1.8, 3.4);
127			ctx.bezierCurveTo(1.6, 3.4, 1.5, 3.5, 1.5, 3.7);
128			ctx.lineTo(1.5, 6.6);
129			ctx.bezierCurveTo(1.5, 6.8, 1.6, 6.9, 1.8, 6.9);
130			ctx.lineTo(2.7, 6.9);
131			ctx.bezierCurveTo(2.9, 6.9, 3.0, 7.1, 3.0, 7.2);
132			ctx.lineTo(3.4, 9.7);
133			ctx.closePath();
134
135			ctx.moveTo(5.7, 1.6);
136			ctx.lineTo(9.1, 1.6);
137			ctx.lineTo(9.1, 9.7);
138			ctx.lineTo(11.1, 9.7);
139			ctx.lineTo(11.1, 1.6);
140			ctx.lineTo(14.4, 1.6);
141			ctx.lineTo(14.4, 0.3);
142			ctx.lineTo(5.7, 0.3);
143			ctx.lineTo(5.7, 1.6);
144			ctx.closePath();
145
146			ctx.moveTo(17.7, 5.5);
147			ctx.lineTo(21.1, 5.5);
148			ctx.lineTo(21.1, 4.2);
149			ctx.lineTo(17.7, 4.2);
150			ctx.lineTo(17.7, 1.6);
151			ctx.lineTo(21.8, 1.6);
152			ctx.lineTo(21.8, 0.3);
153			ctx.lineTo(15.8, 0.3);
154			ctx.lineTo(15.8, 9.7);
155			ctx.lineTo(22.1, 9.7);
156			ctx.lineTo(22.1, 8.4);
157			ctx.lineTo(17.7, 8.4);
158			ctx.lineTo(17.7, 5.5);
159			ctx.closePath();
160
161			ctx.moveTo(25.5, 8.4);
162			ctx.lineTo(25.5, 0.3);
163			ctx.lineTo(23.6, 0.3);
164			ctx.lineTo(23.6, 9.7);
165			ctx.lineTo(29.7, 9.7);
166			ctx.lineTo(29.7, 8.4);
167			ctx.lineTo(25.5, 8.4);
168			ctx.closePath();
169		} else {
170			ctx.translate(10,3);
171			ctx.moveTo(4.3, 12.1);
172			ctx.bezierCurveTo(4.3, 12.3, 4.2, 12.5, 4.1, 12.6);
173			ctx.bezierCurveTo(4.1, 12.6, 2.4, 13.3, 1.8, 12.5);
174			ctx.bezierCurveTo(-0.6, 9.2, -0.6, 3.9, 1.8, 0.6);
175			ctx.bezierCurveTo(2.4, -0.2, 3.9, 0.0, 3.9, 0.0);
176			ctx.bezierCurveTo(4.0, 0.1, 4.1, 0.2, 4.1, 0.4);
177			ctx.lineTo(3.7, 3.9);
178			ctx.bezierCurveTo(3.6, 4.1, 3.5, 4.2, 3.3, 4.2);
179			ctx.lineTo(2.2, 4.2);
180			ctx.bezierCurveTo(2.0, 4.2, 1.9, 4.4, 1.9, 4.6);
181			ctx.lineTo(1.9, 8.3);
182			ctx.bezierCurveTo(1.9, 8.5, 2.0, 8.7, 2.2, 8.7);
183			ctx.lineTo(3.4, 8.7);
184			ctx.bezierCurveTo(3.6, 8.7, 3.7, 8.8, 3.8, 9.0);
185			ctx.lineTo(4.3, 12.1);
186			ctx.closePath();
187
188			ctx.moveTo(9.2, 2.0);
189			ctx.lineTo(13.4, 2.0);
190			ctx.lineTo(13.4, 12.1);
191			ctx.lineTo(15.8, 12.1);
192			ctx.lineTo(15.8, 2.0);
193			ctx.lineTo(20.0, 2.0);
194			ctx.lineTo(20.0, 0.3);
195			ctx.lineTo(9.2, 0.3);
196			ctx.lineTo(9.2, 2.0);
197			ctx.closePath();
198
199			ctx.moveTo(24.1, 6.9);
200			ctx.lineTo(28.4, 6.9);
201			ctx.lineTo(28.4, 5.2);
202			ctx.lineTo(24.1, 5.2);
203			ctx.lineTo(24.1, 2.0);
204			ctx.lineTo(29.3, 2.0);
205			ctx.lineTo(29.3, 0.3);
206			ctx.lineTo(21.7, 0.3);
207			ctx.lineTo(21.7, 12.1);
208			ctx.lineTo(29.6, 12.1);
209			ctx.lineTo(29.6, 10.4);
210			ctx.lineTo(24.1, 10.4);
211			ctx.lineTo(24.1, 6.9);
212			ctx.closePath();
213
214			ctx.moveTo(33.9, 10.4);
215			ctx.lineTo(33.9, 0.3);
216			ctx.lineTo(31.5, 0.3);
217			ctx.lineTo(31.5, 12.1);
218			ctx.lineTo(39.2, 12.1);
219			ctx.lineTo(39.2, 10.4);
220			ctx.lineTo(33.9, 10.4);
221			ctx.lineTo(33.9, 10.4);
222			ctx.closePath();
223		}
224		ctx.fillStyle = 'rgb(255,255,255)';
225		ctx.fill();

226		ctx.restore();
227		
228		var rad = 0;
229		!function(){
230			var callee = arguments.callee;
231			if( !$(target).width() ){
232				$icon.hide();
233			}else{
234				$icon.show();
235			}
236			$icon.css({
237				top:$(target).offset().top + position.top + Math.sin(rad / Math.PI) * 2,
238				left:$(target).offset().left + position.left
239			});
240			rad++;
241			if( rad > 360 )
242				rad -= 360;
243			setTimeout(callee, 50);
244		}();
245	};
246	SL.mobiles = re;
247	
248	$(function(){ SL.init() });
249}(jQuery)