npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

callback-form-email-notifier

v1.0.16

Published

callback-form-email-notifier

Downloads

10

Readme

callback-form-email-notifier

BASED ON

  • "nette/mail": "2.4.3",
  • "nette/utils": "2.4.7",
  • "google/recaptcha": "~1.1"

We are in npm now! Simply execute this command to add plugin into your project:

npm install callback-form-email-notifier

INSTALLATION

At first, don't forget:

yarn install / nmp install
composer install
  1. copy dist/email/settings-example.ini to dist/email/settings.ini
  2. set all required values in dist/email/settings.ini
  3. import tc-email-notifier.js in your js-script where you need
  4. modify your webpack/grunt... script to copy dist/vendor and dist/email folders into your project

PATH EXPLANATION

  • vendor folder is required for working of backend script named tc-email-notifier.php, so this folder should be placed at the same level with it;
  • email folder stores backend script settings and email messages templates. if you successfulye it into another place don't forget to change variable $base_path in file tc-email-notifier.php;
  • default and working directory structure is shown in dist folder;

USAGE

For more info see working example in /example folder. You can build it with command

yarn dev \ npm run dev

Plugin required 2 objects for initialization: global settings and field settings.

global settings

let options = {
		formId: 'callback', /* id of callback form, where all fields and logic will be placed */
		backendUrl: 'tc-email-notifier.php', /* relative link to backend script, that will be executed after submit button pressed */
		isDebugMode: false, /* if true - some debug messages will be printed to console */
		addHiddenFields: true, /* if true - useragent, referrer, timezone, localtime, cookies will be send with all form data  */
		addGeolocation: true, /* if true - geolocation coords and google map will be send with all form data */
		addRecaptchaButton: true, /* if true - google recaptcha button 'i'm not robot' will be added */
		googleMapsApiKey: 'xxx', /* to get it, go to google developer console */
		googleReCaptchaApiKey: 'xxx', /* to get it, go to google developer console */
		onSuccess: (message) => {  alertify.alert(message); }, /* function that will be executed after form successfully submitted   */
		onError: (message) => {  alertify.alert(message); }, /* function that will be executed after form submitted with errors */
	};

field settings

typical input=text field:

let field = {
			titleTag: '<p class="title">Имя:</p>',
			name: 'name',
			id: 'name',
			type: 'text',
			placeholder: 'Введите свое имя',
			required: true,
			cssClass: 'name',
		};

checkbox and submit controls:

let controls = [{
			name: 'submit',
			id: 'submit',
			type: 'submit',
			role: 'submit',
			value: 'Отправить',
			parentClass: 'controls'
		},
		{
			titleTag: '<p class="is-checked">С <a href="#">условиями обработки персональных</a> данных согласен:</p>',
			name: 'is-checked',
			id: 'is-checked',
			type: 'checkbox',
			role: 'checkbox',
			required: true,
			parentClass: 'controls'
		}];

plugin init

new TcEmailNotifier(options, fields);