1.0.500 • Published 9 months ago

storelocator v1.0.500

Weekly downloads
790
License
CC-BY-3.0
Repository
github
Last release
9 months ago

Project status

npm npm downloads

build

check types lint test

code coverage

documentation website

Use case

A webcomponent to serve a store locator via google maps.

Installation

Classical dom injection

You can simply download the compiled version as zip file here and inject it after needed dependencies:

<!--Inject downloaded file:
<script src="index.js"></script>
-->
<!--Or integrate via cdn:-->
<script
    src="https://torben.website/storelocator/data/distributionBundle/index.js"
></script>

The compiled bundle supports AMD, commonjs, commonjs2 and variable injection into given context (UMD) as export format: You can use a module bundler if you want.

Package managed and module bundled

If you are using npm as package manager you can simply add this tool to your package.json as dependency:

...
"dependencies": {
    ...
    "storelocator": "latest",
    ...
},
...

After updating your packages you can simply depend on this script and let a module bundler do the hard stuff or access it via an exported variable name in given context.

...
import storeLocatorAPI from 'storelocator'

// Default tag name is "store-locator".
storelocatorAPI.register(/*'my-store-locator-tag-name'*/)
...

Then inject component in html:

<store-locator></store-locator>

Examples

Adding some style to our store locator examples

store-locator {
    font-family: Roboto, Arial, sans-serif;

    display: block;

    width: 100%;
    height: 400px;

    margin: 0px;
    padding: 0px
}

.web-component-template {
    display: none;
}

store-locator > div {
    height: 100%;
}

.store-locator__input {
    margin-top: 9px;
    margin-left: 9px;

    width: 230px;
}

store-locator .gm-style-iw > div {
    width: 225px;
    height: 60px;
    padding: 5px;
}

Simple example

Download, register component and use new component.

<script
    src="https://torben.website/storelocator/data/distributionBundle/index.js"
></script>

<script>
    console.info('Register "store-locator" tag name.')

    storelocator.index.api.register()
</script>

<store-locator
    configuration="{
        applicationInterface: {
            // NOTE: You should use your own google maps application interface
            // key.
            key: 'AIzaSyBAoKgqF4XaDblkRP4-94BITpUKzB767LQ'
        }
    }"
>
    <input>
</store-locator>

Advanced example with all available (default) options

