UNPKG

zpt

Version:

Zenon Page Templates - JS (ZPT-JS)

174 lines (161 loc) 7.2 kB
<!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8"> <title>Update effects tests</title> <link rel="stylesheet" href="/node_modules/qunit/qunit/qunit.css"> <style> @keyframes textColorChangeKeyframes { 0% { color: #0000ff; } 50% { color: #00ff00; } 100% { color: #0000ff; } } .textColorChange { animation-name: textColorChangeKeyframes; animation-duration: 1s; animation-iteration-count: 3; } .stopped { animation-name: none; } </style> <script src="http://127.0.0.1:9966/updateEffects.js" defer></script> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"></div> <h1>Update effects</h1> <h2>Insert object nested element by index TALRepeat</h2> <div id="t1"> <ol> <li data-repeat="object objectList1"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName1'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription1'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Insert item nested element by index TALRepeat</h2> <div id="t2"> <ol> <li data-repeat="object objectList2"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName2'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription2'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Update object nested element by index TALRepeat</h2> <div id="t3"> <ol> <li data-repeat="object objectList3"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName3'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription3'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Update item nested element by index TALRepeat</h2> <div id="t4"> <ol> <li data-repeat="object objectList4"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName4'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription4'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Delete object nested element by index TALRepeat</h2> <div id="t5"> <ol> <li data-repeat="object objectList5"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName5'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription5'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Delete item nested element by index TALRepeat</h2> <div id="t6"> <ol> <li data-repeat="object objectList6"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName6'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription6'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Insert and delete item nested element by index TALRepeat</h2> <div id="t7"> <ol> <li data-repeat="object objectList7"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName7'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription7'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Insert and delete item nested element by index using the loop var TALRepeat</h2> <div id="t8"> <div data-condition="not: objectList8" data-attributes="id 'noElements8'"> No elements </div> <ol> <li data-repeat="object objectList8"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName8'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription8'">an item description</span> </li> </ol> </li> </ol> </div> <h2>Insert item nested element by index using the loop var in parent node TALRepeat</h2> <div id="t9"> <div data-condition="not: objectList9" data-attributes="id 'noElements9'"> No elements </div> <ol data-condition="objectList8"> <li data-repeat="object objectList9"> <span data-content="object/id"></span> <ol> <li data-repeat="item object/items"> <span data-content="item/name" data-attributes="class 'itemName9'">an item name</span>: <span data-content="item/description" data-attributes="class 'itemDescription9'">an item description</span> </li> </ol> </li> </ol> </div> </body> </html>