Action Bar and Action Button
Κοινοί παράμετροι
- url : τη διεύθυνση που πηγαίνει
- icon: το όνομα του FA εικονιδίου
- title: το κείμενο που εμφανίζει σαν tooltip ή σαν κείμενο κουμπιού
- show: boolean τιμή, αν θα είναι ορατό ή όχι
- confirm: σε περίπτωση που χρειάζεται επιβεβαίωση από το χρήστη πριν την εκτέλεση την εντολής, ως κείμενο. Αν δεν υπάρχει (ή είναι null) δεν εμφανίζεται καθόλου επιβεβαίωση.
- confirm_title: ο τίτλος της επιβεβαίωσης. Εξ ορισμού είναι ο τίτλος της διαγραφής
- confirm_button: το κείμενο του κουμπιού της επιβεβαίωσης. Εξ ορισμού είναι το κείμενο της διαγραφής
- class: η κατηγορία του πλήκτρο, π.χ. 'delete' για κουμπιά διαγραφής
Action Bar
Το νέο action bar αποτελείται από 3 κατηγορίες κουμπιών (action button levels):
- primary: Κουμπιά βασικών ενεργειών με εικονίδιο (font awesome icon)
- primary-label: Κουμπιά βασικών ενεργειών με εικονίδιο (font awesome icon) και κείμενο
- secondary: Κουμπιά δευτερεύουσας σημασίας ενεργειών «κρυμμένα» σε expandable menu που ενεργοποιείται με κλικ στο κουμπί δευτερευόντων ενεργειών.
Για να δημιουργήσουμε ένα action bar στο νέο ui χρησιμοποιούμε την function action_bar()
ως εξής:
action_bar(array( array('title' => 'Ονομασία ενέργειας', 'url' => 'url ενέργειας', 'icon' => 'font awesome class εικονιδίου', 'level' => 'primary-label ή primary ή secondary (default value)', 'confirm' => 'delete confirmation μήνυμα αν πρόκειται για delete button '), 'show' => 'condition βάση του οποίου το button εμφανίζεται'), 'class' => 'class που εφαρμόζεται στο li που περιβάλει το button', 'button-class' => 'class του button (default η btn-default του bootstrap)' ));
Παράδειγμα χρήσης action bar (modules/document/index.php):
$tool_content .= action_bar(array( array('title' => $langDownloadFile, 'url' => "upload.php?course=$course_code&{$groupset}uploadPath=$curDirPath", 'icon' => 'fa-plus-circle', 'level' => 'primary-label', 'button-class' => 'btn-success'), array('title' => $langCreateDir, 'url' => "{$base_url}createDir=$cmdCurDirPath", 'icon' => 'fa-folder', 'level' => 'primary'), array('title' => $langQuotaBar, 'url' => "{$base_url}showQuota=true", 'icon' => 'fa-pie-chart'), array('title' => $langExternalFile, 'url' => "upload.php?course=$course_code&{$groupset}uploadPath=$curDirPath&ext=true", 'icon' => 'fa-external-link'), array('title' => $langCommonDocs, 'url' => "../units/insert.php?course=$course_code&dir=$curDirPath&type=doc&id=-1", 'icon' => 'fa-plus-circle', 'show' => !defined('COMMON_DOCUMENTS') && get_config('enable_common_docs')) ));
Action Button
Το action button το οποίο θα χρησιμοποιείται κυρίως για τα actions ενός row πίνακα ακολουθεί παρόμοια λογική με την action_bar.
Για να δημιουργήσουμε ένα action button στο νέο ui χρησιμοποιούμε την συνάρτηση action_button()
ως εξής:
action_bar(array( array('title' => 'Ονομασία ενέργειας', 'url' => 'url ενέργειας', 'icon' => 'font awesome class εικονιδίου', 'confirm' => 'delete confirmation μήνυμα αν πρόκειται για delete button '), 'show' => 'condition βάση του οποίου το button εμφανίζεται'), 'class' => 'class που εφαρμόζεται στο anchor του button', 'button-class' => 'class του button (default η btn-default του bootstrap)' ));
Παράδειγμα χρήσης action button (modules/work/index.php)
action_button(array( array('title' => $langEdit, 'url' => "$_SERVER[SCRIPT_NAME]?course=$course_code&id=$row->id&choice=edit", 'icon' => 'fa-edit'), array('title' => $m['WorkSubsDelete'], 'url' => "$_SERVER[SCRIPT_NAME]?course=$course_code&id=$row->id&choice=do_purge", 'icon' => 'fa-eraser', 'confirm' => $langWarnForSubmissions. $langDelSure, 'show' => is_numeric($num_submitted) && $num_submitted > 0), array('title' => $langDelete, 'url' => "$_SERVER[SCRIPT_NAME]?course=$course_code&id=$row->id&choice=do_delete", 'icon' => 'fa-times', 'class' => 'delete', 'confirm' => $langConfirmDelete), array('title' => $row->active == 1 ? $m['deactivate']: $m['activate'], 'url' => $row->active == 1 ? "$_SERVER[SCRIPT_NAME]?course=$course_code&choice=disable&id=$row->id" : "$_SERVER[SCRIPT_NAME]?course=$course_code&choice=enable&id=$row->id", 'icon' => $row->active == 1 ? 'fa-eye': 'fa-eye-slash')))