Updating non Smallfaces component.

> Hi Tim,
>  Let me see if I've understood what are you doing. You need to:
>
> -Create (or modify?) a LBCGoogleMap when a ListBox changes
> -Render or update the LBCGoogleMap when a Button is clicked.
>
> You said LBCGoogleMap is not a WAComponent, what it is? If it's a
> SFObject, then you can add to your SearcherInterface sending as
> argument of #addSubpane: message, as already knows how to answer
> #name (remember, it must answer #name properly, that is, not the #name
> method in Object).
>
> Then you can have:
>
> >>initialize
> ....
>   self addSubpane: self map
> ...
>
>
> >>map
>  ^LBCGoogleMap new
>     name: 'mapDisplay';  " configure the mapDisplay's name"
>     setCenter: model coordinates zoom: model zoom;
>     addControl: GControl largeMapControl;
>     setUIToDefault;
>     yourself.
>
> If when the list changes, you have to re-create the mapDisplay, in the
> #regionSelectionChanged "callback" (the message sent when the list is
> #changed) you should replace it as follows:
>
>  oldMap := self paneNamed: 'mapDisplay'.
>  self replacePane: oldMap with: self map
>
> And to refresh properly the mapDisplay it should be rendered inside a
> tag with id equals to its styleId, like this:
>
> LBCGoogleMap >>renderContentOn: aRenderer
>
>            aRenderer div
>                     id: self styleId;
>                 with: [ "render your component" ]
>
> and must answer #refreshOn: (please see #when:send:to:refresh: section
> in http://wiki.squeak.org/squeak/6093). You can implement it this way:
>
> refreshOn: aRenderer
>       "Support for the events"
>
>       self renderContentOn: aRenderer
>
>
> You will need to preserve the same #styleId, to do this simply send
> the message styleId: 'anyId' to the mapDisplay. Another way to solve
> this is adding a SFPanel which contains the mapDisplay and refresh it
> when the button is clicked.
>  
> Regards
> Juan M.
>
> On Thu, Aug 27, 2009 at 1:02 PM, Timothy James Ziebart
> <[hidden email] <mailto:[hidden email]>> wrote:
>
>     Hi All,
>
>     I have an object SearchInterface, a subclass of
>     WASmallFacesComposite.  On SearchInterface there are rendered a
>     number of SFListBoxes and SFButtons.  Included are three listboxes
>     that are cascaded and the control was created like this:
>
>     createRegionListBox
>       |pane panes list|
>         list := self session findCodeByParent: 'region'.
>         panes := OrderedCollection
>           with: ( self paneNamed: 'nhoodList')
>           with: ( self paneNamed: 'cityList').
>             pane := SFListBox new.
>       pane
>           name: 'regionList';
>           items: list;
>           lines: 5;
>           printSelector: #asString;
>           owner: self;
>           when: #changed:
>               send: #regionSelectionChanged:
>               to: self
>               refresh: panes.
>       ^pane
>
>     The listboxes work correctly.  What I need to do is have a
>     GoogleMap rendered on SearchInterfaces as well.  The map will not
>     be a WAComponent as I need to render it as new whenever the
>     listbox contents change.  But not before an Update button is
>     pressed.  Such as:
>
>     createUpdateButton
>
>       | pane panes |
>         panes := OrderedCollection with: (*self paneNamed: 'mapDisplay')*.
>       pane := SFButton new.
>       pane
>           label: 'Update Map';
>           name: 'updateButton';
>           when: #clicked
>               send: #updateButtonPressed
>               to: self
>               refresh: panes.
>       ^pane
>
>     The question is how do I create *mapDisplay*?  mapDisplay is
>     rendered like this everytime the update button is pressed.
>
>     map
>
>       ^LBCGoogleMap new
>           setCenter: model coordinates zoom: model zoom;
>           addControl: GControl largeMapControl;
>           setUIToDefault;
>           yourself.
>
>     Can I place it on a SmallFace component that will render as I
>     desire or do I replace it with non SmallFace components?  Thank
>     you for any assistance.
>
>     Tim
>     _______________________________________________
>     seaside mailing list
>     [hidden email]
>     <mailto:[hidden email]>
>     http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>  

