Skip to content

Commit b740f4d

Browse files
PaulLeCamPaulLeCam
committed
Various improvements
1 parent 7c648e0 commit b740f4d

13 files changed

+25439
-25424
lines changed

‎example/simple.js renamed to ‎example/js/dependencies.js

+25,307-25,385
Large diffs are not rendered by default.

‎example/js/simple.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
2+
var Map, Marker, Popup, SimpleExample, TileLayer, em, p, react, strong, _ref, _ref1;
3+
4+
react = require("react");
5+
6+
_ref = react.DOM, p = _ref.p, strong = _ref.strong, em = _ref.em;
7+
8+
_ref1 = require("react-leaflet"), Map = _ref1.Map, TileLayer = _ref1.TileLayer, Marker = _ref1.Marker, Popup = _ref1.Popup;
9+
10+
SimpleExample = react.createClass({
11+
displayName: "SimpleExample",
12+
render: function() {
13+
return Map({
14+
center: [51.505, -0.09],
15+
zoom: 13
16+
}, TileLayer({
17+
url: "http://{s}.tile.osm.org/{z}/{x}/{y}.png",
18+
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
19+
}), Marker({
20+
position: [51.505, -0.09]
21+
}, Popup(null, p(null, strong(null, "Hello"), em(null, " World")))));
22+
}
23+
});
24+
25+
react.renderComponent(SimpleExample(), document.getElementById("content"));
26+
27+
28+
29+
},{"react":undefined,"react-leaflet":undefined}]},{},[1]);

‎example/simple.coffee

+5-6
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,19 @@
11
react = require "react"
2-
L = require "../src"
3-
42
{p, strong, em} = react.DOM
3+
{Map, TileLayer, Marker, Popup} = require "react-leaflet"
54

65
SimpleExample = react.createClass
76
displayName: "SimpleExample"
87
render: ->
9-
L.Map
8+
Map
109
center: [51.505, -0.09]
1110
zoom: 13
12-
L.TileLayer
11+
TileLayer
1312
url: "http://{s}.tile.osm.org/{z}/{x}/{y}.png"
1413
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
15-
L.Marker
14+
Marker
1615
position: [51.505, -0.09]
17-
L.Popup null,
16+
Popup null,
1817
p null,
1918
strong null, "Hello"
2019
em null, " World"

‎example/simple.htm

+2-1
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
</head>
1717
<body>
1818
<div id="content"></div>
19-
<script src="/simple.js"></script>
19+
<script src="/js/dependencies.js"></script>
20+
<script src="/js/simple.js"></script>
2021
</body>
2122
</html>

‎gulpfile.coffee

+20-5
Original file line numberDiff line numberDiff line change
@@ -6,28 +6,43 @@ coffeeify = require "coffeeify"
66
rimraf = require "rimraf"
77
react = require "react"
88

9-
gulp.task "clean", (cb) ->
9+
gulp.task "clean:lib", (cb) ->
1010
rimraf "./lib", cb
1111

12-
gulp.task "compile", ["clean"], ->
12+
gulp.task "compile", ["clean:lib"], ->
1313
gulp.src "./src/**/*"
1414
.pipe $.coffee(bare: yes).on "error", $.util.log
1515
.pipe gulp.dest "./lib"
1616

17-
gulp.task "example:bundle", ->
17+
gulp.task "example:deps", ->
18+
browserify()
19+
.require "react"
20+
.require "react/addons"
21+
.require "leaflet"
22+
.require "./", expose: "react-leaflet"
23+
.bundle()
24+
.pipe source "dependencies.js"
25+
.pipe gulp.dest "./example/js"
26+
27+
gulp.task "example:simple", ->
1828
browserify
1929
entries: "./example/simple.coffee"
2030
extensions: [".coffee"]
31+
bundleExternal: no
2132
.transform coffeeify
2233
.bundle()
2334
.pipe source "simple.js"
24-
.pipe gulp.dest "./example"
35+
.pipe gulp.dest "./example/js"
2536

2637
gulp.task "example:server", ->
2738
gulp.src "./example"
2839
.pipe $.webserver()
2940

30-
gulp.task "example", ["example:bundle", "example:server"]
41+
gulp.task "example", [
42+
"example:deps"
43+
"example:simple"
44+
"example:server"
45+
]
3146

3247
gulp.task "watch", ["compile"], ->
3348
gulp.watch "./src/**/*", ["compile"]

‎lib/Map.js

+12-14
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1-
var Map, Type, div, latlngBoundsType, latlngType, leaflet, react, uniqueId;
1+
var Map, Type, currentId, div, latlngBoundsType, latlngType, leaflet, react;
22

3-
react = require("react");
3+
react = require("react/addons");
44

55
leaflet = require("leaflet");
66

7-
uniqueId = require("lodash-node/modern/utilities/uniqueId");
8-
97
Type = react.PropTypes;
108

119
latlngType = require("./types/latlng");
@@ -14,11 +12,13 @@ latlngBoundsType = require("./types/latlngBounds");
1412

1513
div = react.DOM.div;
1614

