All Projects → FluidTYPO3 → Vhs

FluidTYPO3 / Vhs

Licence: other
TYPO3 extension VHS: Fluid ViewHelpers

Labels

Projects that are alternatives of or similar to Vhs

react-fluid-animation
Fluid media animation for React powered by WebGL.
Stars: ✭ 57 (-66.86%)
Mutual labels:  fluid
Granim.js
Create fluid and interactive gradient animations with this small javascript library.
Stars: ✭ 4,825 (+2705.23%)
Mutual labels:  fluid
Fluidcontent
TYPO3 extension Fluidcontent: Fluid Content Element Engine
Stars: ✭ 82 (-52.33%)
Mutual labels:  fluid
Fat-Clouds
GPU Fluid Simulation with Volumetric Rendering
Stars: ✭ 81 (-52.91%)
Mutual labels:  fluid
Pbd Fluid In Unity
A PBD fluid in unity running on the GPU
Stars: ✭ 350 (+103.49%)
Mutual labels:  fluid
Su2
SU2: An Open-Source Suite for Multiphysics Simulation and Design
Stars: ✭ 731 (+325%)
Mutual labels:  fluid
PhysIKA
PhysIKA: Physics-based Interactive Kinematics Architecture
Stars: ✭ 91 (-47.09%)
Mutual labels:  fluid
Oneflow
LargeScale Multiphysics Scientific Simulation Environment-OneFLOW CFD
Stars: ✭ 150 (-12.79%)
Mutual labels:  fluid
Tutoshowcase
A simple and Elegant Showcase view for Android
Stars: ✭ 499 (+190.12%)
Mutual labels:  fluid
Blender Flip Fluids
FLIP Fluids is a powerful liquid simulation plugin that gives you the ability to create high quality fluid effects all within Blender, the free and open source 3D creation suite.
Stars: ✭ 983 (+471.51%)
Mutual labels:  fluid
euler-fluid-cpp
Euler fluid simulated with CPP and SFML
Stars: ✭ 50 (-70.93%)
Mutual labels:  fluid
Fitty
✨ Makes text fit perfectly
Stars: ✭ 3,321 (+1830.81%)
Mutual labels:  fluid
Ason
[DEPRECATED]: Prefer Moshi, Jackson, Gson, or LoganSquare
Stars: ✭ 777 (+351.74%)
Mutual labels:  fluid
TYPO3CMS-Book-ExtbaseFluid
TYPO3 Documentation: "Developing TYPO3 Extensions with Extbase and Fluid" (Book)
Stars: ✭ 26 (-84.88%)
Mutual labels:  fluid
Fluid System
Fluid System is a style props function transformer for generating fluid styles. 💦
Stars: ✭ 130 (-24.42%)
Mutual labels:  fluid
Vortex2D
Real-time fluid simulation engine running on GPU with Vulkan
Stars: ✭ 91 (-47.09%)
Mutual labels:  fluid
Textblock
Continuously responsive typesetting — Demo:
Stars: ✭ 536 (+211.63%)
Mutual labels:  fluid
Aphros
Finite volume solver for incompressible multiphase flows with surface tension
Stars: ✭ 154 (-10.47%)
Mutual labels:  fluid
Webgl Fluid Simulation
Play with fluids in your browser (works even on mobile)
Stars: ✭ 11,621 (+6656.4%)
Mutual labels:  fluid
Fld Grd
Google Images/Flickr inspired fluid grid layouts
Stars: ✭ 37 (-78.49%)
Mutual labels:  fluid

VHS: Fluid ViewHelpers

Collection of general purpose ViewHelpers usable in the Fluid templating engine that's bundled with the TYPO3 CMS.

Build Status Coverage Status Documentation

Installation

Installation using Composer

The recommended way to install the extension is by using Composer. In your Composer based TYPO3 project root, just do composer require fluidtypo3/vhs.

Installation as extension from TYPO3 Extension Repository (TER)

Download and install as TYPO3 extension. That's it.

Settings

Although there are no static TypoScript files which can be included, VHS does support a few key settings which are defined in TypoScript:

Debug settings

  • plugin.tx_vhs.settings.debug = 1 can be used to enable general debugging, which causes Asset inclusions to be debugged right before inclusion in the page
  • plugin.tx_vhs.settings.asset.debug = 1 can be used to enable debug output from individual Asset ViewHelper instances. Applies when a ViewHelper uses the "debug" parameter (where this is supported) and/or when plugin.tx_vhs.settings.debug = 1.
  • plugin.tx_vhs.settings.useDebugUtility which causes VHS to use Extbase's DebugUtility to dump variables. If this setting is not defined a value of 1 is assumed.

Assets

VHS contains a highly useful feature which enables you to define Assets (CSS/JS/etc) in Fluid templates, PHP and TypoScript. What's different from the traditional ways of including such Assets (in Fluid or otherwise) all are used differently, controlled differently and probably worst of all, not all of them are integrator friendly (as in: allows Assets to be affected using TypoScript). VHS Assets solves all of this.

Asset Examples

The following Fluid usage:

<v:asset.script path="fileadmin/demo.js" />

Is the exact same as ths PHP:

\FluidTYPO3\Vhs\Asset::createFromFile('fileadmin/demo.js');

