Skip to content

Commit aaf94ad

Browse files
frankpaganfrankpagan
committed
feat: Supports using @cocreate/api functions for request and response data as well as rendering
1 parent 5bcdbbe commit aaf94ad

File tree

9 files changed

+377
-1263
lines changed

9 files changed

+377
-1263
lines changed

‎demo/current-location.html‎

Lines changed: 107 additions & 109 deletions
Original file line numberDiff line numberDiff line change
@@ -1,124 +1,122 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7-
<title>Current Location | CoCreate</title>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<title>Current Location | CoCreate</title>
88

9-
<script src="https://kit.fontawesome.com/99ba925095.js"></script>
10-
<link
11-
rel="stylesheet"
12-
href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
13-
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/"
14-
crossorigin="anonymous" />
9+
<script src="https://kit.fontawesome.com/99ba925095.js"></script>
10+
<link
11+
rel="stylesheet"
12+
href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
13+
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/"
14+
crossorigin="anonymous" />
1515

16-
<link rel="manifest" href="/manifest.webmanifest" />
17-
</head>
16+
<link rel="manifest" href="/manifest.webmanifest" />
17+
</head>
1818

19-
<style>
20-
tbody > tr:hover {
21-
background: #fafafa;
22-
}
23-
th,
24-
td {
25-
border-bottom: 1px solid #e0e0e0;
26-
padding: 10px;
27-
text-align: left;
28-
}
29-
</style>
19+
<style>
20+
tbody > tr:hover {
21+
background: #fafafa;
22+
}
23+
th,
24+
td {
25+
border-bottom: 1px solid #e0e0e0;
26+
padding: 10px;
27+
text-align: left;
28+
}
29+
</style>
3030

31-
<body>
32-
<div
33-
geolocation="true"
34-
array="users"
35-
object="$user_id"
36-
key="currentLocation"
37-
data-icon="optional field name in db"
38-
data-icon_type="optional svg or png?"
39-
data-icon_value="optional icon value in svg or png or binary? "
40-
read="false"
41-
data-map_id="0"
42-
localstorage-get="user_id"
43-
localstorage-key="userId"></div>
44-
<!--object="5ee389873e956152355a3447" -->
31+
<body>
32+
<div
33+
geolocation="true"
34+
array="users"
35+
object="$user_id"
36+
key="currentLocation"
37+
data-icon="optional field name in db"
38+
data-icon_type="optional svg or png?"
39+
data-icon_value="optional icon value in svg or png or binary? "
40+
read="false"
41+
data-map_id="0"
42+
localstorage-get="user_id"
43+
localstorage-key="userId"></div>
44+
<!--object="5ee389873e956152355a3447" -->
4545

46-
<table class="width:100% margin:15px">
47-
<thead>
48-
<tr>
49-
<th><h3>User Name</h3></th>
50-
<th><h3>CurrentLocation</h3></th>
51-
<th><h3>Document_id</h3></th>
52-
</tr>
53-
</thead>
54-
<tbody
55-
array="users"
56-
filter-key=""
57-
filter-value=""
58-
filter-limit=""
59-
filter-sort-key="name"
60-
filter-sort-direction="asc"
61-
state_to="me1234"
62-
render-selector="[template]">
63-
<tr template>
64-
<td class="name">
65-
<h4 state_id="me1234" key="name">No Name</h4>
66-
</td>
67-
<td>
68-
<h4 state_id="me1234" key="currentLocation">corrds</h4>
69-
</td>
70-
<td><h4 state_id="me1234" key="_id">Document_id</h4></td>
71-
</tr>
72-
</tbody>
73-
</table>
46+
<table class="width:100% margin:15px">
47+
<thead>
48+
<tr>
49+
<th><h3>User Name</h3></th>
50+
<th><h3>CurrentLocation</h3></th>
51+
<th><h3>Document_id</h3></th>
52+
</tr>
53+
</thead>
54+
<tbody
55+
array="users"
56+
filter-query-key=""
57+
filter-query-value=""
58+
filter-limit=""
59+
filter-sort-key="name"
60+
filter-sort-direction="asc"
61+
state_to="me1234"
62+
render-selector="[template]">
63+
<tr template>
64+
<td class="name">
65+
<h4 state_id="me1234" key="name">No Name</h4>
66+
</td>
67+
<td>
68+
<h4 state_id="me1234" key="currentLocation">corrds</h4>
69+
</td>
70+
<td><h4 state_id="me1234" key="_id">Document_id</h4></td>
71+
</tr>
72+
</tbody>
73+
</table>
7474

75-
<div
76-
template_id="datatable"
77-
filter-key="currentLocation.coords"
78-
filter-operator="$geoWithin"
79-
filter-value="[ [-73, 40], 100 ]"
80-
filter-value-type="raw"
81-
filter-type="$center"></div>
82-
<!--filter-value="[ [-73, 40], 100 ]"-->
83-
<!-- filter-value="[ [-73.92709975146482, 40.6969990195153],[-73.88944153689573, 40.70675942292492] ]"-->
75+
<div
76+
template_id="datatable"
77+
filter-query-key="currentLocation.coords.$geoWithin"
78+
filter-query-value="[ [-73, 40], 100 ]"
79+
filter-value-type="raw"
80+
filter-type="$center"></div>
81+
<!--filter-value="[ [-73, 40], 100 ]"-->
82+
<!-- filter-query-value="[ [-73.92709975146482, 40.6969990195153],[-73.88944153689573, 40.70675942292492] ]"-->
8483

85-
<input
86-
type="hidden"
87-
filter-key="currentLocation"
88-
filter-operator="$geoWithin"
89-
filter-value-type="polygon"
90-
value="<coordinates>" />
84+
<input
85+
type="hidden"
86+
filter-query-key="currentLocation.$geoWithin"
87+
filter-value-type="polygon"
88+
value="<coordinates>" />
9189

92-
<input
93-
type="text"
94-
class="floating-label"
95-
placeholder="Text"
96-
key="name"
97-
array="users"
98-
object="" />
90+
<input
91+
type="text"
92+
class="floating-label"
93+
placeholder="Text"
94+
key="name"
95+
array="users"
96+
object="" />
9997

100-
<input
101-
type="text"
102-
class="floating-label"
103-
placeholder="icon"
104-
key="icon"
105-
data-animator="icon" />
98+
<input
99+
type="text"
100+
class="floating-label"
101+
placeholder="icon"
102+
key="icon"
103+
data-animator="icon" />
106104

107-
<input type="text" />
108-
<div
109-
id="map"
110-
class="google_map"
111-
data-map_id="0"
112-
style="width: 100%; height: 300px"></div>
105+
<input type="text" />
106+
<div
107+
id="map"
108+
class="google_map"
109+
data-map_id="0"
110+
style="width: 100%; height: 300px"></div>
113111

114-
<script type="module">
115-
import { initMapSettings } from "../src/index.js";
116-
initMapSettings();
117-
</script>
118-
<script
119-
type="text/javascript"
120-
src="../dist/CoCreate-google-maps.js"></script>
112+
<script type="module">
113+
import { initMapSettings } from "../src/index.js";
114+
initMapSettings();
115+
</script>
116+
<script
117+
type="text/javascript"
118+
src="../dist/CoCreate-google-maps.js"></script>
121119

122-
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDCxZ_RRXPQ2Uqufgo39daiXZeQZQpIAiM&libraries=places&callback=initMapSettings"></script>
123-
</body>
120+
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDCxZ_RRXPQ2Uqufgo39daiXZeQZQpIAiM&libraries=places&callback=initMapSettings"></script>
121+
</body>
124122
</html>

0 commit comments

Comments
 (0)