Commits

Ian George committed 1d3cfb7

Ipad fixes and some desktop browser improvements

Comments (0)

Files changed (3)

 1.1
 - IPad fixes, it now works on them
 - Direction bug fixed on mobile devices, it wasn't resetting the direction on touch end so new touch drags acted strangely
+
+1.1.1
+- More iPad fixes, can click through links now
+- Tidied up touch event code  so it's a bit more predictable
+- Fix for desktop browsers so it stops tracking movement outside the container

jquery.tagsphere.js

 /*
 Plugin: 3D Tag Sphere
-Version: 1.1
+Version: 1.1.1
 Author: Ian George
 Website: http://www.iangeorge.net
 Tools: Emacs, js2-mode, jquery
-Tested on: 
- IE6, IE7, IE8, 
- Firefox 3.6, 7 Linux, 
- Firefox 3.5 Windows, 
- Firefox 7 OSX, 
- Chrome Linux / Windows, 
- iPad 1
- android 2.2
- iphone 3gs, 4
-Requirements: 
- jQuery
- Optional jquery.mousewheel for zooming
+Tested on: IE6, IE7, IE8, Firefox 3.6 Linux, Firefox 3.5 Windows, Chrome Linux / Windows, ipad 2
+Requirements: jquery.mousewheel for zooming
 
 Description: 3d tag cloud, rotates with mouse / touch drag and zooms in and out.
 
          var motionx = new mqueue(50, true);
          var motiony = new mqueue(50, false);
          var dragging = false;
+         var clicked = false;
          var mousex = 0;
          var mousey = 0;
 
          drawing_interval = setInterval(draw, opts.drawing_interval);
 
          container.bind('touchstart', function(evt){
-                            evt.preventDefault();
-                            var touch = evt.originalEvent.touches[0] || evt.originalEvent.changedTouches[0];
-
-                            dragging = true;
-
-                            motionx.add(touch.pageX, true);
-                            motiony.add(touch.pageY, true);
-
-                        });
+                            clicked = true;
+                            motionx.add(evt.pageX, true);
+                            motiony.add(evt.pageY, true);
+                          }, false);
 
          container.bind('touchmove', function(evt){
+                            if (clicked) dragging = true;
+
+                            if(dragging){
+                                motionx.add(evt.pageX, false);
+                                motiony.add(evt.pageY);
+                                vectorx = motionx.avg();
+                                vectory = motiony.avg();                                
+                            }
+                            
                             evt.preventDefault();
-                            var touch = evt.originalEvent.touches[0] || evt.originalEvent.changedTouches[0];
-
-                            motionx.add(touch.pageX, false);
-                            motiony.add(touch.pageY, false);
-                            vectorx = motionx.avg();
-                            vectory = motiony.avg();
-                        });
+                          }, false);
 
          container.bind('touchend', function(evt){
-                            evt.preventDefault();
-
+                            clicked = false;
                             dragging = false;
                             motionx.reset();
-                            motiony.reset();
+                            motiony.reset();                            
+                          }, false);
 
-                        });
+         container.mousedown(function(evt){
+                                 if(evt.which == 1){
+                                     clicked = true;
+                                     motionx.add(evt.pageX, true);
+                                     motiony.add(evt.pageY, true);
+                                 }
+                                 evt.preventDefault();
+                                 return false;
+                             });
 
-
-
-         container.mousemove(function(evt){    
+         container.mousemove(function(evt){   
+                                 if(clicked) dragging = true;
+                                 
                                  if (dragging){
                                      motionx.add(evt.pageX, false);
                                      motiony.add(evt.pageY);
                                  evt.preventDefault();
                              });
 
-         container.mousedown(function(evt){
-                                 if(evt.which == 1){
-                                     dragging = true;
-                                     motionx.add(evt.pageX, true);
-                                     motiony.add(evt.pageY, true);
-                                 }
-                                 evt.preventDefault();
-                                 return false;
-                             });
-
          container.mouseup(function(evt){
                                if(evt.which == 1){
+                                   clicked = false;
                                    dragging = false;
                                    motionx.reset();
                                    motiony.reset();
                              });
          
          container.mouseleave(function(evt){
-             dragging = false;
-             motionx.reset();
-             motiony.reset();
+                                  dragging = false;
+                                  clicked = false;
+                                  motionx.reset();
+                                  motiony.reset();
          });
 
          container.mousewheel(function(evt, delta){
                                   return false;
                               });
 
-         $('.point a').click(function(e){
-                                 if(dragging){
-                                     e.preventDefault();
-                                     return false;                                     
-                                 }
-                                 return true;
-                             });
+
      };
           
  })(jQuery);

jquery.tagsphere.min.js

 var HEX=new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");function mqueue(size,negate){this.items=new Array();this.size=size;this.last=0;this.reset=function(){this.items=new Array();};this.add=function(abs_val,start){var val=0;if(this.last==0||start)this.last=abs_val;if(this.items.length>0){if(negate){val=this.last-abs_val;}else{val=abs_val-this.last;}}else{val=abs_val;}
 this.last=abs_val;this.items.push(val);if(this.items.length>this.size){this.items.shift();}};this.avg=function(){var total=0;for(i in this.items){total+=this.items[i];}
 var rv=(total/size);return rv;};}
-(function($){$.fn.tagcloud=function(options){var opts=$.extend($.fn.tagcloud.defaults,options);opts.drawing_interval=1/(opts.fps/1000);$(this).each(function(){new TagCloudClass($(this),opts);});return this;};$.fn.tagcloud.defaults={zoom:90,max_zoom:120,min_zoom:25,zoom_factor:5,rotate_factor:2,fps:20,centrex:250,centrey:250,min_font_size:12,max_font_size:32,font_units:'px',random_points:0,init_motion_x:0,init_motion_y:0,decay:0.90};var TagCloudClass=function(el,options){$(el).css('position','relative');var eyez=-500;var rad=Math.PI/180;var global_cos=Math.cos(0);var dirty=true;var container=$(el);var id_stub='tc_'+$(el).attr('id')+"_";var opts=options;var zoom=opts.zoom;var depth;var points_meta=[];var points_data=[];var vectorx=opts.init_motion_x;var vectory=opts.init_motion_y;var motionx=new mqueue(50,true);var motiony=new mqueue(50,false);var dragging=false;var mousex=0;var mousey=0;var drawing_interval;var cmx=options.centrex;var cmy=options.centrey;var bg_colour;if(options.background_colour){bg_colour=parsecolour(options.background_colour);}else{bg_colour=parsecolour($(el).css('background-color'));}
+(function($){$.fn.tagcloud=function(options){var opts=$.extend($.fn.tagcloud.defaults,options);opts.drawing_interval=1/(opts.fps/1000);$(this).each(function(){new TagCloudClass($(this),opts);});return this;};$.fn.tagcloud.defaults={zoom:90,max_zoom:120,min_zoom:25,zoom_factor:5,rotate_factor:2,fps:20,centrex:250,centrey:250,min_font_size:12,max_font_size:32,font_units:'px',random_points:0,init_motion_x:0,init_motion_y:0,decay:0.90};var TagCloudClass=function(el,options){$(el).css('position','relative');var eyez=-500;var rad=Math.PI/180;var global_cos=Math.cos(0);var dirty=true;var container=$(el);var id_stub='tc_'+$(el).attr('id')+"_";var opts=options;var zoom=opts.zoom;var depth;var points_meta=[];var points_data=[];var vectorx=opts.init_motion_x;var vectory=opts.init_motion_y;var motionx=new mqueue(50,true);var motiony=new mqueue(50,false);var dragging=false;var clicked=false;var mousex=0;var mousey=0;var drawing_interval;var cmx=options.centrex;var cmy=options.centrey;var bg_colour;if(options.background_colour){bg_colour=parsecolour(options.background_colour);}else{bg_colour=parsecolour($(el).css('background-color'));}
 function parsecolour(colour){function parse_rgb_colour(colour){rgb=colour.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);if(!rgb)return{"r":255,"g":255,"b":255};if(rgb.length>3){return{"r":parseInt(rgb[1]),"g":parseInt(rgb[2]),"b":parseInt(rgb[3])};}else{return{"r":0,"g":0,"b":0};}}
 function parse_hex_colour(colour){var r=0,g=0,b=0;if(colour.length>4)
 {r=parseInt(colour.substr(1,2),16);g=parseInt(colour.substr(3,2),16);b=parseInt(colour.substr(5,2),16);}
 else{points_data[idx].phi=(points_data[idx-1].phi+3.6/Math.sqrt(points_meta.count*(1-Math.pow(h,2))))%(2*Math.PI);}
 points_data[idx].x=Math.cos(points_data[idx].phi)*Math.sin(points_data[idx].theta)*(cmx/2);points_data[idx].y=Math.sin(points_data[idx].phi)*Math.sin(points_data[idx].theta)*(cmy/2);points_data[idx].z=Math.cos(points_data[idx].theta)*(cmx/2);points_data[idx].colour=parsecolour($(this).css('color'));if(sz>points_meta.largest)points_meta.largest=sz;if(sz<points_meta.smallest)points_meta.smallest=sz;$(this).css('position','absolute');$(this).addClass('point');$(this).attr('id',point_id);points_data[idx].element=$('#'+point_id);});var sz_range=points_meta.largest-points_meta.smallest+1;var sz_n_range=opts.max_font_size-opts.min_font_size+1;for(var p in points_data){var sz=points_data[p].size;var sz_n=parseInt((sz/sz_range)*sz_n_range)+opts.min_font_size;if(!points_data[p].element.hasClass('background')){points_data[p].element.css('font-size',sz_n);}
 points_data[p].cwidth=points_data[p].element.width()/2;}
-depth=-(zoom*(eyez-opts.max_zoom)/100)+eyez;draw();drawing_interval=setInterval(draw,opts.drawing_interval);container.bind('touchstart',function(evt){evt.preventDefault();var touch=evt.originalEvent.touches[0]||evt.originalEvent.changedTouches[0];dragging=true;motionx.add(touch.pageX,true);motiony.add(touch.pageY,true);});container.bind('touchmove',function(evt){evt.preventDefault();var touch=evt.originalEvent.touches[0]||evt.originalEvent.changedTouches[0];motionx.add(touch.pageX,false);motiony.add(touch.pageY,false);vectorx=motionx.avg();vectory=motiony.avg();});container.bind('touchend',function(evt){evt.preventDefault();dragging=false;motionx.reset();motiony.reset();});container.mousemove(function(evt){if(dragging){motionx.add(evt.pageX,false);motiony.add(evt.pageY);vectorx=motionx.avg();vectory=motiony.avg();}
-evt.preventDefault();});container.mousedown(function(evt){if(evt.which==1){dragging=true;motionx.add(evt.pageX,true);motiony.add(evt.pageY,true);}
-evt.preventDefault();return false;});container.mouseup(function(evt){if(evt.which==1){dragging=false;motionx.reset();motiony.reset();}});container.mouseleave(function(evt){dragging=false;motionx.reset();motiony.reset();});container.mousewheel(function(evt,delta){zoomed(delta);evt.preventDefault();return false;});$('.point a').click(function(e){if(dragging){e.preventDefault();return false;}
-return true;});};})(jQuery);
+depth=-(zoom*(eyez-opts.max_zoom)/100)+eyez;draw();drawing_interval=setInterval(draw,opts.drawing_interval);container.bind('touchstart',function(evt){clicked=true;motionx.add(evt.pageX,true);motiony.add(evt.pageY,true);},false);container.bind('touchmove',function(evt){if(clicked)dragging=true;if(dragging){motionx.add(evt.pageX,false);motiony.add(evt.pageY);vectorx=motionx.avg();vectory=motiony.avg();}
+evt.preventDefault();},false);container.bind('touchend',function(evt){clicked=false;dragging=false;motionx.reset();motiony.reset();},false);container.mousedown(function(evt){if(evt.which==1){clicked=true;motionx.add(evt.pageX,true);motiony.add(evt.pageY,true);}
+evt.preventDefault();return false;});container.mousemove(function(evt){if(clicked)dragging=true;if(dragging){motionx.add(evt.pageX,false);motiony.add(evt.pageY);vectorx=motionx.avg();vectory=motiony.avg();}
+evt.preventDefault();});container.mouseup(function(evt){if(evt.which==1){clicked=false;dragging=false;motionx.reset();motiony.reset();}});container.mouseleave(function(evt){dragging=false;clicked=false;motionx.reset();motiony.reset();});container.mousewheel(function(evt,delta){zoomed(delta);evt.preventDefault();return false;});};})(jQuery);