Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create GeSHi block - server side rendered - for the [bw_geshi] shortcode #18

Closed
bobbingwide opened this issue Dec 12, 2018 · 9 comments
Closed
Assignees
Labels
enhancement New feature or request

Comments

@bobbingwide
Copy link
Owner

Requirements

  • Ability to document code styled using GeSHi
  • Implement a block for the [bw_geshi] shortcode
  • Primary purpose is to avoid problems with unwanted p and br tags created by Gutenberg when attempting to write a post using the Block editor which contains the [bw_geshi] shortcode.

Proposed solution

  • New block oik-block/geshi - GeSHi - Generic Syntax Highlighting
  • Depends on oik-css plugin for the server logic
  • Implemented as a dynamic block with server side rendering
  • Supports the language selection parameter, defaulting to "none".

This block to be added to the list of experimental blocks in #16

@bobbingwide bobbingwide added the enhancement New feature or request label Dec 12, 2018
@bobbingwide bobbingwide self-assigned this Dec 12, 2018
@bobbingwide
Copy link
Owner Author

This information may help someone attempting to debug their own server side rendered block.
The following message is may be shown when you attempt to create a block that is server side rendered but haven't written the server side logic.

Error loading block: No route was found matching the URL and request method 

This was the case when I first developed the geshi block. I'd only written some JS; none of the PHP.

@bobbingwide
Copy link
Owner Author

If the server side rendering doesn't return anything then you'll get a spinner.
s b_wordpress_wp-admin_post php_post 952 action edit

@bobbingwide
Copy link
Owner Author

If you see This block has encountered an error and cannot be previewed then you should look at the JavaScript console. You might find something like this... ReferenceError: SelectControl is not defined.
This indicates that you need to add an import statement.

@bobbingwide
Copy link
Owner Author

Error loading block: Invalid parameter(s): attributes is produced when one or more of the attributes passed to the server is not recognised.

@bobbingwide
Copy link
Owner Author

Here's what I have so far.
image

I can make it hide the input field when the block is not selected, but can't position the input field above the server rendered output nor prevent the server rendering while I'm typing into the field.

@bobbingwide
Copy link
Owner Author

bobbingwide commented Dec 12, 2018

Primary purpose is to avoid problems with unwanted p and br tags created by Gutenberg when attempting to write a post using the Block editor which contains the [bw_geshi] shortcode.

The reason this happens is because the shortcode block is rendered using

function render_block_core_shortcode( $attributes, $content ) {
	return wpautop( $content );
}

bobbingwide added a commit that referenced this issue Dec 12, 2018
@bobbingwide
Copy link
Owner Author

bobbingwide commented Dec 13, 2018

It appears I need to change the oik_geshi() code to accept a default value of "none" for the lang. The server side rendering logic doesn't always want to pass "lang=none" from the SelectControl.

@bobbingwide
Copy link
Owner Author

bobbingwide commented Dec 14, 2019

The logic for this block has been copied to https://github.com/bobbingwide/oik-css which is being converted to a standalone plugin for two blocks oik-css/css and oik-css/geshi.
Over time the solution in oik-blocks will be deprecated.

@bobbingwide
Copy link
Owner Author

The GeSHi block is now delivered by the oik-css plugin

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant