Skip to content

Latest commit

 

History

History
115 lines (95 loc) · 3.39 KB

README.md

File metadata and controls

115 lines (95 loc) · 3.39 KB
Raw

Mono Bind-Tab Module

This is Bind-Tab module for the Mono web framework.

Configuration

Besides the standard Mono module configuration options ('html', 'css', 'scripts'), the extra configuration options for this module are:

{
    "container": "«jQuery selector»",
    "tabs": "«jQuery selector»",
    "options": {
        "classes": {
            "selected": "CSS class"
        },
        "first": "miid",
        "hash": true or false,
        "reuse": true or false
    }
}

where:

  • container: jQuery selector (can be an #id or a .class, for example) that specifies where the content from tabs will be loaded (e.g.: #container)
  • tabs: jQuery selector that identifies the tabs (e.g.: li)
  • options: an object containing options of bind-tab module config
  • classes: an object containing CSS classes for bind-tab module
  • selected: a string that represents a CSS class (e.g.: active)
  • first: miid that you want to load first (e.g.: home_layout)
  • hash: bool value. When it is true there will appear hash links (also, the tabs have to contain data-hash attributes)
  • reuse: bool value. When it is true the miids are loaded but never removed. They will be shown/hidden by the module.

HTML side

Each tab item has to contain data-miid and data-hash atributes.

<ul>
    <li data-miid="miid1" data-hash="hash1">Tab 1</li>
    <li data-miid="miid2" data-hash="hash2">Tab 2</li>
</ul>
  • data-miid: miid that will be linked to this tab item
  • data-hash: #hash link that will appear in browser address

Events

The module emits the following events:

Event Name
Description
tabActivated Emited when any tab is loaded completelly or shown by the module.

Changelog

dev

  • New features and fixes go here.

V0.2.1

  • Upgraded Events to v0.3.0 and Bind to v0.3.1
  • Using now also Bind module
  • Emitting ready when the initialization is done

v0.1.8

  • Removed jQuery reference in dependencies (it is server by bind)
  • Updated to Events v0.1.8

v0.1.7

  • After tab change click on the activated miid item from the menu.
  • Fixed onInitEnd that in some cases was never reached

v0.1.6

  • Updated the module to the new version of the client script (M.js): .onready is deprecated.
  • Fixed the problem with the redirection: click on the [data-miid] again, after the miid was loaded.
  • Fixed wrong miid name emit (miid instead of first)
  • Updated the module to Bind v0.1.4 and Events v0.1.3.
  • Implemented transitions between tabs.
  • Updated Bind and Events to the latest releases.

v0.1.5

  • Implemented data-title option. The window title will be set if data-title attribute is provided (Issue #2)
  • Fixed the problem with tabActivated: the module will wait until the miid loaded will emit ready.
  • Replaced simple quotes with double quotes

v0.1.4

  • The empty of container was fixed.
  • Upgrated to Events version v0.1.1

v0.1.3

  • reuse option was implemented

v0.1.2

  • tabActivated event was implemented

v0.1.1

  • Events and Bind were added in dependencies of module.
  • Process config function was removed