Merge branch 'user-location' of git://github.com/fkloft/ingress-intel-total-conversion into fkloft/user-location

Makefile

@@ -1,6 +1,16 @@
-default:
+default: mklocal
-	./build.py
 
+local: mklocal
+mobile: mkmobile
+
+mklocal:
+	./build.py local
+
+mkmobile:
+	./build.py mobile
+	adb install -r build/mobile/IITC_Mobile-debug.apk
+	adb shell am start -n com.cradle.iitc_mobile/com.cradle.iitc_mobile.IITC_Mobile
 
 clean:
 	ant -f mobile/build.xml clean
+

build.py

@@ -289,6 +289,7 @@ if buildMobile:
 
         if retcode != 0:
             print ("Error: mobile app failed to build. ant returned %d" % retcode)
+            exit(1) # ant may return 256, but python seems to allow only values <256
         else:
             shutil.copy("mobile/bin/IITC_Mobile-%s.apk" % buildMobile, os.path.join(outDir,"IITC_Mobile-%s.apk" % buildMobile) )
 

mobile/plugins/user-location.css

@@ -0,0 +1,65 @@
+.user-location {
+  pointer-events: none;
+}
+
+.user-location .container {
+  height: 32px;
+  width: 32px;
+  transform-origin: center;
+  -webkit-transform-origin: center;
+}
+
+.user-location .container .inner,
+.user-location .container .outer {
+  position: absolute;
+}
+
+.user-location .res .inner {
+  background-color: #0088b3;
+  border-color: #0088b3;
+}
+
+.user-location .res .outer {
+  background-color: #03baf4;
+  border-color: #03baf4;
+}
+
+.user-location .enl .inner {
+  background-color: #1ee681;
+  border-color: #1ee681;
+}
+
+.user-location .enl .outer {
+  background-color: #00aa4e;
+  border-color: #00aa4e;
+}
+
+.user-location .circle .inner,
+.user-location .circle .outer {
+  width: 32px;
+  height: 32px;
+  border-radius: 16px;
+}
+
+.user-location .circle .inner {
+  transform: scale(0.6);
+  -webkit-transform: scale(0.6);
+}
+
+.user-location .arrow .inner,
+.user-location .arrow .outer {
+  left: 4px;
+  width: 0px;
+  height: 0px;
+  border-style: solid;
+  border-width: 0px 12px 32px;
+  border-left-color: transparent;
+  border-right-color: transparent;
+  background: transparent;
+}
+
+.user-location .arrow .inner {
+  transform: scale(0.6) translateY(15%);
+  -webkit-transform: scale(0.6) translateY(15%);
+}
+

mobile/plugins/user-location.user.js

@@ -1,7 +1,8 @@
 // ==UserScript==
 // @id             iitc-plugin-user-location@cradle
 // @name           IITC plugin: User Location
-// @version        0.1.4.@@DATETIMEVERSION@@
+// @category       Tweaks
+// @version        0.2.0.@@DATETIMEVERSION@@
 // @namespace      https://github.com/jonatkins/ingress-intel-total-conversion
 // @updateURL      @@UPDATEURL@@
 // @downloadURL    @@DOWNLOADURL@@
@@ -10,6 +11,7 @@
 // @include        http://www.ingress.com/intel*
 // @match          https://www.ingress.com/intel*
 // @match          http://www.ingress.com/intel*
+// @grant          none
 // ==/UserScript==
 
 @@PLUGINSTART@@
@@ -18,39 +20,85 @@
 
 window.plugin.userLocation = function() {};
 
