Initial commit

Author: getdave

.editorconfig

@@ -0,0 +1,21 @@
+# This file is for unifying the coding style for different editors and IDEs
+# editorconfig.org
+
+# WordPress Coding Standards
+# https://make.wordpress.org/core/handbook/coding-standards/
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+indent_style = tab
+
+[*.yml]
+indent_style = space
+indent_size = 2
+
+[*.md]
+trim_trailing_whitespace = false

.eslintignore

@@ -0,0 +1,9 @@
+**/*.min.js
+**/*.build.js
+**/node_modules/**
+**/vendor/**
+build
+coverage
+cypress
+node_modules
+vendor

.eslintrc.json

@@ -0,0 +1,192 @@
+{
+	"root": true,
+	"parser": "babel-eslint",
+	"extends": [
+		"wordpress",
+		"plugin:react/recommended",
+		"plugin:jsx-a11y/recommended",
+		"plugin:jest/recommended"
+	],
+	"env": {
+		"browser": false,
+		"es6": true,
+		"node": true,
+		"mocha": true,
+		"jest/globals": true
+	},
+	"parserOptions": {
+		"sourceType": "module",
+		"ecmaFeatures": {
+			"jsx": true
+		}
+	},
+	"globals": {
+		"wp": true,
+		"wpApiSettings": true,
+		"window": true,
+		"document": true
+	},
+	"plugins": ["react", "jsx-a11y", "jest"],
+	"settings": {
+		"react": {
+			"pragma": "wp"
+		}
+	},
+	"rules": {
+		"array-bracket-spacing": ["error", "always"],
+		"brace-style": ["error", "1tbs"],
+		"camelcase": ["error", { "properties": "never" }],
+		"comma-dangle": ["error", "always-multiline"],
+		"comma-spacing": "error",
+		"comma-style": "error",
+		"computed-property-spacing": ["error", "always"],
+		"constructor-super": "error",
+		"dot-notation": "error",
+		"eol-last": "error",
+		"eqeqeq": "error",
+		"func-call-spacing": "error",
+		"indent": ["error", "tab", { "SwitchCase": 1 }],
+		"jsx-a11y/label-has-for": [
+			"error",
+			{
+				"required": "id"
+			}
+		],
+		"jsx-a11y/media-has-caption": "off",
+		"jsx-a11y/no-noninteractive-tabindex": "off",
+		"jsx-a11y/role-has-required-aria-props": "off",
+		"jsx-quotes": "error",
+		"key-spacing": "error",
+		"keyword-spacing": "error",
+		"lines-around-comment": "off",
+		"no-alert": "error",
+		"no-bitwise": "error",
+		"no-caller": "error",
+		"no-console": "error",
+		"no-const-assign": "error",
+		"no-debugger": "error",
+		"no-dupe-args": "error",
+		"no-dupe-class-members": "error",
+		"no-dupe-keys": "error",
+		"no-duplicate-case": "error",
+		"no-duplicate-imports": "error",
+		"no-else-return": "error",
+		"no-eval": "error",
+		"no-extra-semi": "error",
+		"no-fallthrough": "error",
+		"no-lonely-if": "error",
+		"no-mixed-operators": "error",
+		"no-mixed-spaces-and-tabs": "error",
+		"no-multiple-empty-lines": ["error", { "max": 1 }],
+		"no-multi-spaces": "error",
+		"no-multi-str": "off",
+		"no-negated-in-lhs": "error",
+		"no-nested-ternary": "error",
+		"no-redeclare": "error",
+		"no-restricted-syntax": [
+			"error",
+			{
+				"selector":
+					"ImportDeclaration[source.value=/^@wordpress\\u002F.+\\u002F/]",
+				"message": "Path access on WordPress dependencies is not allowed."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^blocks$/]",
+				"message": "Use @wordpress/blocks as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^components$/]",
+				"message": "Use @wordpress/components as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^date$/]",
+				"message": "Use @wordpress/date as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^editor$/]",
+				"message": "Use @wordpress/editor as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^element$/]",
+				"message": "Use @wordpress/element as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^i18n$/]",
+				"message": "Use @wordpress/i18n as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^data$/]",
+				"message": "Use @wordpress/data as import path instead."
+			},
+			{
+				"selector": "ImportDeclaration[source.value=/^utils$/]",
+				"message": "Use @wordpress/utils as import path instead."
+			},
+			{
+				"selector":
+					"CallExpression[callee.name=/^__|_n|_x$/]:not([arguments.0.type=/^Literal|BinaryExpression$/])",
+				"message": "Translate function arguments must be string literals."
+			},
+			{
+				"selector":
+					"CallExpression[callee.name=/^_n|_x$/]:not([arguments.1.type=/^Literal|BinaryExpression$/])",
+				"message": "Translate function arguments must be string literals."
+			},
+			{
+				"selector":
+					"CallExpression[callee.name=_nx]:not([arguments.2.type=/^Literal|BinaryExpression$/])",
+				"message": "Translate function arguments must be string literals."
+			}
+		],
+		"no-shadow": "error",
+		"no-undef": "error",
+		"no-undef-init": "error",
+		"no-unreachable": "error",
+		"no-unsafe-negation": "error",
+		"no-unused-expressions": "error",
+		"no-unused-vars": "error",
+		"no-useless-computed-key": "error",
+		"no-useless-constructor": "error",
+		"no-useless-return": "error",
+		"no-var": "error",
+		"no-whitespace-before-property": "error",
+		"object-curly-spacing": ["error", "always"],
+		"padded-blocks": ["error", "never"],
+		"prefer-const": "error",
+		"quote-props": ["error", "as-needed"],
+		"react/display-name": "off",
+		"react/jsx-curly-spacing": [
+			"error",
+			{
+				"when": "always",
+				"children": true
+			}
+		],
+		"react/jsx-equals-spacing": "error",
+		"react/jsx-indent": ["error", "tab"],
+		"react/jsx-indent-props": ["error", "tab"],
+		"react/jsx-key": "error",
+		"react/jsx-tag-spacing": "error",
+		"react/no-children-prop": "off",
+		"react/no-find-dom-node": "warn",
+		"react/prop-types": "off",
+		"semi": "error",
+		"semi-spacing": "error",
+		"space-before-blocks": ["error", "always"],
+		"space-before-function-paren": ["error", "never"],
+		"space-in-parens": ["error", "always"],
+		"space-infix-ops": ["error", { "int32Hint": false }],
+		"space-unary-ops": [
+			"error",
+			{
+				"overrides": {
+					"!": true
+				}
+			}
+		],
+		"template-curly-spacing": ["error", "always"],
+		"valid-jsdoc": ["error", { "requireReturn": false }],
+		"valid-typeof": "error",
+		"yoda": "off"
+	}
+}

.gitignore

@@ -0,0 +1,6 @@
+node_modules
+
+## Uncomment line below if you prefer to
+## keep compiled files out of version control
+# dist/
+.DS_Store

README.md

@@ -0,0 +1 @@
+# Alternative Homepage Templates

package.json

@@ -0,0 +1,13 @@
+{
+  "name": "getdave-sbe-cgb-guten-block",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "start": "cgb-scripts start",
+    "build": "cgb-scripts build",
+    "eject": "cgb-scripts eject"
+  },
+  "dependencies": {
+    "cgb-scripts": "1.15.0"
+  }
+}

plugin.php

@@ -0,0 +1,23 @@
+<?php
+/**
+ * Plugin Name: Standalone Block Editor Demo
+ * Plugin URI: https://aheadcreative.co.uk
+ * Description: a @getdave demo of a standalone Gutenberg Block Editor instance.
+ * Author: @getdave
+ * Author URI: https://aheadcreative.co.uk
+ * Version: 1.0.0
+ * License: GPL2+
+ * License URI: https://www.gnu.org/licenses/gpl-2.0.txt
+ *
+ * @package GSBE
+ */
+
+// Exit if accessed directly.
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+/**
+ * Block Initializer.
+ */
+require_once plugin_dir_path( __FILE__ ) . 'src/init.php';