<store-locator
    configuration="{
        applicationInterface: {
            // NOTE: You should use your own google maps application interface
            // key.
            key: 'AIzaSyBAoKgqF4XaDblkRP4-94BITpUKzB767LQ'
        },
        ipToLocationApplicationInterface: {
            bounds: {
                northEast: {latitude: 55.12, longitude: 14.89},
                southWest: {latitude: 47.32, longitude: 5.50}
            },
            key: '11a62990a1424e894da6eec464a747e6'
        },

        defaultMarkerIconFileName:
            'https://via.placeholder.com/50/0099ff/ffffff.png',
        // Automatically generated stores with option: {stores: bounds}
        stores: [
            {
                address:
                    'Elgendorfer Str. 57, 56410 Montabaur, Deutschland',
                eMailAddress: 'info@fake-1.de',
                id: 1,
                latitude: 50.4356,
                longitude: 7.81226,
                name: '1 & 1 Telecom GmbH',
                phoneNumber: '+49 721 9600'
            },
            {
                address:
                    'Freiheitsstr.1a, 53842 Troisdorf, Deutschland',
                eMailAddress: '1a@demo.de',
                id: 2,
                latitude: 50.82791,
                longitude: 7.1219600000000005,
                name: '1A-Bike&Parts GmbH',
                phoneNumber: '02241 / 91 18 09 3',
                websiteURL: 'http://www.1a-bike.bike'
            },
            {
                address:
                    'Niederrheinische Str. 27, 34626 Neukirchen, Deutschland',
                eMailAddress: 'tfddfa@de.de',
                id: 3,
                latitude: 50.871640000000006,
                longitude: 9.337940000000001,
                name: '1a Fahrradservice',
                phoneNumber: '+49 (6694) 7878',
                websiteURL: 'http://www.1a-fahrradservice-diegelmann.de'
            },
            {
                address:
                    'Dener Strasse 73, 48653 Coesfeld, Deutschland',
                eMailAddress: '12345@example.org',
                id: 4,
                latitude: 51.93271000000001,
                longitude: 9.337940000000001,
                name: '2-Rad-Baumeister',
                phoneNumber: '+49 (2541) 2509',
                websiteURL: 'www.2rad-baumeister.de'
            },
            {
                address:
                    'Friedrichstr. 100, 47475 Kamp - Lintfort, Deutschland',
                eMailAddress: 'test@example.org',
                id: 5,
                latitude: 51.508750000000006,
                longitude: 6.553020000000001,
                name: '2 - Rad Behringer',
                phoneNumber: '02842 / 42 471',
                websiteURL: 'www.zweirad-behringer.de'
            },
            {
                address:
                    'Werster Str. 86, 32549 Bad Oeynhausen, Deutschland',
                eMailAddress: 'test@example.org',
                id: 6,
                latitude: 52.215630000000004,
                longitude: 8.785,
                name:
                    '2Rad Berger Fahrradhandel & Tankstelle Marcus Berger',
                phoneNumber: '+49 (5731) 28930',
                websiteURL: 'www.2radberger.de'
            },
            {
                address: 'Rauchstr. 16, 34454 Bad Arolsen, Deutschland',
                eMailAddress: 'test@example.org',
                id: 7,
                latitude: 51.38242,
                longitude: 9.01524,
                name: '2Rad Br\u00fcne',
                phoneNumber: '05691 / 2220',
                websiteURL: 'http://2rad-bruene.de'
            },
            {
                address: 'Schneiderstr.40, 46244 Bottrop, Deutschland',
                id: 8,
                latitude: 51.57477,
                longitude: 6.90406,
                name: '2 - Rad B\u00fcning',
                phoneNumber: '02045 / 57 38',
                websiteURL: 'http://www.2-rad-buening.de'
            },
            {
                address: 'Butenwall 63, 46325 Borken, Deutschland',
                eMailAddress: 'test@example.org',
                id: 9,
                latitude: 51.846050000000005,
                longitude: 6.8543,
                name: '2Rad Busch',
                phoneNumber: '+49 (2861) 2692',
                websiteURL: 'www.2rad-busch.de '
            },
            {
                address:
                    'Herzebrockerstrasse 12, 33378 Rheda-Wiedenbrück, Deutschland',
                eMailAddress: 'test@example.org',
                id: 10,
                latitude: 51.85799,
                longitude: 8.28283,
                name: '2-rad Butschko',
                phoneNumber: '05242 / 4 31 61',
                websiteURL: 'http://www.zweirad-butschko.de'
            }
        ],

        limit: {
            northEast: {latitude: 55.12, longitude: 14.89},
            southWest: {latitude: 47.32, longitude: 5.50}
        },
        map: {minZoom: 5, zoom: 9},

        search: {}
    }"
>
    <input
        bind-property-title="configuration.name"
        class="store-locator__input"
        placeholder="Please provide some search words"
        slot="input"
    />

    <a
        class="store-locator__link"
        href="https://www.google.com"
        slot="link"
    >Legal notes example</a>
</store-locator>
1.0.500

9 months ago

1.0.497

9 months ago

1.0.499

9 months ago

1.0.498

9 months ago

1.0.495

12 months ago

1.0.496

12 months ago

1.0.494

1 year ago

1.0.493

1 year ago

1.0.492

1 year ago

1.0.491

1 year ago

1.0.490

1 year ago

1.0.489

1 year ago

1.0.488

1 year ago

1.0.487

1 year ago

1.0.486

2 years ago

1.0.484

2 years ago

1.0.485

2 years ago

1.0.483

2 years ago

1.0.482

2 years ago

1.0.481

2 years ago

1.0.480

2 years ago

1.0.475

2 years ago

1.0.477

2 years ago

1.0.476

2 years ago

1.0.479

2 years ago

1.0.478

2 years ago

1.0.473

2 years ago

1.0.474

2 years ago

1.0.464

2 years ago

1.0.463

2 years ago

1.0.469

2 years ago

1.0.466

2 years ago

1.0.465

2 years ago

1.0.468

2 years ago

1.0.467

2 years ago

1.0.472

2 years ago

1.0.471

2 years ago

1.0.470

2 years ago

1.0.448

2 years ago

1.0.447

2 years ago

1.0.449

2 years ago

1.0.462

2 years ago

1.0.461

2 years ago

1.0.460

2 years ago

1.0.451