Which is a short form of:

\FluidTYPO3\Vhs\Asset::createFromSettings(array(
	'name' => 'demo',
	'path' => 'fileadmin/demo.js'
));

Which is itself a short form of:

$asset = \FluidTYPO3\Vhs\Asset::getInstance();
// or alternatively, if this fits better in your other code:
$asset = $objectManager->get('FluidTYPO3\\Vhs\\Asset');
// then:
$asset->setName('demo');
$asset->setPath('fileadmin/demo.js');
$asset->finalize(); // manually created Assets must be finalized before they show up.

The PHP above does the exact same as this TypoScript:

plugin.tx_vhs.settings.asset.demo.path = fileadmin/demo.js

Which is a short form of:

plugin.tx_vhs.settings.asset.demo {
	name = demo
	path = fileadmin/demo.js
}

In summary: regardless of where and how you use VHS Assets, they always use the same attributes, they always behave the same, support the same features (such as dependency on other Assets regardless of inclusion order and addressing Assets by a group name to affect multiple Assets - and even rendering JS/CSS as if the file was a Fluid template).

The API for inclusion changes but the result is the same.

But the real benefit of VHS Assets comes in the form of the TypoScript integration, which lets you override settings of individual Assets (regardless of how they were originally defined - Fluid, PHP, TypoScript) by setting their attributes in TypoScript. This allows integrators to control every aspect of every Asset (but not the ones included in traditional ways) all the way down to replacing the script source or CSS content that gets inserted or moving JS file(s) which used by be merged, to a new CDN server without even breaking dependencies and execution order.

To affect VHS Assets through TypoScript, the following settings can be used:

Asset settings

plugin.tx_vhs.settings.asset.ASSETNAME {
	content = Text # Text which overrides content
	path = FileReference # If set, turns Asset into a file inclusion
	name = Text a-zA-Z0-9_ # Can be used to change the name of an Asset on-the-fly, but watch out for dependencies
  external = Integer 0/1 # If set to `1` and `standalone`, includes the file as raw URL. If set to `1` and not `standalone` then downloads the file and merges it when building Assets
	overwrite = Integer 0/1 # If set to `1` this Asset is permitted to overwrite existing, identically named Assets
	dependencies = CSV # list of comma-separated Asset names upon which the current Asset depends; affects loading order
	group = Text a-zA-Z0-9_ # Group name, default "fluid". By grouping Assets the settings used on the group will apply to Assets
	debug = Integer 0/1 # If `1` enables debug output of each asset
	standalone = Integer 0/1 # If `1` instructs VHS to process this Asset as standalone, excluding it from merging
	async = Integer 0/1 # If 1, adds "async" attribute to script tag (only works when standalone is set and type is js)
	defer = Integer 0/1 # If 1, adds "defer" attribute to script tag (only works when standalone is set and type is js)
	movable = Integer 0/1 # If `0` prevents Assets from being included in the page footer. Used by style-type Assets. Default is `1` unless type is CSS which forces movable=0
	trim = Integer 0/1 # If `1` enables trimming of whitespace from beginning and end of lines when merging Assets
	namedChunks = Integer 0/1 # If `0` prevents Asset name from being inserted as comment above the Asset body in merged files
}
plugin.tx_vhs.settings.assetGroup.ASSETGROUPNAME {
	# this object supports the following properties only. When applied to a group the settings are used by each
	# Asset in that group, unless overridden directly in the Asset's attributes or through TypoScript as above.
	# SUPPORTED PROPERTIES: overwrite, dependencies, group, debug, standalone, allowMoveToFooter, trim and namedChunks
	# Please note: changing the "group" property changes the name of the group which means another group configuration
	# must be added which configures that group. Otherwise settings may be ignored.
}
plugin.tx_vhs.settings.asset {
	# this object supports every property which "assetGroup" supports except for the "group" and "dependencies" properties.
}
plugin.tx_vhs.assets {
	mergedAssetsUseHashedFilename = 0 # If set to a 1, Assets are merged into a file named using a hash if Assets' names.
	tagsAddSubresourceIntegrity = 0 # If set to 1 (weakest),2 or 3 (strongest), Vhs will generate and add the Subresource Integrity (SRI) for every included Asset.
}

Secondary domain name for resources

You can configure VHS to write path prepends in two ways, one of which allows you to create a so-called "cookie-free domain" on which requests will contain fewer headers. Normally, setting config.absRefPrefix causes your resources' paths to be prefixed with a domain, but using this approach will always prepend a domain name which cannot be "cookie-free". VHS allows an alternative setting for path prefix, which can be set to a secondary domain name (pointing to the same virtual host or not) which sets no cookies, causing all asset tags to be written with this prefix prepended:

plugin.tx_vhs.settings.prependPath = http://static.mydomain.com/

The setting affects every relative-path resource ViewHelper (NB: this does not include links!) in VHS, which is why it is not placed inside the "asset" scope. If you need to output this prefix path in templates you can use the v:page.staticPrefix ViewHelper - it accepts no arguments and only outputs the setting if it is set. For example, using f:image will not prefix the image path but manually creating an <img /> tag and using f:uri.image as src argument will allow you to prefix the path.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].