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

Land major header/indent rst to md changes #2085

Merged
merged 6 commits into from
Jul 16, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 43 additions & 39 deletions docs/accordion.md
Original file line number Diff line number Diff line change
@@ -1,29 +1,28 @@

.. php:namespace:: Atk4\Ui

.. php:class:: Accordion

=========
Accordion
=========
# Accordion

Accordion implement another way to organize your data. The implementation is based on: https://fomantic-ui.com/modules/accordion.html.


Demo: https://ui.agiletoolkit.org/demos/accordion.php

## Basic Usage

Basic Usage
===========

Once you create an Accordion container you can then mix and match static and dynamic accodion section::
Once you create an Accordion container you can then mix and match static and dynamic accodion section:

$acc = Accordion::addTo($app);
```
$acc = Accordion::addTo($app);
```


Adding a static content section is pretty simple::
Adding a static content section is pretty simple:

LoremIpsum::addTo($acc->addSection('Static Tab'));
```
LoremIpsum::addTo($acc->addSection('Static Tab'));
```

You can add multiple elements into a single accordion section, like any other view.

@@ -34,55 +33,60 @@ Use addSection() method to add more section in an Accordion view. First paramete
Section can be static or dynamic. Dynamic sections use :php:class:`VirtualPage` implementation mentioned above.
You should pass Closure action as a second parameter.

Example::
Example:

$t = Accordion::addTo($layout);
```
$t = Accordion::addTo($layout);

// add static section
HelloWorld::addTo($t->addSection('Static Content'));
// add static section
HelloWorld::addTo($t->addSection('Static Content'));

// add dynamic section
$t->addSection('Dynamically Loading', function (VirtualPage $vp) {
LoremIpsum::addTo($vp);
});
// add dynamic section
$t->addSection('Dynamically Loading', function (VirtualPage $vp) {
LoremIpsum::addTo($vp);
});
```

Dynamic Accordion Section
=========================
## Dynamic Accordion Section

Dynamic sections are based around implementation of :php:class:`VirtualPage` and allow you
to pass a callback which will be triggered when user clicks on the section title.::
to pass a callback which will be triggered when user clicks on the section title.:

$acc = Accordion::addTo($app);
```
$acc = Accordion::addTo($app);

// dynamic section
$acc->addSection('Dynamic Lorem Ipsum', function (VirtualPage $vp) {
LoremIpsum::addTo($vp, ['size' => 2]);
});
// dynamic section
$acc->addSection('Dynamic Lorem Ipsum', function (VirtualPage $vp) {
LoremIpsum::addTo($vp, ['size' => 2]);
});
```

Controlling Accordion Section via Javascript
============================================
## Controlling Accordion Section via Javascript

Accordion class has some wrapper method in order to control the accordion module behavior.

.. php:method:: jsOpen($section, $action = null)
.. php:method:: jsToggle($section, $action = null)
.. php:method:: jsClose($section, $action = null)

For example, you can set a button that, when clicked, will toggle an accordion section::
For example, you can set a button that, when clicked, will toggle an accordion section:

$button = Button::addTo($bar, ['Toggle Section 1']);
```
$button = Button::addTo($bar, ['Toggle Section 1']);

$acc = Accordion::addTo($app, ['type' => ['styled', 'fluid']]);
$section1 = LoremIpsum::addTo($acc->addSection('Static Text'));
$section2 = LoremIpsum::addTo($acc->addSection('Static Text'));
$acc = Accordion::addTo($app, ['type' => ['styled', 'fluid']]);
$section1 = LoremIpsum::addTo($acc->addSection('Static Text'));
$section2 = LoremIpsum::addTo($acc->addSection('Static Text'));

$button->on('click', $acc->jsToggle($section1));
$button->on('click', $acc->jsToggle($section1));
```

Accordion Module settings
=========================
## Accordion Module settings

It is possible to change Accordion module settings via the settings property.::
It is possible to change Accordion module settings via the settings property.:

Accordion::addTo($app, ['settings' => []]);
```
Accordion::addTo($app, ['settings' => []]);
```

For a complete list of all settings for the Accordion module, please visit: https://fomantic-ui.com/modules/accordion.html#/settings
29 changes: 9 additions & 20 deletions docs/advanced.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,8 @@

.. _advanced:

===============
Advanced Topics
===============
# Advanced Topics

Agile Data
==========
## Agile Data

Agile Data is a business logic and data persistence framework. It's a
separate library that has been specifically designed and developed
@@ -37,8 +33,7 @@ Agile Data is distributed under same open-source license as Agile UI
and the rest of this documentation will assume you are using Agile
Data for the purpose of overall clarity.

Interface Stability
===================
## Interface Stability

Agile UI is based on Agile Toolkit 4.3 which has been a maintained
UI framework that can trace it's roots back to 2003. As a result, the
@@ -51,8 +46,7 @@ compatible for a period of a few years.
We expect you to extend base classes to build your UI as it is a
best practice to use Agile UI.

Testing and Enterprise Use
==========================
## Testing and Enterprise Use

Agile UI is designed with corporate use in mind. The main aim of
the framework is to make your application consistent, modern and
@@ -65,16 +59,14 @@ browser compatibility is defined by the underlying CSS framework.
With Agile UI we will provide you with a guide how to test your
own components.

Unit Tests
----------
### Unit Tests

You only need to unit-test you own classes and controllers. For
example if your application creates a separate class that deals
with APR calculation, you need to include unit-test for that
specific class.

Business Logic Unit Tests
-------------------------
### Business Logic Unit Tests

Those tests are most suitable for testing your business logic,
that is included in Agile Data. Use "array" persistence to
@@ -89,8 +81,7 @@ logic with mock objects.
In most cases the Integration tests are easier to make, and
give you equal testability.

Integration Database Tests
--------------------------
### Integration Database Tests

This test-suite will operate with SQL database by executing
various database operations in Agile Data and then asserting
@@ -101,8 +92,7 @@ business logic changes.
3. perform changes such as adding new invoice
4. assert through other models e.g. by running client report model.

Component Tests
---------------
### Component Tests

All of the basic components are tested for you using UI tests,
but you should test your own components. This test will place
@@ -112,8 +102,7 @@ that it continues to work.
If your component relies on a model, this can also attempt
various model combinations for an extensive test.

User Testing
------------
### User Testing

Once you place your components on your pages and associate
them with your actual data you can perform user tests.
Loading