SVT mit Timer

Das nachfolgende Plugin zeigt, dass auch minütlich ein Timer gesetzt werden kann. Gleichzeitig illustriert das Beispiel, wie man flexibel SVG für die Darstellung von Diagrammen verwenden kann. Die notwendigen Rechenoperationen im View für ein dynamisches rendering erledigt der Viewhelper <svt:calculate>.

Da svt die File-Reference um eine Timer-Funktion erweitert, kann man mit angepassten Templates auch Bilder zeitlich variierend ein- und ausblenden. Gute Technik für Marketing-Aktionen und tageszeitlich & jahrezeitlich  angepasste Website-Auftritte. Wenn eine Webseite mit TYPO3 8.7 gut Fluid-basiert programmiert ist, kann man in wenigen Stünden alle wichtige Content-Element zeitlich übersteuerbar machen.

Prepare this plugin for testing

  1. Define a sysfolder for timer-definitions.
  2. Define a timer-definition with the periodic structure:
    • active period for one minute
    • passive period for one minute
    • passive period for one minute
  3. Define a timer-definition with the periodic structure:
    • passive period for one minute
    • active period for one minute
    • passive period for one minute
  4. Open the Content-elemtn for this plugin.
  5. Add at lest two svg-file as alternative partials to this plugin:
    • Remark the first svg-file with the first timer-definition.
    • Remark the second svg-file with the second timer-definition.
  6. Reload every minute the frontend-page with the plugin for at least four minutes.
  7. See how it works.

generate CSS and JS dynamically with TYPO3

dynamically generated CSS/stylesheets

german flag could change temporay (typoscript-time-condition)

german flag via CSS-Classe. The CSS-file is cincluded bei the extension.

staticly included and dynamically generated javascript

Open the console of your browser. You should find two messages: one from the static file and one from the dynamically generated stream.

formular result expected checked
2 ↑ -3 ↓ 5 ↑ 333 okay
2 ↑ (-3 ↓ 5) ↑ 3 33 okay
30 *sin(30°) +14 2929 error. Float-values could cause problems.
round(30 *sin(30°) +14) 2929 okay
abs(3*5+6*-4+3^2-1)11 okay

test the svg-charting

You have to define an periodic timer of one minute periodic in an separate folder. Add to this plugin a chart of the folder 'fileadmin/svt/Diagramms' as 'alternative partial' and combine it with your 'one-minute-timer'.

list of datas for a bar

This is the default-partial. It shows a table (uid, value, color}. There is no alternative partial active.
uid value value
1207darkred
2287darkblue
397gold

chart-partial will override list-partial

with path defined by object

You will see the first override-partial for the plugin, if you have one defined.
20728797

with path defined by string

uid value value
1207darkred
2287darkblue
397gold

chart-partial will override periodicly list-partial

used by a condition-pattern

This part will use the viewhelper svt:timerActive. The viewhelper generate a '1', if the timer is active. You can switch betweee two alternative partials in this example.
20728797

set partial from list by timer

Select the first hit as alternative partial from a objectstorage containing a list of alternative partials. It works similiar to f:alias.
20728797

Don't forget

After his testing the editor may forget to replace the testDate to a historical date. Activate the svt-scheduler, which will automaticly restore the testDates in the data base.

Und hier eine kleine Strobo-Galery