More flow

build/generate-flow-typed-style-spec.js

@@ -100,7 +100,17 @@ const layerTypes = Object.keys(spec.layer.type.values);
 fs.writeFileSync('flow-typed/style-spec.js', `// Generated code; do not edit. Edit build/generate-flow-typed-style-spec.js instead.
 
 declare type ColorSpecification = string;
-declare type FilterSpecification = Array<any>;
+
+declare type FilterSpecification =
+    | ['has', string]
+    | ['!has', string]
+    | ['==', string, string | number | boolean]
+    | ['!=', string, string | number | boolean]
+    | ['>', string, string | number | boolean]
+    | ['>=', string, string | number | boolean]
+    | ['<', string, string | number | boolean]
+    | ['<=', string, string | number | boolean]
+    | Array<string | FilterSpecification>; // Can't type in, !in, all, any, none -- https://github.com/facebook/flow/issues/2443
 
 declare type TransitionSpecification = {
     duration?: number,

flow-typed/geojson.js

@@ -1,14 +1,14 @@
-type Position = [number, number] | [number, number, number];
+type GeoJSONPosition = [number, number] | [number, number, number];
 type Geometry<T, C> = { type: T, coordinates: C }
 
-declare type      GeoJSONPoint = Geometry<     'Point',       Position>;
-declare type GeoJSONMultiPoint = Geometry<'MultiPoint', Array<Position>>;
+declare type      GeoJSONPoint = Geometry<     'Point',       GeoJSONPosition>;
+declare type GeoJSONMultiPoint = Geometry<'MultiPoint', Array<GeoJSONPosition>>;
 
-declare type      GeoJSONLineString = Geometry<     'LineString',       Array<Position>>;
-declare type GeoJSONMultiLineString = Geometry<'MultiLineString', Array<Array<Position>>>;
+declare type      GeoJSONLineString = Geometry<     'LineString',       Array<GeoJSONPosition>>;
+declare type GeoJSONMultiLineString = Geometry<'MultiLineString', Array<Array<GeoJSONPosition>>>;
 
-declare type      GeoJSONPolygon = Geometry<     'Polygon',       Array<Array<Position>>>;
-declare type GeoJSONMultiPolygon = Geometry<'MultiPolygon', Array<Array<Array<Position>>>>;
+declare type      GeoJSONPolygon = Geometry<     'Polygon',       Array<Array<GeoJSONPosition>>>;
+declare type GeoJSONMultiPolygon = Geometry<'MultiPolygon', Array<Array<Array<GeoJSONPosition>>>>;
 
 declare type GeoJSONGeometry =
     | GeoJSONPoint

flow-typed/style-spec.js

@@ -1,7 +1,17 @@
 // Generated code; do not edit. Edit build/generate-flow-typed-style-spec.js instead.
 
 declare type ColorSpecification = string;
-declare type FilterSpecification = Array<any>;
+
+declare type FilterSpecification =
+    | ['has', string]
+    | ['!has', string]
+    | ['==', string, string | number | boolean]
+    | ['!=', string, string | number | boolean]
+    | ['>', string, string | number | boolean]
+    | ['>=', string, string | number | boolean]
+    | ['<', string, string | number | boolean]
+    | ['<=', string, string | number | boolean]
+    | Array<string | FilterSpecification>; // Can't type in, !in, all, any, none -- https://github.com/facebook/flow/issues/2443
 
 declare type TransitionSpecification = {
     duration?: number,

src/data/feature_index.js

@@ -41,7 +41,7 @@ type QueryParameters = {
     tileSize: number,
     queryGeometry: Array<Array<{x: number, y: number}>>,
     params: {
-        filter: any,
+        filter: FilterSpecification,
         layers: Array<string>,
     }
 }

src/shaders/encode_attribute.js

@@ -1,3 +1,4 @@
+// @flow
 
 const util = require('../util/util');
 
@@ -8,7 +9,7 @@ const util = require('../util/util');
  *
  * @private
  */
-exports.packUint8ToFloat = function pack(a, b) {
+exports.packUint8ToFloat = function pack(a: number, b: number) {
     // coerce a and b to 8-bit ints
     a = util.clamp(Math.floor(a), 0, 255);
     b = util.clamp(Math.floor(b), 0, 255);

src/source/query_features.js

@@ -9,7 +9,7 @@ import type Coordinate from '../geo/coordinate';
 exports.rendered = function(sourceCache: SourceCache,
                             styleLayers: {[string]: StyleLayer},
                             queryGeometry: Array<Coordinate>,
-                            params: { filter: any, layers: Array<string> },
+                            params: { filter: FilterSpecification, layers: Array<string> },
                             zoom: number,
                             bearing: number) {
     const tilesIn = sourceCache.tilesIn(queryGeometry);

src/source/rtl_text_plugin.js

@@ -49,4 +49,4 @@ module.exports.setRTLTextPlugin = function(pluginURL: string, callback: ErrorCal
 };
 
 module.exports.applyArabicShaping = (null : ?Function);
-module.exports.processBidirectionalText = (null : ?Function);
+module.exports.processBidirectionalText = (null : ?(string, Array<number>) => Array<string>);

src/source/source.js

@@ -45,6 +45,7 @@ export interface Source {
     minzoom: number,
     maxzoom: number,
     tileSize: number,
+    attribution?: string,
 
     roundZoom?: boolean,
     reparseOverscaled?: boolean,

src/style/style.js

@@ -248,7 +248,7 @@ class Style extends Evented {
         return ids.map((id) => this._layers[id].serialize());
     }
 
-    _applyClasses(classes?: Array<string>, options: {}) {
+    _applyClasses(classes?: Array<string>, options: ?{}) {
         if (!this._loaded) return;
 
         classes = classes || [];
@@ -334,7 +334,7 @@ class Style extends Evented {
     /**
      * Apply queued style updates in a batch
      */
-    update(classes: Array<string>, options: {}) {
+    update(classes: Array<string>, options: ?{}) {
         if (!this._changed) return;
 
         const updatedIds = Object.keys(this._updatedLayers);
@@ -547,7 +547,7 @@ class Style extends Evented {
      * @param {StyleLayer|Object} layer
      * @param {string=} before  ID of an existing layer to insert before
      */
-    moveLayer(id: string, before: string) {
+    moveLayer(id: string, before?: string) {
         this._checkLoaded();
         this._changed = true;
 
@@ -650,7 +650,7 @@ class Style extends Evented {
         this._updateLayer(layer);
     }
 
-    setFilter(layerId: string, filter: any) {
+    setFilter(layerId: string, filter: FilterSpecification) {
         this._checkLoaded();
 
         const layer = this.getLayer(layerId);
@@ -868,7 +868,7 @@ class Style extends Evented {
         return this.light.getLight();
     }
 
-    setLight(lightOptions: LightSpecification, transitionOptions: {}) {
+    setLight(lightOptions: LightSpecification, transitionOptions?: {}) {
         this._checkLoaded();
 
         const light = this.light.getLight();

src/style/style_layer.js

@@ -117,7 +117,7 @@ class StyleLayer extends Evented {
         );
     }
 
-    getLayoutValue(name: string, globalProperties?: GlobalProperties, featureProperties?: FeatureProperties) {
+    getLayoutValue(name: string, globalProperties?: GlobalProperties, featureProperties?: FeatureProperties): any {
         const specification = this._layoutSpecifications[name];
         const declaration = this._layoutDeclarations[name];
 
@@ -170,7 +170,7 @@ class StyleLayer extends Evented {
         }
     }
 
-    getPaintValue(name: string, globalProperties?: GlobalProperties, featureProperties?: FeatureProperties) {
+    getPaintValue(name: string, globalProperties?: GlobalProperties, featureProperties?: FeatureProperties): any {
         const specification = this._paintSpecifications[name];
         const transition = this._paintTransitions[name];
 

src/symbol/anchor.js

@@ -1,9 +1,12 @@
+// @flow
 
 const Point = require('@mapbox/point-geometry');
 
 class Anchor extends Point {
+    angle: any;
+    segment: number | void;
 
-    constructor(x, y, angle, segment) {
+    constructor(x: number, y: number, angle: number, segment?: number) {
         super(x, y);
         this.angle = angle;
         if (segment !== undefined) {

src/symbol/check_max_angle.js

@@ -1,20 +1,24 @@
+// @flow
 
 module.exports = checkMaxAngle;
 
+import type Point from '@mapbox/point-geometry';
+import type Anchor from './anchor';
+
 /**
  * Labels placed around really sharp angles aren't readable. Check if any
  * part of the potential label has a combined angle that is too big.
  *
- * @param {Array<Point>} line
- * @param {Anchor} anchor The point on the line around which the label is anchored.
- * @param {number} labelLength The length of the label in geometry units.
- * @param {number} windowSize The check fails if the combined angles within a part of the line that is `windowSize` long is too big.
- * @param {number} maxAngle The maximum combined angle that any window along the label is allowed to have.
+ * @param line
+ * @param anchor The point on the line around which the label is anchored.
+ * @param labelLength The length of the label in geometry units.
+ * @param windowSize The check fails if the combined angles within a part of the line that is `windowSize` long is too big.
+ * @param maxAngle The maximum combined angle that any window along the label is allowed to have.
  *
  * @returns {boolean} whether the label should be placed
  * @private
  */
-function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
+function checkMaxAngle(line: Array<Point>, anchor: Anchor, labelLength: number, windowSize: number, maxAngle: number) {
 
     // horizontal labels always pass
     if (anchor.segment === undefined) return true;

src/symbol/clip_line.js

@@ -1,3 +1,4 @@
+// @flow
 
 const Point = require('@mapbox/point-geometry');
 
@@ -6,15 +7,15 @@ module.exports = clipLine;
 /**
  * Returns the part of a multiline that intersects with the provided rectangular box.
  *
- * @param {Array<Array<Point>>} lines
- * @param {number} x1 the left edge of the box
- * @param {number} y1 the top edge of the box
- * @param {number} x2 the right edge of the box
- * @param {number} y2 the bottom edge of the box
- * @returns {Array<Array<Point>>} lines
+ * @param lines
+ * @param x1 the left edge of the box
+ * @param y1 the top edge of the box
+ * @param x2 the right edge of the box
+ * @param y2 the bottom edge of the box
+ * @returns lines
  * @private
  */
-function clipLine(lines, x1, y1, x2, y2) {
+function clipLine(lines: Array<Array<Point>>, x1: number, y1: number, x2: number, y2: number): Array<Array<Point>> {
     const clippedLines = [];
 
     for (let l = 0; l < lines.length; l++) {

src/symbol/collision_box.js

@@ -3,6 +3,28 @@
 const createStructArrayType = require('../util/struct_array');
 const Point = require('@mapbox/point-geometry');
 
+export type CollisionBox = {
+    anchorPoint: Point,
+    anchorPointX: number,
+    anchorPointY: number,
+    offsetX: number,
+    offsetY: number,
+    x1: number,
+    y1: number,
+    x2: number,
+    y2: number,
+    unadjustedMaxScale: number,
+    maxScale: number,
+    featureIndex: number,
+    sourceLayerIndex: number,
+    bucketIndex: number,
+    bbox0: number,
+    bbox1: number,
+    bbox2: number,
+    bbox3: number,
+    placementScale: number
+};
+
 /**
  * A collision box represents an area of the map that that is covered by a
  * label. CollisionFeature uses one or more of these collision boxes to

src/symbol/collision_feature.js

@@ -1,3 +1,8 @@
+// @flow
+
+import type CollisionBoxArray from './collision_box';
+import type Point from '@mapbox/point-geometry';
+import type Anchor from './anchor';
 
 /**
  * A CollisionFeature represents the area of the tile covered by a single label.
@@ -8,19 +13,30 @@
  * @private
  */
 class CollisionFeature {
+    boxStartIndex: number;
+    boxEndIndex: number;
+
     /**
      * Create a CollisionFeature, adding its collision box data to the given collisionBoxArray in the process.
      *
-     * @param {Array<Point>} line The geometry the label is placed on.
-     * @param {Anchor} anchor The point along the line around which the label is anchored.
-     * @param {VectorTileFeature} feature The VectorTileFeature that this CollisionFeature was created for.
-     * @param {Array<string>} layerIDs The IDs of the layers that this CollisionFeature is a part of.
-     * @param {Object} shaped The text or icon shaping results.
-     * @param {number} boxScale A magic number used to convert from glyph metrics units to geometry units.
-     * @param {number} padding The amount of padding to add around the label edges.
-     * @param {boolean} alignLine Whether the label is aligned with the line or the viewport.
+     * @param line The geometry the label is placed on.
+     * @param anchor The point along the line around which the label is anchored.
+     * @param shaped The text or icon shaping results.
+     * @param boxScale A magic number used to convert from glyph metrics units to geometry units.
+     * @param padding The amount of padding to add around the label edges.
+     * @param alignLine Whether the label is aligned with the line or the viewport.
      */
-    constructor(collisionBoxArray, line, anchor, featureIndex, sourceLayerIndex, bucketIndex, shaped, boxScale, padding, alignLine, straight) {
+    constructor(collisionBoxArray: CollisionBoxArray,
+                line: Array<Point>,
+                anchor: Anchor,
+                featureIndex: number,
+                sourceLayerIndex: number,
+                bucketIndex: number,
+                shaped: Object,
+                boxScale: number,
+                padding: number,
+                alignLine: boolean,
+                straight: boolean) {
         const y1 = shaped.top * boxScale - padding;
         const y2 = shaped.bottom * boxScale + padding;
         const x1 = shaped.left * boxScale - padding;
@@ -39,12 +55,12 @@ class CollisionFeature {
 
                 if (straight) {
                     // used for icon labels that are aligned with the line, but don't curve along it
-                    const vector = line[anchor.segment + 1].sub(line[anchor.segment])._unit()._mult(length);
+                    const vector = line[anchor.segment + 1].sub(line[(anchor.segment : any)])._unit()._mult(length);
                     const straightLine = [anchor.sub(vector), anchor.add(vector)];
                     this._addLineCollisionBoxes(collisionBoxArray, straightLine, anchor, 0, length, height, featureIndex, sourceLayerIndex, bucketIndex);
                 } else {
                     // used for text labels that curve along a line
-                    this._addLineCollisionBoxes(collisionBoxArray, line, anchor, anchor.segment, length, height, featureIndex, sourceLayerIndex, bucketIndex);
+                    this._addLineCollisionBoxes(collisionBoxArray, line, anchor, (anchor.segment : any), length, height, featureIndex, sourceLayerIndex, bucketIndex);
                 }
             }
 
@@ -59,16 +75,20 @@ class CollisionFeature {
     /**
      * Create a set of CollisionBox objects for a line.
      *
-     * @param {Array<Point>} line
-     * @param {Anchor} anchor
-     * @param {number} labelLength The length of the label in geometry units.
-     * @param {Anchor} anchor The point along the line around which the label is anchored.
-     * @param {VectorTileFeature} feature The VectorTileFeature that this CollisionFeature was created for.
-     * @param {number} boxSize The size of the collision boxes that will be created.
-     *
+     * @param labelLength The length of the label in geometry units.
+     * @param anchor The point along the line around which the label is anchored.
+     * @param boxSize The size of the collision boxes that will be created.
      * @private
      */
-    _addLineCollisionBoxes(collisionBoxArray, line, anchor, segment, labelLength, boxSize, featureIndex, sourceLayerIndex, bucketIndex) {
+    _addLineCollisionBoxes(collisionBoxArray: CollisionBoxArray,
+                           line: Array<Point>,
+                           anchor: Anchor,
+                           segment: number,
+                           labelLength: number,
+                           boxSize: number,
+                           featureIndex: number,
+                           sourceLayerIndex: number,
+                           bucketIndex: number) {
         const step = boxSize / 2;
         const nBoxes = Math.floor(labelLength / step);
         // We calculate line collision boxes out to 300% of what would normally be our