Deprecated data-router ... welcome data-view-*

src/boot/Lungo.Boot.Events.coffee

@@ -9,6 +9,7 @@ Initialize the automatic DOM UI events
 ###
 
 Lungo.Boot.Events = do(lng = Lungo) ->
+  C = lng.Constants
   ATTRIBUTE = lng.Constants.ATTRIBUTE
   CLASS = lng.Constants.CLASS
   ELEMENT = lng.Constants.ELEMENT
@@ -21,23 +22,48 @@ Lungo.Boot.Events = do(lng = Lungo) ->
   @method init
   ###
   init = ->
-    lng.dom(QUERY.HREF_ROUTER).tap _loadTarget
+    lng.dom(C.QUERY.SECTION_ROUTER).tap _onSection
+    lng.dom(C.QUERY.ARTICLE_ROUTER).tap _onArticle
+    lng.dom(C.QUERY.ASIDE_ROUTER).tap _onAside
+    lng.dom(C.QUERY.MENU_ROUTER).tap _onMenu
+
+
     lng.dom(QUERY.MENU_HREF).tap _closeMenu
     lng.dom(QUERY.INPUT_CHECKBOX).tap _changeCheckboxValue
 
-  _loadTarget = (event) ->
+  _onSection = (event) ->
     event.preventDefault()
-    link = lng.dom(this)
-    if link.data("async")
-      _loadAsyncTarget link
+    el = lng.dom @
+    if el.data "async"
+      _onAsyncSection el.data("async"), el.data("view-section")
     else
-      _selectTarget link
+      section_id = el.data "view-section"
+      if section_id isnt "back" then lng.Router.section(section_id) else lng.Router.back()
 
-  _changeCheckboxValue = (event) ->
+  _onAsyncSection = (url, section_id) ->
+    lng.Notification.show()
+    lng.Resource.load url
+    lng.Boot.Data.init "##{section_id}"
+    link.removeAttribute("data-async") for link in lng.dom "[data-async='#{url}']"
+    setTimeout (->
+      lng.Router.section section_id
+      do lng.Notification.hide
+    ), lng.Constants.TRANSITION.DURATION * 2
+
+  _onArticle = (event) ->
     event.preventDefault()
-    el = lng.dom(this)
-    current_value = (if el.val() > 0 then 0 else 1)
-    el.toggleClass("active").attr "value", current_value
+    el = lng.dom @
+    lng.Router.article lng.Router.History.current(), el.data("view-article"), el
+    lng.Aside.hide()
+
+  _onAside = (event) ->
+    event.preventDefault()
+    lng.Aside.toggle()
+
+  _onMenu = (event) ->
+    event.preventDefault()
+    menu_id = lng.dom(@).data("view-menu")
+    lng.dom("[data-control=menu]##{menu_id}").toggleClass CLASS.SHOW
 
   _closeMenu = (event) ->
     event.preventDefault()
@@ -45,43 +71,10 @@ Lungo.Boot.Events = do(lng = Lungo) ->
     parent = el.parent("[data-control=menu]").removeClass(CLASS.SHOW)
     lng.dom("[data-router=menu] > .icon").attr "class", "icon " + el.data("icon")
 
-  _loadAsyncTarget = (link) ->
-    lng.Notification.show()
-    lng.Resource.load link.data("async")
-    link[0].removeAttribute "data-async"
-    lng.Boot.Data.init link.attr(ATTRIBUTE.HREF)
-    setTimeout (->
-      _selectTarget link
-      lng.Notification.hide()
-    ), lng.Constants.TRANSITION.DURATION * 2
-
-  _selectTarget = (link) ->
-    lng.Aside.hide()  if link.closest(ELEMENT.ASIDE).length > 0
-    target_type = link.data(ATTRIBUTE.ROUTER)
-    target_id = link.attr(ATTRIBUTE.HREF)
-    switch target_type
-      when ELEMENT.SECTION
-        _goSection target_id
-      when ELEMENT.ARTICLE
-        _goArticle link
-      when ELEMENT.ASIDE
-        lng.Aside.toggle()
-      when ELEMENT.MENU
-        _goMenu target_id
-
-  _goSection = (id) ->
-    id = lng.Core.parseUrl(id)
-    if id is "#back"
-      lng.Router.back()
-    else
-      lng.Router.section id
-
-  _goArticle = (element) ->
-    section_id = lng.Router.History.current()
-    article_id = element.attr(ATTRIBUTE.HREF)
-    lng.Router.article section_id, article_id, element
-
-  _goMenu = (id) ->
-    lng.dom("[data-control=menu]" + id).toggleClass CLASS.SHOW
+  _changeCheckboxValue = (event) ->
+    event.preventDefault()
+    el = lng.dom(this)
+    current_value = (if el.val() > 0 then 0 else 1)
+    el.toggleClass("active").attr "value", current_value
 
   init: init

src/modules/Lungo.Attributes.coffee

@@ -54,4 +54,4 @@ Lungo.Attributes =
 
   back:
     selector: "header"
-    html: "<nav class=\"left\"><a href=\"#back\" data-router=\"section\" class=\"left\"><span class=\"icon {{value}}\"></span></a></nav>"
+    html: "<nav class=\"left\"><a href=\"#\" data-view-section=\"back\"><span class=\"icon {{value}}\"></span></a></nav>"

src/modules/Lungo.Constants.coffee

@@ -19,10 +19,16 @@ Lungo.Constants =
     LI                  : "li"
 
   QUERY:
-    LIST_IN_ELEMENT     : "article.list, aside.list"
-    ELEMENT_SCROLLABLE  : "aside.scroll, article.scroll"
+    ARTICLE_ROUTER      : "[data-view-article]"
+    SECTION_ROUTER      : "[data-view-section]"
+    ASIDE_ROUTER        : "[data-view-aside]"
+    MENU_ROUTER         : "[data-view-menu]"
+
+    LIST_IN_ELEMENT     : "article.list"
+    ELEMENT_SCROLLABLE  : "article.scroll"
     HREF_ASIDE          : "section[data-aside]"
     HREF_ROUTER         : "a[href][data-router]"
+
     MENU_HREF           : "[data-control=menu] a[href]"
     INPUT_CHECKBOX      : "input[type=range].checkbox"
     NAVIGATION_ITEM     : "a[href][data-router=\"article\"]"

src/stylesheets/lungo.media.tablet.styl

@@ -38,7 +38,7 @@
     &[data-children]
       width: 25%
 
-    & [data-router=aside]
+    & [data-view-aside]
       display: none !important
 
 @-webkit-keyframes showing