> Tim
>
> Burella Juan M. wrote:
>>
>> Hi Tim,
>>  Let me see if I've understood what are you doing. You need to:
>>
>> -Create (or modify?) a LBCGoogleMap when a ListBox changes
>> -Render or update the LBCGoogleMap when a Button is clicked.
>>
>> You said LBCGoogleMap is not a WAComponent, what it is? If it's a
>> SFObject, then you can add to your SearcherInterface sending as
>> argument of #addSubpane: message, as already knows how to answer
>> #name (remember, it must answer #name properly, that is, not the #name
>> method in Object).
>>
>> Then you can have:
>>
>> >>initialize
>> ....
>>  self addSubpane: self map
>> ...
>>
>>
>> >>map
>>  ^LBCGoogleMap new
>>    name: 'mapDisplay';  " configure the mapDisplay's name"
>>    setCenter: model coordinates zoom: model zoom;
>>    addControl: GControl largeMapControl;
>>    setUIToDefault;
>>    yourself.
>>
>> If when the list changes, you have to re-create the mapDisplay, in the
>> #regionSelectionChanged "callback" (the message sent when the list is
>> #changed) you should replace it as follows:
>>
>>  oldMap := self paneNamed: 'mapDisplay'.
>>  self replacePane: oldMap with: self map
>>
>> And to refresh properly the mapDisplay it should be rendered inside a
>> tag with id equals to its styleId, like this:
>>
>> LBCGoogleMap >>renderContentOn: aRenderer
>>
>>           aRenderer div
>>                    id: self styleId;
>>                with: [ "render your component" ]
>>
>> and must answer #refreshOn: (please see #when:send:to:refresh: section
>> in http://wiki.squeak.org/squeak/6093). You can implement it this way:
>>
>> refreshOn: aRenderer
>>      "Support for the events"
>>
>>      self renderContentOn: aRenderer
>>
>>
>> You will need to preserve the same #styleId, to do this simply send
>> the message styleId: 'anyId' to the mapDisplay. Another way to solve
>> this is adding a SFPanel which contains the mapDisplay and refresh it
>> when the button is clicked.
>>  Regards
>> Juan M.
>>
>> On Thu, Aug 27, 2009 at 1:02 PM, Timothy James Ziebart
>> <[hidden email] <mailto:[hidden email]>> wrote:
>>
>>    Hi All,
>>
>>    I have an object SearchInterface, a subclass of
>>    WASmallFacesComposite.  On SearchInterface there are rendered a
>>    number of SFListBoxes and SFButtons.  Included are three listboxes
>>    that are cascaded and the control was created like this:
>>
>>    createRegionListBox
>>      |pane panes list|
>>        list := self session findCodeByParent: 'region'.
>>        panes := OrderedCollection
>>          with: ( self paneNamed: 'nhoodList')
>>          with: ( self paneNamed: 'cityList').
>>            pane := SFListBox new.
>>      pane
>>          name: 'regionList';
>>          items: list;
>>          lines: 5;
>>          printSelector: #asString;
>>          owner: self;
>>          when: #changed:
>>              send: #regionSelectionChanged:
>>              to: self
>>              refresh: panes.
>>      ^pane
>>
>>    The listboxes work correctly.  What I need to do is have a
>>    GoogleMap rendered on SearchInterfaces as well.  The map will not
>>    be a WAComponent as I need to render it as new whenever the
>>    listbox contents change.  But not before an Update button is
>>    pressed.  Such as:
>>
>>    createUpdateButton
>>
>>      | pane panes |
>>        panes := OrderedCollection with: (*self paneNamed: 'mapDisplay')*.
>>      pane := SFButton new.
>>      pane
>>          label: 'Update Map';
>>          name: 'updateButton';
>>          when: #clicked
>>              send: #updateButtonPressed
>>              to: self
>>              refresh: panes.
>>      ^pane
>>
>>    The question is how do I create *mapDisplay*?  mapDisplay is
>>    rendered like this everytime the update button is pressed.
>>
>>    map
>>
>>      ^LBCGoogleMap new
>>          setCenter: model coordinates zoom: model zoom;
>>          addControl: GControl largeMapControl;
>>          setUIToDefault;
>>          yourself.
>>
>>    Can I place it on a SmallFace component that will render as I
>>    desire or do I replace it with non SmallFace components?  Thank
>>    you for any assistance.
>>
>>    Tim
>>    _______________________________________________
>>    seaside mailing list
>>    [hidden email]
>>    <mailto:[hidden email]>
>>    http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>
>>
>> ------------------------------------------------------------------------
>>
>> _______________________________________________
>> seaside mailing list
>> [hidden email]
>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>
>
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>