src/blocks.js

@@ -0,0 +1,18 @@
+/**
+ * Gutenberg Blocks
+ *
+ * All blocks related JavaScript files should be imported here.
+ * You can create a new block folder in this dir and include code
+ * for that block here as well.
+ *
+ * All blocks should be included here since this is the file that
+ * Webpack is compiling as the input file.
+ */
+
+import './contact-section/block.js';
+import './intro-header-section/block.js';
+import './services-section/block.js';
+
+import { ContactInfo } from '@automattic/jetpack-blocks';
+
+console.log(ContactInfo);

src/common.scss

@@ -0,0 +1,13 @@
+/**
+ * #.# Common SCSS
+ *
+ * Can include things like variables and mixins
+ * that are used across the project.
+*/
+
+// Colors.
+$black: rgb(41, 41, 41);
+$white: #f4f4f4;
+$gray: #dedede;
+$green: #bada55;
+$red: orangered;

src/common/edit.js

@@ -0,0 +1,16 @@
+const { __ } = wp.i18n;
+const {
+	InnerBlocks,
+} = wp.editor;
+
+const makeEdit = function(template) {
+	return function({ attributes, setAttributes }) {
+		return (          
+			<InnerBlocks
+				template={template}
+			/>
+		);
+	}
+};
+
+export default makeEdit;

src/common/save.js

@@ -0,0 +1,9 @@
+const { InnerBlocks } = wp.editor;
+
+const save = function( props ) {
+	return (
+		<InnerBlocks.Content />
+	);
+};
+
+export default save;

src/contact-section/block.js

@@ -0,0 +1,62 @@
+/**
+ * BLOCK: aht
+ *
+ * Registering a basic block with Gutenberg.
+ * Simple block, renders and saves the same content without any interactivity.
+ */
+
+//  Import CSS.
+import './style.scss';
+import './editor.scss';
+import makeEdit from '../common/edit';
+import save from '../common/save';
+import BLOCK_TEMPLATE from './template';
+
+const { __ } = wp.i18n; // Import __() from wp.i18n
+const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks
+
+
+
+/**
+ * Register: aa Gutenberg Block.
+ *
+ * Registers a new block provided a unique name and an object defining its
+ * behavior. Once registered, the block is made editor as an option to any
+ * editor interface where blocks are implemented.
+ *
+ * @link https://wordpress.org/gutenberg/handbook/block-api/
+ * @param  {string}   name     Block name.
+ * @param  {Object}   settings Block settings.
+ * @return {?WPBlock}          The block, if it has been successfully
+ *                             registered; otherwise `undefined`.
+ */
+registerBlockType( 'aht-getdave/contact-block-section', {
+	// Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
+	title: __( 'Contact Us' ), // Block title.
+	icon: 'phone', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
+	category: 'sections', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
+	keywords: [
+		__( 'contact' ),
+		__( 'get in touch' ),
+	],
+
+	/**
+	 * The edit function describes the structure of your block in the context of the editor.
+	 * This represents what the editor will render when the block is used.
+	 *
+	 * The "edit" property must be a valid function.
+	 *
+	 * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
+	 */
+	edit: makeEdit(BLOCK_TEMPLATE),
+
+	/**
+	 * The save function defines the way in which the different attributes should be combined
+	 * into the final markup, which is then serialized by Gutenberg into post_content.
+	 *
+	 * The "save" property must be specified and must be a valid function.
+	 *
+	 * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
+	 */
+	save,
+} );