Andrew Cole captaincole

Long time listener, first time caller.

captaincole / job-listing-vote.tsx

Created February 27, 2018 21:50

	import {Component, Element, Prop, State} from '@stencil/core';
	import firebase from 'firebase';

	@Component({
	tag: 'job-item',
	styleUrl: 'job-item.scss'
	})
	export class JobItem {

	@Prop() job: any;

captaincole / firebase-config.ts

Created February 27, 2018 21:43

	// Replace With Your Config
	export var firebaseConfig = {
	apiKey: "<api-key>",
	authDomain: "<auth-domain>",
	databaseURL: "<database-url>",
	projectId: "<project-id>",
	storageBucket: "<storage-bucket>",
	messagingSenderId: "<messging-sender-id>"
	}

captaincole / firebase-my-app.tsx

Created February 27, 2018 21:39

	import '@ionic/core';
	import '@stencil/core';
	import { Component, Prop, Listen } from '@stencil/core';
	import { ToastController } from '@ionic/core';
	import { firebaseConfig } from '../../helpers/config';
	import firebase from 'firebase';

	@Component({
	tag: 'my-app',
	styleUrl: 'my-app.scss'

captaincole / firebase-default-config.html

Created February 27, 2018 21:34

	<script src="https://www.gstatic.com/firebasejs/4.10.1/firebase.js"></script>
	<script>
	// Initialize Firebase
	var config = {
	apiKey: "<api-key>",
	authDomain: "<authDomain>",
	databaseURL: "<databaseUrl>",
	projectId: "<project-id>",
	storageBucket: "<storage-bucketid>",
	messagingSenderId: "<sender-id>"

captaincole / side-menu.index.html

Created February 24, 2018 05:37

	//index.html
	...
	<side-menu>
	</side-menu>
	</body>
	<script>
	document.addEventListener('toggleBackground', function hideMenu(e) {
	console.log('Event Recieved');
	document.getElementsByTagName('side-menu')[0].style.display = 'none';
	});

captaincole / side-menu-event.listen.js

Created February 24, 2018 05:35

captaincole / side-menu.events.comp.tsx

Created February 24, 2018 05:32

	// side-menu.tsx
	@Event() backgroundToggle: EventEmitter;
	menuToggle(e) {
	console.log('Background toggled menu', e);
	this.backgroundToggle.emit(e);
	}

	render() {
	return (
	<div class="side-menu">

captaincole / side-menu.comp.css

Created February 24, 2018 05:29

	.side-menu {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: 20;
	background-color: transparent !important;
	padding: 0;
	}

captaincole / side-menu.comp.tsx

Created February 24, 2018 05:26

captaincole / side-menu.config.js

Created February 24, 2018 05:22

	// index.html with transpiler
	@Listen('backgroundToggle')
	function toggleBackground(e) {
	console.log('recieved event', e);
	document.getElementsByTagName('side-menu')[0].style.display = 'none';
	}