> Hi Tim
>
> 2009/8/27 Timothy James Ziebart <[hidden email]>:
>  
>> Hi Juan,  thanks for responding.
>> The google map is an object that implements a renderOn method.  It is the
>> GoogleMaps package by James Foster.
>>  http://seaside.gemstone.com/ss/GoogleMaps.
>> I have created WAComponent and non WAComponent versions.  I do not have a
>> SmallFace equivalent widget.   Maybe that is my question - is it possible to
>> build a SmallFaces widget that will take advantage of the features
>> available?
>>    
>
> Yes, it is possible. There are several ways, we could add to SF a
> wrapper with the necessary protocol to refresh some non SF component.
> The necessary protocol is:
>
> #name , #name:
> #styleId , #styleId:
> #refreshOn:
>
> Or you can make a GoogleMap's subclass with this protocol.
>
> Anyway, in your case and from what I've seen of the GoogleMap
> component, I think it works evaluating Javascript, I don't know if it
> will be enough just redrawing the component, maybe you need to
> evaluate javascript too. In SF, each control knows how to redraw
> itself with #refreshOn:. In the next SmallFaces version (available
> this weekend in SqS) we updated this message to take as argument a
> SUScript, to do such things.
>
> Cheers
>
> Hernán
>
>  
>> Tim
>>
>> Burella Juan M. wrote:
>>    
>>> Hi Tim,
>>>  Let me see if I've understood what are you doing. You need to:
>>>
>>> -Create (or modify?) a LBCGoogleMap when a ListBox changes
>>> -Render or update the LBCGoogleMap when a Button is clicked.
>>>
>>> You said LBCGoogleMap is not a WAComponent, what it is? If it's a
>>> SFObject, then you can add to your SearcherInterface sending as
>>> argument of #addSubpane: message, as already knows how to answer
>>> #name (remember, it must answer #name properly, that is, not the #name
>>> method in Object).
>>>
>>> Then you can have:
>>>
>>>      
>>>>> initialize
>>>>>          
>>> ....
>>>  self addSubpane: self map
>>> ...
>>>
>>>
>>>      
>>>>> map
>>>>>          
>>>  ^LBCGoogleMap new
>>>    name: 'mapDisplay';  " configure the mapDisplay's name"
>>>    setCenter: model coordinates zoom: model zoom;
>>>    addControl: GControl largeMapControl;
>>>    setUIToDefault;
>>>    yourself.
>>>
>>> If when the list changes, you have to re-create the mapDisplay, in the
>>> #regionSelectionChanged "callback" (the message sent when the list is
>>> #changed) you should replace it as follows:
>>>
>>>  oldMap := self paneNamed: 'mapDisplay'.
>>>  self replacePane: oldMap with: self map
>>>
>>> And to refresh properly the mapDisplay it should be rendered inside a
>>> tag with id equals to its styleId, like this:
>>>
>>> LBCGoogleMap >>renderContentOn: aRenderer
>>>
>>>           aRenderer div
>>>                    id: self styleId;
>>>                with: [ "render your component" ]
>>>
>>> and must answer #refreshOn: (please see #when:send:to:refresh: section
>>> in http://wiki.squeak.org/squeak/6093). You can implement it this way:
>>>
>>> refreshOn: aRenderer
>>>      "Support for the events"
>>>
>>>      self renderContentOn: aRenderer
>>>
>>>
>>> You will need to preserve the same #styleId, to do this simply send
>>> the message styleId: 'anyId' to the mapDisplay. Another way to solve
>>> this is adding a SFPanel which contains the mapDisplay and refresh it
>>> when the button is clicked.
>>>  Regards
>>> Juan M.
>>>
>>> On Thu, Aug 27, 2009 at 1:02 PM, Timothy James Ziebart
>>> <[hidden email] <mailto:[hidden email]>> wrote:
>>>
>>>    Hi All,
>>>
>>>    I have an object SearchInterface, a subclass of
>>>    WASmallFacesComposite.  On SearchInterface there are rendered a
>>>    number of SFListBoxes and SFButtons.  Included are three listboxes
>>>    that are cascaded and the control was created like this:
>>>
>>>    createRegionListBox
>>>      |pane panes list|
>>>        list := self session findCodeByParent: 'region'.
>>>        panes := OrderedCollection
>>>          with: ( self paneNamed: 'nhoodList')
>>>          with: ( self paneNamed: 'cityList').
>>>            pane := SFListBox new.
>>>      pane
>>>          name: 'regionList';
>>>          items: list;
>>>          lines: 5;
>>>          printSelector: #asString;
>>>          owner: self;
>>>          when: #changed:
>>>              send: #regionSelectionChanged:
>>>              to: self
>>>              refresh: panes.
>>>      ^pane
>>>
>>>    The listboxes work correctly.  What I need to do is have a
>>>    GoogleMap rendered on SearchInterfaces as well.  The map will not
>>>    be a WAComponent as I need to render it as new whenever the
>>>    listbox contents change.  But not before an Update button is
>>>    pressed.  Such as:
>>>
>>>    createUpdateButton
>>>
>>>      | pane panes |
>>>        panes := OrderedCollection with: (*self paneNamed: 'mapDisplay')*.
>>>      pane := SFButton new.
>>>      pane
>>>          label: 'Update Map';
>>>          name: 'updateButton';
>>>          when: #clicked
>>>              send: #updateButtonPressed
>>>              to: self
>>>              refresh: panes.
>>>      ^pane
>>>
>>>    The question is how do I create *mapDisplay*?  mapDisplay is
>>>    rendered like this everytime the update button is pressed.
>>>
>>>    map
>>>
>>>      ^LBCGoogleMap new
>>>          setCenter: model coordinates zoom: model zoom;
>>>          addControl: GControl largeMapControl;
>>>          setUIToDefault;
>>>          yourself.
>>>
>>>    Can I place it on a SmallFace component that will render as I
>>>    desire or do I replace it with non SmallFace components?  Thank
>>>    you for any assistance.
>>>
>>>    Tim
>>>    _______________________________________________
>>>    seaside mailing list
>>>    [hidden email]
>>>    <mailto:[hidden email]>
>>>    http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>>
>>>
>>> ------------------------------------------------------------------------
>>>
>>> _______________________________________________
>>> seaside mailing list
>>> [hidden email]
>>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>>
>>>      
>> _______________________________________________
>> seaside mailing list
>> [hidden email]
>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>
>>    
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>  

