Issue #27 - display block list for the selected block namespace

bobbingwide · Feb 14, 2019 · 71c0120 · 71c0120
1 parent 9de6d04
commit 71c0120
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 16 deletions.
diff --git a/blocks/oik-blocklist/blocklist.js b/blocks/oik-blocklist/blocklist.js
@@ -1,14 +1,16 @@
 /*
- * Block info renderer - displays the fields for the block info block
+ * Block list renderer - displays the Block list for the selected namespace prefix
  *
  * @copyright (C) Copyright Bobbing Wide 2019
  * @author Herb Miller @bobbingwide
  *
  */
 
-const { getBlockType } = wp.blocks;
+const { getBlockType, getBlockTypes } = wp.blocks;
+const { BlockIcon } = wp.editor;
 
 import { BlockiconStyled } from '../oik-blockicon/blockicons.js';
+import { getNameSpace} from './blockprefix.js';
 
 function BlockListStyled( prefix, showBlockTypeName, showTitle, showDescription, ...props ) {
     //var block = getBlockType( blockname ) ;
@@ -18,13 +20,37 @@ function BlockListStyled( prefix, showBlockTypeName, showTitle, showDescription,
     //var blockDescription = showDescription ? <div> { block.description } </div> : null;
 
     var prefix_array = prefix.split( '/' );
-    var namespace = prefix_array[0];
+    const namespace = prefix_array[0];
+
+    var block_types = getBlockTypes();
+    block_types = block_types.filter( namespaceFilter, namespace );
+    //console.log( block_types );
     return(
-        <ul><li>Blocks for {namespace}</li></ul>
+        <ul>
+            <li>Blocks for {namespace}</li>
+            { block_types.map ( ( block ) => BlockListItem( block ) )}
+        </ul>
 
     );
 
 
 }
 
+function namespaceFilter( element, index, array ) {
+
+    var element_namespace = getNameSpace(element);
+    var filter_result = ( this == element_namespace);
+    return filter_result;
+}
+
+
+function BlockListItem( block ) {
+/* { block.icon */
+/* console.log( block ); */
+    return( <li>
+        <BlockIcon icon={block.icon.src} />
+        {block.name } {block.title }
+        </li> );
+}
+
 export  { BlockListStyled };
diff --git a/blocks/oik-blocklist/blockprefix.js b/blocks/oik-blocklist/blockprefix.js
@@ -50,7 +50,7 @@ function getOptions() {
     var block_types = getBlockTypes();
     const namespaces = getNameSpaces( block_types );
     const options = namespaces.map ( ( namespace ) => getBlockPrefixOption( namespace ) );
-    console.log( options );
+    //console.log( options );
     return options;
 }
 
@@ -66,8 +66,8 @@ function getNameSpaces( block_types) {
     var namespaces = block_types.map( ( block ) => getNameSpace( block ));
     var unique_namespaces = namespaces.filter( onlyUnique );
 
-    console.log( namespaces );
-    console.log( unique_namespaces );
+    //console.log( namespaces );
+    //console.log( unique_namespaces );
     return unique_namespaces;
 
 }
@@ -95,4 +95,4 @@ function getOptionLabel( block ) {
 
 
 
-export  { BlockPrefixSelect };
+export  { BlockPrefixSelect, getNameSpace };
diff --git a/blocks/oik-blocklist/index.js b/blocks/oik-blocklist/index.js
@@ -127,14 +127,6 @@ export default registerBlockType(
                 <InspectorControls >
                     <PanelBody>
 
-                        <PanelRow>
-                            <TextControl
-                                label="Prefix"
-                                value={ props.attributes.prefix }
-                                onChange={ onChangePrefix }
-                                onFocus={ focus }
-                            />
-                        </PanelRow>
 
                         <PanelRow>
                             <BlockPrefixSelect value={ props.attributes.prefix } onChange={ onChangePrefix } />