2 years ago

1.0.450

2 years ago

1.0.453

2 years ago

1.0.452

2 years ago

1.0.459

2 years ago

1.0.458

2 years ago

1.0.455

2 years ago

1.0.454

2 years ago

1.0.457

2 years ago

1.0.456

2 years ago

1.0.440

3 years ago

1.0.442

3 years ago

1.0.444

3 years ago

1.0.443

3 years ago

1.0.446

2 years ago

1.0.445

2 years ago

1.0.437

3 years ago

1.0.439

3 years ago

1.0.438

3 years ago

1.0.426

3 years ago

1.0.425

3 years ago

1.0.428

3 years ago

1.0.427

3 years ago

1.0.424

3 years ago

1.0.430

3 years ago

1.0.436

3 years ago

1.0.433

3 years ago

1.0.432

3 years ago

1.0.435

3 years ago

1.0.434

3 years ago

1.0.429

3 years ago

1.0.420

3 years ago

1.0.422

3 years ago

1.0.421

3 years ago

1.0.419

3 years ago

1.0.418

3 years ago

1.0.415

3 years ago

1.0.414

3 years ago

1.0.417

3 years ago

1.0.416

3 years ago

1.0.411

3 years ago

1.0.410

3 years ago

1.0.413

3 years ago

1.0.412

3 years ago

1.0.408

3 years ago

1.0.407

3 years ago

1.0.409

3 years ago

1.0.406

3 years ago

1.0.404

3 years ago

1.0.403

3 years ago

1.0.405

3 years ago

1.0.402

3 years ago

1.0.400

3 years ago

1.0.401

3 years ago

1.0.396

3 years ago

1.0.395

3 years ago

1.0.398

3 years ago

1.0.397

3 years ago

1.0.394

3 years ago

1.0.393

3 years ago

1.0.399

3 years ago

1.0.392

3 years ago

1.0.385

3 years ago

1.0.384

3 years ago

1.0.387

3 years ago

1.0.386

3 years ago

1.0.381

3 years ago

1.0.380

4 years ago

1.0.383

3 years ago

1.0.382

3 years ago

1.0.389

3 years ago

1.0.388

3 years ago

1.0.379

4 years ago

1.0.391

3 years ago

1.0.390

3 years ago

1.0.378

4 years ago

1.0.377

4 years ago

1.0.374

4 years ago

1.0.376

4 years ago

1.0.375

4 years ago

1.0.373

4 years ago

1.0.370

4 years ago

1.0.372

4 years ago

1.0.371

4 years ago

1.0.369

4 years ago

1.0.368

4 years ago

1.0.367

4 years ago

1.0.365

4 years ago

1.0.366

4 years ago

1.0.363

4 years ago

1.0.364

4 years ago

1.0.362

4 years ago

1.0.361

4 years ago

1.0.360

4 years ago

1.0.359

4 years ago

1.0.358

4 years ago

1.0.356

4 years ago

1.0.357

4 years ago

1.0.355

4 years ago

1.0.349

4 years ago

1.0.348

4 years ago

1.0.347

4 years ago

1.0.346

4 years ago

1.0.352

4 years ago

1.0.351

4 years ago

1.0.354

4 years ago

1.0.353

4 years ago

1.0.350

4 years ago

1.0.345

4 years ago

1.0.344

4 years ago

1.0.343

4 years ago

1.0.341

4 years ago

1.0.342

4 years ago

1.0.340

4 years ago

1.0.339

4 years ago

1.0.338

4 years ago

1.0.337

4 years ago

1.0.336

4 years ago

1.0.335

4 years ago

1.0.334

4 years ago

1.0.333

4 years ago

1.0.332

4 years ago

1.0.327

4 years ago

1.0.326

4 years ago

1.0.329

4 years ago

1.0.328

4 years ago

1.0.323

4 years ago

1.0.322

4 years ago

1.0.325

4 years ago

1.0.324

4 years ago

1.0.331

4 years ago

1.0.321

4 years ago

1.0.320

4 years ago

1.0.319

4 years ago

1.0.318

4 years ago

1.0.317

4 years ago

1.0.316

4 years ago

1.0.315

4 years ago

1.0.314

4 years ago

1.0.312

4 years ago

1.0.311

4 years ago

1.0.313

4 years ago

1.0.305

4 years ago

1.0.307

4 years ago

1.0.306

