bennadel

<cfoutput>

	<!--- Define the initial BODY content. --->
	<cfsavecontent variable="body">
		<p>
			This is the body!
		</p>
	</cfsavecontent>

bennadel

{
	"plugins": [
		"@babel/plugin-proposal-optional-chaining"
	]
}

bennadel

component
	output = false
	hint = "I provide utility methods for rendering HTML in a view template."
	{

	/**
	* I output the given attribute with proper attribute encoding. If the value is a
	* complex data structure, it is serialized as JSON.
	*/
	public string function attr(

bennadel

<cfscript>

	items = [
		{ id: 1, name: "Item One" },
		{ id: 2, name: "Item Two" },
		{ id: 3, name: "Item Three" }
	];

</cfscript>
<cfmodule template="./tags/page.cfm">

bennadel

<cfscript>

	writeOutput( "A-1 <br />" );
	return;
	writeOutput( "A-2 <br />" );

</cfscript>

bennadel

<!---
	When rendered as a top-level request, we can render the form AS-IS. However, if we're
	rendering inside a Turbo Frame (ie, we're trancluding the form into another page), we
	have to render the form inside a like-named Turbo Frame so that Hotwire can merge the
	results back into the live page.
	--
	NOTE: In a more robust architecture, this could be implemented much more seamlessly as
	a layout selection, such as a "standard" layout vs a "fly-out" layout. However, to
	keep things as simple as possible, I'm rendering both types of layouts right here in
	the same template so that we can see the mechanics at play.

bennadel

<cfscript>

	if ( request.isPost ) {

		// Sleeping to give us time to observe the busy-state of the submit button.
		sleep( 2000 );
		location( url = "index.htm?signed=true", addToken = false );

	}

bennadel

<cfscript>

	param name="request.context.clearBanner" type="boolean" default=false;

	if ( request.context.clearBanner ) {

		application.bannerText = "";

		// If this request is not being scoped to a Turbo Frame (ie, Turbo Drive has not
		// yet taken over the page navigation), let's redirect the user back to the

bennadel

<cfmodule template="./tags/page.cfm">
	<cfoutput>

		<h2>
			Welcome to My Site
		</h2>

		<div id="dyno">
			This is static content.
		</div>

bennadel

component
	output = false
	hint = "I define the application settings and event handlers."
	{

	// ... truncated code ... //

	/**
	* I get called once to initialize the request.
	*/