-window.plugin.userLocation.marker = {};
 window.plugin.userLocation.locationLayer = new L.LayerGroup();
 
 window.plugin.userLocation.setup = function() {
+  $('<style>').prop('type', 'text/css').html('@@INCLUDESTRING:mobile/plugins/user-location.css@@').appendTo('head');
 
-    var iconImage = '@@INCLUDEIMAGE:images/marker-icon.png@@';
+  var cssClass = PLAYER.team === 'RESISTANCE' ? 'res' : 'enl';
-    var iconRetImage = '@@INCLUDEIMAGE:images/marker-icon-2x.png@@';
 
-    plugin.userLocation.icon = L.Icon.Default.extend({options: {
+  var icon = L.divIcon({
-        iconUrl: iconImage,
+    iconSize: L.point(32, 32),
-        iconRetinaUrl: iconRetImage
+    iconAnchor: L.point(16, 16),
-    }});
+    className: 'user-location',
+    html: '<div class="container ' + cssClass + ' circle"><div class="outer"></div><div class="inner"></div></div>'
+  });
 
-    var cssClass = PLAYER.team === 'RESISTANCE' ? 'res' : 'enl';
+  var marker = L.marker(new L.LatLng(0,0), {
-    var title = '<span class="nickname '+ cssClass+'" style="font-weight:bold;">' + PLAYER.nickname + '</span>\'s location';
+    icon: icon,
+    zIndexOffset: 300,
+    clickable: false
+  });
 
-    var marker = L.marker(window.map.getCenter(), {
+  var circle = new L.Circle(new L.LatLng(0,0), 40, {
-        icon: new plugin.userLocation.icon()
+    color: 'orange',
-    });
+    opacity: 0.7,
+    fillOpacity: 0,
+    weight: 1.5,
+    clickable: false
+  });
 
-    marker.bindPopup(title);
+  marker.addTo(window.plugin.userLocation.locationLayer);
+  window.plugin.userLocation.locationLayer.addTo(window.map);
+  window.addLayerGroup('User location', window.plugin.userLocation.locationLayer, true);
 
-    plugin.userLocation.marker = marker;
+  window.plugin.userLocation.marker = marker;
-    marker.addTo(window.map);
+  window.plugin.userLocation.circle = circle;
-    // jQueryUI doesn’t automatically notice the new markers
+  window.plugin.userLocation.icon = icon;
-    window.setupTooltips($(marker._icon));
+
+  if('ondeviceorientation' in window)
+    window.addEventListener('deviceorientation', window.plugin.userLocation.onDeviceOrientation, false);
+
+  window.map.on('zoomend', window.plugin.userLocation.onZoomEnd);
+  window.plugin.userLocation.onZoomEnd();
 };
 
-window.plugin.userLocation.updateLocation = function(lat, lng) {
+window.plugin.userLocation.onZoomEnd = function() {
-    var latlng = new L.LatLng(lat, lng);
+  if(window.map.getZoom() < 16)
-    window.plugin.userLocation.marker.setLatLng(latlng);
+    window.plugin.userLocation.locationLayer.removeLayer(window.plugin.userLocation.circle);
+  else
+    window.plugin.userLocation.locationLayer.addLayer(window.plugin.userLocation.circle);
+};
+
+window.plugin.userLocation.onDeviceOrientation = function(e) {
+  var direction, delta, heading;
+
+  if (typeof e.webkitCompassHeading !== 'undefined') {
+    direction = e.webkitCompassHeading;
+    if (typeof window.orientation !== 'undefined') {
+      direction += window.orientation;
+    }
+  }
+  else {
+    // http://dev.w3.org/geo/api/spec-source-orientation.html#deviceorientation
+    direction = 360 - e.alpha;
+  }
+
+  $(".container", window.plugin.userLocation.marker._icon)
+    .removeClass("circle")
+    .addClass("arrow")
+    .css({
+      "transform": "rotate(" + direction + "deg)",
+      "webkitTransform": "rotate(" + direction + "deg)"
+    });
 }
 
+window.plugin.userLocation.updateLocation = function(lat, lng) {
+  var latlng = new L.LatLng(lat, lng);
+  window.plugin.userLocation.marker.setLatLng(latlng);
+  window.plugin.userLocation.circle.setLatLng(latlng);
+};
+
 var setup = window.plugin.userLocation.setup;
 
 // PLUGIN END //////////////////////////////////////////////////////////