15+
currentId = 0;
16+
1717
Map = react.createClass({
1818
displayName: "Map",
1919
statics: {
2020
uid: function() {
21-
return uniqueId("map");
21+
return "map" + (++currentId);
2222
}
2323
},
2424
propTypes: {
@@ -41,17 +41,15 @@ Map = react.createClass({
4141
});
4242
},
4343
render: function() {
44-
var children;
45-
children = {};
46-
react.Children.forEach(this.props.children, (function(_this) {
47-
return function(child) {
48-
child.props.map = _this.state.map;
49-
return children[uniqueId("child")] = child;
50-
};
51-
})(this));
5244
return div({
5345
id: this.state.id
54-
}, children);
46+
}, react.Children.map(this.props.children, (function(_this) {
47+
return function(child) {
48+
return react.addons.cloneWithProps(child, {
49+
map: _this.state.map
50+
});
51+
};
52+
})(this)));
5553
}
5654
});
5755

‎lib/Marker.js

+13-3
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
1-
var Type, latlngType, leaflet, react;
1+
var Type, latlngType, leaflet, noscript, react;
22

3-
react = require("react");
3+
react = require("react/addons");
44

55
leaflet = require("leaflet");
66

77
Type = react.PropTypes;
88

99
latlngType = require("./types/latlng");
1010

11+
noscript = react.DOM.noscript;
12+
1113
module.exports = react.createClass({
1214
displayName: "Marker",
1315
propTypes: {
@@ -22,6 +24,14 @@ module.exports = react.createClass({
2224
if (this.props.map) {
2325
this.state.marker.addTo(this.props.map);
2426
}
25-
return null;
27+
return noscript(null, react.Children.map(this.props.children, (function(_this) {
28+
return function(child) {
29+
return react.addons.cloneWithProps(child, {
30+
map: _this.props.map,
31+
layer: _this.props.layer,
32+
marker: _this.state.marker
33+
});
34+
};
35+
})(this)));
2636
}
2737
});

‎lib/Popup.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
var leaflet, react;
2+
3+
react = require("react");
4+
5+
leaflet = require("leaflet");
6+
7+
module.exports = react.createClass({
8+
displayName: "Popup",
9+
getInitialState: function() {
10+
return {
11+
popup: leaflet.popup(this.props, this.props.layer)
12+
};
13+
},
14+
render: function() {
15+
var content;
16+
if (this.props.children) {
17+
content = react.renderComponentToString(this.props.children);
18+
if (this.props.marker) {
19+
this.props.marker.bindPopup(content);
20+
} else {
21+
this.state.popup.setContent(content);
22+
if (this.props.position) {
23+
this.state.popup.setLatLng(this.props.position);
24+
}
25+
if (this.props.map) {
26+
this.state.popup.openOn(this.props.map);
27+
}
28+
}
29+
}
30+
return null;
31+
}
32+
});

‎lib/TileLayer.js

+14-5
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,34 @@
1-
var Type, leaflet, react;
1+
var Type, leaflet, noscript, react;
22

3-
react = require("react");
3+
react = require("react/addons");
44

55
leaflet = require("leaflet");
66

77
Type = react.PropTypes;
88

9+
noscript = react.DOM.noscript;
10+
911
module.exports = react.createClass({
1012
displayName: "TileLayer",
1113
propTypes: {
1214
url: Type.string.isRequired
1315
},
1416
getInitialState: function() {
1517
return {
16-
tile: leaflet.tileLayer(this.props.url, this.props)
18+
tileLayer: leaflet.tileLayer(this.props.url, this.props)
1719
};
1820
},
1921
render: function() {
2022
if (this.props.map) {
21-
this.state.tile.addTo(this.props.map);
23+
this.state.tileLayer.addTo(this.props.map);
2224
}
23-
return null;
25+
return noscript(null, react.Children.map(this.props.children, (function(_this) {
26+
return function(child) {
27+
return react.addons.cloneWithProps(child, {
28+
map: _this.props.map,
29+
layer: _this.state.tileLayer
30+
});
31+
};
32+
})(this)));
2433
}
2534
});

‎lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -12,5 +12,6 @@ module.exports = {
1212
setIconDefaultImagePath: setIconDefaultImagePath,
1313
Marker: require("./Marker"),
1414
Map: require("./Map"),
15+
Popup: require("./Popup"),
1516
TileLayer: require("./TileLayer")
1617
};

‎src/Map.coffee

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
react = require "react/addons"
22
leaflet = require "leaflet"
3-
uniqueId = require "lodash-node/modern/utilities/uniqueId"
43

54
Type = react.PropTypes
65
latlngType = require "./types/latlng"
76
latlngBoundsType = require "./types/latlngBounds"
87

98
{div} = react.DOM
9+
currentId = 0
1010

1111
Map = react.createClass
1212
displayName: "Map"
1313

1414
statics:
15-
uid: ->
16-
uniqueId "map"
15+
uid: -> "map#{ ++currentId }"
1716

1817
propTypes:
1918
center: latlngType

‎src/Marker.coffee

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
react = require "react"
1+
react = require "react/addons"
22
leaflet = require "leaflet"
33

44
Type = react.PropTypes

‎src/TileLayer.coffee

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
react = require "react"
1+
react = require "react/addons"
22
leaflet = require "leaflet"
33

44
Type = react.PropTypes

0 commit comments

Comments
 (0)