4 years ago

1.0.310

4 years ago

1.0.309

4 years ago

1.0.308

4 years ago

1.0.304

4 years ago

1.0.303

4 years ago

1.0.302

4 years ago

1.0.301

4 years ago

1.0.300

4 years ago

1.0.297

4 years ago

1.0.299

4 years ago

1.0.298

4 years ago

1.0.296

4 years ago

1.0.295

4 years ago

1.0.292

4 years ago

1.0.291

4 years ago

1.0.290

4 years ago

1.0.289

4 years ago

1.0.288

4 years ago

1.0.286

4 years ago

1.0.285

4 years ago

1.0.282

4 years ago

1.0.281

4 years ago

1.0.284

4 years ago

1.0.283

4 years ago

1.0.280

4 years ago

1.0.279

4 years ago

1.0.278

4 years ago

1.0.277

4 years ago

1.0.276

4 years ago

1.0.275

4 years ago

1.0.274

4 years ago

1.0.271

4 years ago

1.0.273

4 years ago

1.0.272

4 years ago

1.0.270

4 years ago

1.0.266

4 years ago

1.0.267

4 years ago

1.0.269

4 years ago

1.0.265

4 years ago

1.0.264

4 years ago

1.0.263

4 years ago

1.0.262

4 years ago

1.0.261

4 years ago

1.0.260

4 years ago

1.0.259

4 years ago

1.0.253

4 years ago

1.0.255

4 years ago

1.0.257

4 years ago

1.0.256

4 years ago

1.0.258

4 years ago

1.0.252

4 years ago

1.0.251

4 years ago

1.0.250

4 years ago

1.0.249

4 years ago

1.0.248

4 years ago

1.0.246

4 years ago

1.0.247

4 years ago

1.0.244

4 years ago

1.0.245

4 years ago

1.0.243

4 years ago

1.0.242

4 years ago

1.0.241

4 years ago

1.0.240

4 years ago

1.0.239

4 years ago

1.0.237

5 years ago

1.0.236

5 years ago

1.0.235

5 years ago

1.0.234

5 years ago

1.0.233

5 years ago

1.0.232

5 years ago

1.0.231

5 years ago

1.0.230

5 years ago

1.0.229

5 years ago

1.0.228

5 years ago

1.0.227

5 years ago

1.0.226

5 years ago

1.0.225

5 years ago

1.0.224

5 years ago

1.0.223

5 years ago

1.0.222

5 years ago

1.0.221

5 years ago

1.0.220

5 years ago

1.0.219

5 years ago

1.0.217

5 years ago

1.0.218

5 years ago

1.0.216

5 years ago

1.0.215

5 years ago

1.0.214

5 years ago

1.0.213

5 years ago

1.0.212

6 years ago

1.0.211

6 years ago

1.0.210

6 years ago

1.0.209

6 years ago

1.0.208

6 years ago

1.0.207

6 years ago

1.0.206

6 years ago

1.0.205

6 years ago

1.0.204

6 years ago

1.0.203

6 years ago

1.0.202

6 years ago

1.0.201

6 years ago

1.0.198

6 years ago

1.0.197

6 years ago

1.0.196

6 years ago

1.0.195

6 years ago

1.0.194

6 years ago

1.0.193

6 years ago

1.0.192

6 years ago

1.0.191

6 years ago

1.0.190

6 years ago

1.0.189

6 years ago

1.0.188

6 years ago

1.0.187

6 years ago

1.0.186

6 years ago

1.0.185

6 years ago

1.0.183

6 years ago

1.0.182

6 years ago

1.0.181

6 years ago

1.0.180

6 years ago

1.0.179

6 years ago

1.0.178

6 years ago

1.0.177

6 years ago

1.0.176

6 years ago

1.0.175

6 years ago

1.0.174

6 years ago

1.0.173

6 years ago

1.0.172

6 years ago

1.0.171

6 years ago

1.0.170

6 years ago

1.0.169

6 years ago

1.0.168

6 years ago

1.0.167

7 years ago

1.0.166

7 years ago

1.0.165

7 years ago

1.0.164

7 years ago

1.0.163

7 years ago

1.0.162

7 years ago

1.0.161

7 years ago

1.0.159

7 years ago

1.0.158

7 years ago

1.0.157

7 years ago

1.0.156

7 years ago

1.0.155

7 years ago