> Hi Tim,
>
> Yes, the problem is #refreshOn: and...I think you need to call
> #replace. From what I've seen of the GoogleMap component,
> you could do something like this
>
> LBCMapComponent>>refreshOn: aScript
>
>     aScript element
>         id: self styleId;
>         replace:[:render | render render: self].
>
>     aScript add: (SUStream new
>             nextPutAll:  '(',self map updateMapScript, ').call';
>             arguments: #();
>             yourself).
>
>
> LBCGoogleMap>>updateMapScript
>
>     | myStream listenerString functionString |
>     myStream := (WriteStream on: String new)
>         nextPutAll: 'function ';
>         nextPutAll: 'updateMap(){'; cr; tab;
>         nextPutAll: 'if(google.maps.BrowserIsCompatible()){'; cr; tab;
> tab;
>         nextPutAll: 'var mapOptions=';
>         yourself.
>     options printOn: myStream.
>     myStream
>         nextPutAll: ';'; cr; tab; tab;
>         nextPutAll: 'var map=new
> google.maps.Map2(document.getElementById("';
>         nextPutAll: htmlID;
>         nextPutAll: '"),mapOptions);'; cr; tab; tab;
>         nextPutAll: '// *** custom script below'; cr;
>         nextPutAll: stream contents; cr; tab; tab;
>         nextPutAll: '// *** custom script above'; cr; tab; tab;
>         nextPutAll: variable;
>         nextPutAll: '=map;';
>         yourself.
>     listenerString := 'google.maps.Event.addListener(' , variable , ', "'.
>     functionString := self functionString.
>     eventHandlers keysDo: [:event |
>         myStream cr; tab; tab;
>             nextPutAll: listenerString;
>             nextPutAll: event;
>             nextPutAll: functionString;
>             nextPutAll: event;
>             nextPutAll: '&x=" + x + "&y=" + y + "&z=" + z)'; cr; tab;
> tab;
>             nextPutAll: '});    // end anonymous function and
> addListener()';
>             yourself.
>     ].
>     ^myStream cr; tab;
>         nextPutAll: '}    // end BrowserIsCompatible()'; cr;
>         nextPutAll: '}    // end ';
>         nextPutAll: variable;
>         nextPutAll: 'Init()'; cr;
>         contents.
>
> Maybe it isn't the best solution, but it should work fine
> Cheers,
> Juan M.
>
>
> On Wed, Sep 16, 2009 at 10:05 PM, Timothy James Ziebart
> <[hidden email] <mailto:[hidden email]>> wrote:
>
>     Ok gentlemen I am hoping you can comment on whether or not this
>     has been done properly.  I have created two subpanes (there are 8
>     in total).  By the way I have 3 listboxes dynamically changing the
>     list contents -- so it is working perfectly but for one hurdle.
>
>     *createMapPane
>         | pane |
>        
>         pane := LBCMapComponent new.
>         pane name: 'mapDisplay'.
>         pane styleId: self liveMapId.
>         pane model: model.
>         ^pane.*
>
>     *
>     createRegionListBox
>         | pane panes list |
>         list := self session findCodeByParent: 'region'.
>         panes := OrderedCollection
>                     with: (self paneNamed: 'nhoodList')
>                     with: (self paneNamed: 'cityList')
>                     with: (self paneNamed: 'mapDisplay').
>
>         pane := SFListBox new.
>         pane name: 'regionList';
>              items: list;
>              lines: 5;
>              printSelector: #asString;
>              owner: self;
>            
>             when: #changed:
>             send: #regionSelectionChanged:
>             to: self
>             refresh: panes.
>         ^ pane
>     *
>
>     The map pane is to be updated when a change has been triggered in
>     regionList.  When regionList is change the regionSelectionChanged
>     method is called which in turn calls updatePane when completed.
>
>     *updatePane
>         self updateRegionPane; updateCityPane; updateHoodPane;
>     updateMapPane*
>
>     The updateMapPane executes the following:
>
>     *updateMapPane
>         | pane newpane|
>
>         pane := self paneNamed: 'mapDisplay'.
>         newpane := LBCMapComponent new.
>         newpane
>             model: model;
>             styleId: self liveMapId;
>             name: 'mapDisplay'.
>            
>         self replacePane: pane with: newpane.*
>
>     which in turn fires the refreshOn: method is on LBCMapComponent.
>
>     *refreshOn: aScript
>
>
>         aScript element
>             id: self styleId;
>             replace:[:render | render render: self].
>
>         "I am not sure what needs to be done here"
>         aScript add: [ ]*
>
>     which will in turn execute renderOn:
>
>     *renderOn: html
>         |myMap|
>         myMap := self map.
>
>         myMap renderOn: html.*
>
>     where map returns
>
>     *
>     map
>
>         ^LBCGoogleMap new
>             setCenter: model coordinates zoom: model zoom;
>             setUIToDefault;
>             yourself.*
>
>     All the components are updated correctly however the map does not
>     redraw.  If I refresh the browser than the map draws correctly --
>     so it has to do with the script in the refreshOn method, correct?
>     If so I, my ignorance of javascript has left me at a loss as to
>     what needs to be done.  Do I need to call replace?  Any
>     suggestions?  Thank you in advance.
>
>
>>     _______________________________________________
>>     seaside mailing list
>>     [hidden email] <mailto:[hidden email]>
>>     http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>      
>
>
>
>
>     _______________________________________________
>     seaside mailing list
>     [hidden email]
>     <mailto:[hidden email]>
>     http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>