omarstreak

//oauth2 auth
chrome.identity.getAuthToken(
	{'interactive': true},
	function(){
	  //load Google's javascript client libraries
		window.gapi_onload = authorize;
		loadScript('https://apis.google.com/js/client.js');
	}
);

omarstreak

/* this file is the "app" file that loads the sdk and brings up the iframe */

function log() {
	console.log.apply(console, ['iframe-test'].concat(Array.prototype.slice.call(arguments)));
}

InboxSDK.load(1, 'iframe-test').then(function(sdk) {
	sdk.Compose.registerComposeViewHandler(function(composeView) {
		composeView.addButton({
			title: "iframe test",

omarstreak

function pasteText({replacementText, cursorContext, activeQuery}: {replacementText: string; cursorContext: CursorContext; activeQuery: string;}){
  // update text node content with replaced text
  const lastIndex = cursorContext.textBeforeCursor.lastIndexOf(activeQuery);
  cursorContext.textNode.textContent = cursorContext.textNodeContent.substring(0, lastIndex) + replacementText + cursorContext.textAfterCursor;

  const selection = document.getSelection();
  if(!selection) return;

  // put cursor at the end of the replaced text
  const range = document.createRange();

omarstreak

/* @flow */

/* this code heavily borrows from https://github.com/zurb/tribute */

export type CursorContext = {
  textNode: Node;
  textNodeParent: Node;
  textNodeContent: string;
  textBeforeCursor: string;
  textAfterCursor: string;

omarstreak

Kefir.merge([
  Kefir.fromEvents(input, 'keyup'),
  Kefir.fromEvents(input, 'input'),
  Kefir.fromEvents(input, 'click'),
  Kefir.fromEvents(input, 'focus')
])
.takeUntilBy(elementDestroyedObservable)
.debounce(100)
.onValue(() => /* do some stuff */)

omarstreak

import containByScreen from 'contain-by-screen';

function positionMenuAtCaret({menuContainer, cursorContext, activeQuery}: {menuContainer: HTMLElement; cursorContext: CursorContext; activeQuery: string;}){
  let textNode = cursorContext.textNode;
  const menuLeftEdgeCharaterPosition = Math.max(cursorContext.cursorCharacterPosition - activeQuery.length, 0);
  const range = document.createRange();
  range.setStart(textNode, menuLeftEdgeCharaterPosition);
  range.setEnd(textNode, menuLeftEdgeCharaterPosition);
  range.collapse(true);

omarstreak

/*! Streak launches new features to users every day. Users love our fast updates and quick response to bugs.
 * In order to accomplish this we use the popular InboxSDK library (www.inboxsdk.com). Its used by
 * several large organizations: 
 *   Dropbox (https://chrome.google.com/webstore/detail/dropbox-for-gmail-beta/dpdmhfocilnekecfjgimjdeckachfbec)
 *   HubSpot (https://chrome.google.com/webstore/detail/hubspot-sales/oiiaigjnkhngdbnoookogelabohpglmd)
 *   Stripe (https://chrome.google.com/webstore/detail/stripe-for-gmail/dhnddbohjigcdbcfjdngilgkdcbjjhna)
 *   Giphy (https://chrome.google.com/webstore/detail/giphy-for-gmail/andgibkjiikabclfdkecpmdkfanpdapf)
 *   Clearbit (https://chrome.google.com/webstore/detail/clearbit-connect-supercha/pmnhcgfcafcnkbengdcanjablaabjplo)
 * The use of the library is similar to using other popular javascript libraries like jQuery and Underscore
 *

omarstreak

div input {
  background-color: lightgreen;
  border-radius: 5px;
  padding: 0 5px;
}

omarstreak

var INSTALL_CHECK = 'chrome-extension://pnnfemgpilpdaojpnkjdgfgbnnjojfik/blank.png';

function isExtensionInstalled() {
	//we have different logic for Chrome vs Safari
	if(BrowserDetect.browser === 'Chrome'){
		// the Chrome extension makes an image "web accessible", so we have the page try to load that image.
		// if it loads successfully then the Streak extension is installed. If the image does not load successfully, then the image is not installed
		var img = new Image();
		img.onload = function() {
			clearInterval(installTimerId);

omarstreak

<div contenteditable="true">
  <div>
    hi <span contenteditable="false">&lt;contact_givenName&gt;</span>,
  </div>
  <div>
    How are you?
  </div>
</div>