1.0.154

7 years ago

1.0.153

7 years ago

1.0.152

7 years ago

1.0.150

7 years ago

1.0.148

7 years ago

1.0.147

7 years ago

1.0.146

7 years ago

1.0.144

7 years ago

1.0.143

7 years ago

1.0.142

7 years ago

1.0.141

7 years ago

1.0.140

7 years ago

1.0.139

7 years ago

1.0.138

7 years ago

1.0.137

7 years ago

1.0.136

7 years ago

1.0.135

7 years ago

1.0.134

7 years ago

1.0.133

7 years ago

1.0.130

7 years ago

1.0.129

7 years ago

1.0.128

7 years ago

1.0.127

7 years ago

1.0.126

7 years ago

1.0.125

7 years ago

1.0.124

7 years ago

1.0.123

7 years ago

1.0.122

7 years ago

1.0.121

7 years ago

1.0.120

7 years ago

1.0.119

7 years ago

1.0.118

7 years ago

1.0.117

7 years ago

1.0.116

7 years ago

1.0.115

7 years ago

1.0.114

7 years ago

1.0.113

7 years ago

1.0.112

7 years ago

1.0.111

7 years ago

1.0.110

7 years ago

1.0.109

7 years ago

1.0.108

7 years ago

1.0.107

7 years ago

1.0.106

7 years ago

1.0.105

7 years ago

1.0.104

7 years ago

1.0.103

7 years ago

1.0.102

7 years ago

1.0.101

7 years ago

1.0.100

7 years ago

1.0.99

7 years ago

1.0.98

7 years ago

1.0.97

7 years ago

1.0.96

7 years ago

1.0.95

7 years ago

1.0.94

7 years ago

1.0.93

7 years ago

1.0.92

7 years ago

1.0.91

7 years ago

1.0.90

7 years ago

1.0.89

7 years ago

1.0.88

7 years ago

1.0.87

7 years ago

1.0.86

7 years ago

1.0.85

7 years ago

1.0.84

7 years ago

1.0.83

7 years ago

1.0.82

7 years ago

1.0.81

7 years ago

1.0.80

7 years ago

1.0.79

7 years ago

1.0.78

7 years ago

1.0.77

7 years ago

1.0.76

7 years ago

1.0.75

7 years ago

1.0.74

7 years ago

1.0.73

7 years ago

1.0.72

7 years ago

1.0.71

7 years ago

1.0.70

7 years ago

1.0.69

7 years ago

1.0.68

7 years ago

1.0.67

7 years ago

1.0.66

7 years ago

1.0.65

8 years ago

1.0.64

8 years ago

1.0.63

8 years ago

1.0.62

8 years ago

1.0.61

8 years ago

1.0.60

8 years ago

1.0.59

8 years ago

1.0.58

8 years ago

1.0.57

8 years ago

1.0.56

8 years ago

1.0.55

8 years ago

1.0.54

8 years ago

1.0.53

8 years ago

1.0.52

8 years ago

1.0.51

8 years ago

1.0.50

8 years ago

1.0.49

8 years ago

1.0.48

8 years ago

1.0.47

8 years ago

1.0.46

8 years ago

1.0.45

8 years ago

1.0.44

8 years ago

1.0.43

8 years ago

1.0.42

8 years ago

1.0.40

9 years ago

1.0.39

9 years ago

1.0.37

9 years ago

1.0.36

9 years ago

1.0.35

9 years ago

1.0.34

9 years ago

1.0.33

9 years ago

1.0.32

9 years ago

1.0.31

9 years ago

1.0.30

9 years ago

1.0.29

9 years ago

1.0.28

9 years ago

1.0.27

9 years ago

1.0.26

9 years ago

1.0.25

9 years ago

1.0.24

9 years ago

1.0.23

9 years ago

1.0.22

9 years ago

1.0.21

9 years ago

1.0.20

9 years ago

1.0.19

9 years ago

1.0.18

9 years ago

1.0.17

9 years ago

1.0.16

9 years ago

1.0.15

9 years ago

1.0.14

9 years ago

1.0.13

9 years ago

1.0.12

9 years ago

1.0.11

9 years ago

1.0.10

9 years ago

1.0.9

9 years ago

1.0.8

9 years ago

1.0.7

9 years ago

1.0.6

9 years ago

1.0.5

9 years ago

1.0.4

9 years ago