20160706-migrate-davaz-com-dojo-widgets

<< 20160708-migrate-davaz-com-dojo-widgets | Index | 20160706-migrate-davaz-com-dojo-widgets >>

Summary

• Migrate custom dojo widgets and javascript codes to 1.7

Commits / Patches / Pull Requests, Scripts

• Improve dojotoolkit [pull request, htmlgrid]
• Make OneLiner widget to work with dojo 1.7 [commit, davaz.com]
• Make tooltip to work [commit, davaz.com]

Index

• dojo Widgets
• Review of htmlgrid component
• Tooltip widget

Dojo Widgets

• Desk.js
• EditButtons.js
• EditWidget.js
• GuestbookWidget.js
• Input.js
• InputText.js
• InputTextarea.js
• LoginWidget.js
• [x] OneLiner.js
• Rack.js
• Show.js
• SlideShow.js
• [x] Ticker.js
• Tooltip.js

Review of htmlgrid component

HtmrGrid::Div extends HtmlGrid::Component.
This is difference of div and component.

module HtmlGrid                                                                 
  class Div < Component                                                         
    def to_html(context)                                                        
      context.div(@attributes) {                                                
        super << dynamic_html(context)                                          
      }                                                                         
    end                                                                         
  end                                                                           
end

HtmlGrid::Div's to_html calls dynamic_html
HtmlGrid::Component defines dynamic_html as just a method to return empty string ''
But, If you use Dojotoolkit in htmlgrid (as require), then its overrides this dynamic_html unless its class (mostly child of HtmlGrid::Component) has dojo_dynamic_html, and it provieds tooltip support.

In this behavior, Some tooltip in davaz.com has a little bit problem. (@dojo_tooltip)
And this problem disturbs loading of other widgets (z.B. OneLiner)

Update htmlgrid dojo support

HtmlGrid::Dojotoolkit has still some syntax for old version dojo.
I've made a pull request to remove completely old syntax.

This needs >= 1.7.0 (I think >= 1.8 also works)

• Improve dojotoolkit [pull request, htmlgrid]

data-dojo-type

By Dojo 1.8 release note,

The Parser now supports the use of Module IDs (MID) when specifying the data-dojo-type in declarative markup (#13778).
 Developers should use the MID in their code to ensure future compatibility with baseless modules. 
See below for information on Auto Require which compliments this feature.

>= 1.8, / is also supported.

<div data-dojo-type="dijit/layout/ContentPane">
  <button data-dojo-type="dijit/form/Button">Click Me!</button>
</div>

But < 1.8, it must be .:

<div data-dojo-type="dijit.layout.ContentPane">
  <button data-dojo-type="dijit.form.Button">Click Me!</button>
</div>

Tooltip widget

Next, I will migrate tooltip widget to 1.7.

It seems hta davaz.com does not use ywesee.widget.Tooltip any more. It uses tooltip support via htmlgrid (dijit/Tooltip).

But dijit/Tooltip does not have href attributue (any more).

So, I've created by my self using TooltipDialog

• https://dojotoolkit.org/api/?qs=1.7/dijit/TooltipDialog
• http://dojotoolkit.org/reference-guide/1.7/dijit/TooltipDialog.html
• https://dojotoolkit.org/reference-guide/1.7/dijit/popup.html

It works, but I don't know that how should it looks like... (Because current production davaz.com does not have vaild tooltip)
Finaly, I've made tooltip popup like this:

• Make tooltip to work [commit, davaz.com]

2 Tooltips work.

• Photo Davaz
• Bottleneck