dangerouse’s gists

dangerouse / host.html

Created July 20, 2023 20:56

Hosted CloudSponge Proxy Script

	<html>
	<head>
	<meta charset="utf-8">
	<!-- other meta tags... -->

	<!--
	Insert the following script tag to turn any page into a Proxy URL.
	It does the proxy function only if the user just completed the OAuth flow.
	-->
	<script src="https://api.cloudsponge.com/assets/proxy.js"></script>

dangerouse / picker-inject.js

Created April 16, 2022 17:01

Inject the Contact Picker via console

	(function(key, opts, s) {
	s = document.createElement('script');
	s.type = 'text/javascript';
	s.async = 1;
	// assign the src attribute
	s.src = "https://api.cloudsponge.com/widget/"+key+".js";
	// set the script to invoke a callback after it loads
	s.onload = function() {
	window.cloudsponge && cloudsponge.init(opts);
	}

dangerouse / ContactPicker.js

Last active September 22, 2021 18:37

CloudSponge Contact Picker in React 16.8+

	// The ContactPicker component handles the stuff you don't want to think about
	// when adding the CloudSponge Contact Picker to your React app or PWA.
	// Usage:
	// <ContactPicker cloudspongeKey="my-key-from-cloudsponge" options={{
	// selectionLimit: 5,
	// selectionLimitMessage: "That's too many contacts."
	// }}>
	// <button value="Add from Address Book" className="btn"></button>
	// </ContactPicker>
	// OR to launch the ContactPicker in response to an external setting/action:

dangerouse / cloudsponge-contact-picker.component.ts

Last active April 30, 2020 22:58

CloudSponge Angular component

	// Add the CloudSponge contact picker to your page and initialize it using this component.
	// options are passed as a property to the component.
	// You will still need to add a launch link to the page and a place to receive the selected contacts.
	// For example:
	// <cs-contact-picker [key]="MY-CLOUDSPONGE-KEY" [options]="{}">
	// <label for="to">To: <a class="cloudsponge-launch">Pick from my contacts</a></label>
	// <textarea id="to" class="cloudsponge-contacts"></textarea>
	// </cs-contact-picker>
	// Alternately, you may specify the options in your parent component:
	// import { CsContactPickerComponent } from './cs-contact-picker/cs-contact-picker.component';

dangerouse / body.html

Created October 7, 2019 19:32

CloudSponge Proxy URL for Instapage

	<p>Thank you for completing the OAuth flow.</p>
	<p>Click <a class="cs-force">here to verify that your Proxy URL is set up correctly</a>.</p>

dangerouse / bubble-address-book-connector.html

Last active September 18, 2019 20:05

Custom HTML to install the CloudSponge Address Book Widget on Bubble.io

	<script class="cloudsponge-pre-init-script">
	// Here's a video demontrating how to use this script in bubble.io:
	// https://drive.google.com/file/d/1B43kI0m_9IetVlB3KhuA4VZC2MOK_reV/view
	// This script can be added as a sibling of your launch link
	// and your textarea to receive the user's contacts and
	// it will add the CloudSponge Address Book Widget to your page.
	// Don't forget to:
	// 1. replace cloudspongeKey with your own key
	// from https://app.cloudsponge.com/
	// 2. optionally, initialize the cloudspongeOptions with your

dangerouse / selectize-after-choose.html

Created May 22, 2019 16:57

Adds the selected contacts from the CloudSponge widget to a selectize component

	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<title>CloudSponge Selectize Example</title>
	<!-- Selectize styles -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/css/selectize.default.css" type="text/css">
	<style>
	/**
	* Extra styles required to format emails nicely inside the selectize input

dangerouse / CloudSpongeWidget.jsx

Last active September 21, 2021 19:29

CloudSponge - Example React Component

	import React from 'react'

	// Simple React Component that manages adding the cloudsponge object to the page
	// and initializing it with the options that were passed through.
	// props:
	// * cloudspongeKey (required): your widget key from your CloudSponge account https://app.cloudsponge.com/app
	// * options (optional): any javascript options you wish to pass to configure the cloudpsonge object
	//
	// For example, you can use the component like so:
	// import CloudSpongeWidget from './CloudSpongeWidget'

dangerouse / 100_contacts.csv

Last active April 18, 2018 16:51

100 Sample contacts for testing

We can make this file beautiful and searchable if this error is corrected: Unclosed quoted field in line 1.

"Title","First Name","Middle Name","Last Name","Suffix","Company","Department","Job Title","Business Street","Business Street 2","Business Street 3","Business City","Business State","Business Postal Code","Business Country/Region","Home Street","Home Street 2","Home Street 3","Home City","Home State","Home Postal Code","Home Country/Region","Other Street","Other Street 2","Other Street 3","Other City","Other State","Other Postal Code","Other Country/Region","Assistant's Phone","Business Fax","Business Phone","Business Phone 2","Callback","Car Phone","Company Main Phone","Home Fax","Home Phone","Home Phone 2","ISDN","Mobile Phone","Other Fax","Other Phone","Pager","Primary Phone","Radio Phone","TTY/TDD Phone","Telex","Account","Anniversary","Assistant's Name","Billing Information","Birthday","Business Address PO Box","Categories","Children","Directory Server","E-mail Address","E-mail Type","E-mail Display Name","E-mail 2 Address","E-mail 2 Type","E-mail 2 Display Name","E-mail 3 Address","E-mail 3 Type","E-mai

dangerouse / unresponsive-desktop.html

Created September 29, 2017 20:53

CloudSponge Widget Sample - Theme: unresponsive-desktop

	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1.0">
	<title>Unresponsive Desktop Example</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

	<script src="//api.cloudsponge.com/widget/localhost-only.js"></script>

Graeme Rouse dangerouse