Hi Bill,
Quick notes that may help ( for how htmx works please have a look at
https://htmx.org )
A. about htmx
A.1. HTMX response is expected to be HTML snippet, ( not json, or xml ).
A.2. HTMX will insert the response inside an existing html tag ( innerHTML
) or replace existing ( outerHTML ).
B. htmx and ofbiz ( still ofbiz )
B.1. Everything in programming with OFBiz is the same, nothing changed.
B.2. The UI ( currently tested for use with freemarker only ) .
B.3. Just include the htmx javascript in your Header.ftl ( ofbiz themes ).
<script src="https://unpkg.com/htmx.org@2.0.3";></script>
B.4. Controller request map is the same, but view map type will be *(ftl =
freemarker ) *and that is still ofbiz way*.*
<view-map name="countries" *type="ftl"*
page="component://ofbizHtmx/template/*select_options.ftl*" />
B.5. In the ftl ( select_options.ftl ) just include html snippets you need
( no full page required ) ,
for example the following will return the <option> tag/s accordingly .
<#if requestAttributes.options?has_content>
<#list requestAttributes.options as opt>
<option value="${opt.id}">
${opt.text}
</option>
</#list>
<#else>
<option>....no thing...</option>
</#if>
B.6 For the following repo ( Just start from the controller and trace the
flow till you reach the UI )
https://github.com/OmarAbdullwahhab/ofbiz-htmx
<https://github.com/OmarAbdullwahhab/ofbiz-htmx>
1. flow of main request -till-> ui screen.
2. flow of sayDate request -till-> ui screen.
3. flow of countries request -till-> ui screen.
4. flow of regions request -till-> ui screen.
B.7 Hope that, this week I can do more complex examples.
B.8 Good video to watch (concepts apply to OFBiz)
https://youtu.be/POK4Zp1oRN8
Best Regards
On Tue, Nov 5, 2024 at 3:17 AM Bill Harder <bhar...@osz.com> wrote:
> Speaking for myself I would love to see HTMX in action but don't have the
> time nor the inclination to download, apply and install.
>
> Is there a possibility to do a 1 or 2 minute YouTube video with the
> highlights?
>
> Thanks.
>
> Bill
>
> On Mon, Nov 4, 2024 at 1:48 AM Omar Abdullwahhab <
> omar.abdullwah...@gmail.com> wrote:
>
> > +1
> >
> > On Mon, Nov 4, 2024 at 12:22 PM Jacques Le Roux <
> > jacques.le.r...@les7arts.com> wrote:
> >
> > > Hi Michael,
> > >
> > > I totally agree.
> > >
> > > Jacques
> > >
> > > Le 04/11/2024 à 10:10, Michael Brohl a écrit :
> > > > Hi Jacques,
> > > >
> > > > > @All, note that for now the plugin alone will not work. It needs
> > > htmx.org dependencies in themes header. I think we can put that in
> > > common-theme
> > > > using https://www.npmjs.com/package/htmx.org And then extend the use
> > of
> > > htmx.org. What do you think?
> > > >
> > > > I assume that we are in an early stage of evaluation and everything
> > > should either be happening in personal repos or in a feature branch.
> > > >
> > > > Before we commit anything I trunk, we should have a discussion and
> > > decision if this should go into the codebase. Please do not do this
> > > evaluation
> > > > work in the main branches.
> > > >
> > > > Best regards,
> > > >
> > > > Michael Brohl
> > > >
> > > > ecomify GmbH - www.ecomify.de
> > > >
> > > >
> > > > Am 04.11.24 um 07:11 schrieb Jacques Le Roux:
> > > >> Hi Omar,
> > > >>
> > > >> I reckon that you mean "If using my OFBiz clone". Yes I did and put
> it
> > > in the theme header. The issue was that, because of irreplaceable
> > > >> //extensions, my main browser is still FF 56.0.02 and there HTMX
> does
> > > not work.
> > > >>
> > > >> Both "Say Date" and the dependent drop downs are working like a
> charm
> > > in Edge (still on Win 7).
> > > >>
> > > >> When I look at
> > >
> >
> https://github.com/OmarAbdullwahhab/ofbiz-htmx/blob/main/template/Main.ftl
> > > sounds quite promising!
> > > >>
> > > >> Thanks for your work
> > > >>
> > > >> @All, note that for now the plugin alone will not work. It needs
> > > htmx.org dependencies in themes header. I think we can put that in
> > > common-theme
> > > >> using https://www.npmjs.com/package/htmx.org And then extend the
> use
> > > of htmx.org. What do you think?
> > > >>
> > > >> Jacques
> > > >>
> > > >> Le 04/11/2024 à 00:36, Omar Abdullwahhab a écrit :
> > > >>> If not using my OFBiz clone,
> > > >>> Please check if the htmx javascript file is present in your theme.
> > > >>>
> > > >>> <script src="https://unpkg.com/htmx.org@2.0.3";
> > > >>>
> > >
> >
> integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq"
> > > >>> crossorigin="anonymous"></script>
> > > >>>
> > > >>> Best regards.
> > > >>>
> > > >>> On Sun, Nov 3, 2024 at 10:43 PM Jacques Le Roux <
> > > >>> jacques.le.r...@les7arts.com> wrote:
> > > >>>
> > > >>>> BTW, no errors in log at all
> > > >>>>
> > > >>>> Le 03/11/2024 à 20:40, Jacques Le Roux a écrit :
> > > >>>>> I did, my bad forgot to load HTMX data. Then after sign in and
> > using
> > > the
> > > >>>> Rainbow stone theme the UI did not work as expected. I see the UI,
> > but
> > > >>>>> clicking on "Say Date" button and opening Cascade selects nothing
> > > >>>> happens.
> > > >>>>> Anyway I think not much is missing. We will see that...
> > > >>>>>
> > > >>>>> Note: using Win7 and Edge
> > > >>>>>
> > > >>>>>
> > > >>>>> Le 03/11/2024 à 18:48, Omar Abdullwahhab a écrit :
> > > >>>>>> **Now please try the plugin using my clone of the framework
> repo
> > > (htmx
> > > >>>>>> ready in all themes)
> > > >>>>>>
> > > >>>>>> On Sun, Nov 3, 2024 at 8:46 PM Omar Abdullwahhab <
> > > >>>>>> omar.abdullwah...@gmail.com> wrote:
> > > >>>>>>
> > > >>>>>>> Hi Jacques ,
> > > >>>>>>> It has no effect at all,
> > > >>>>>>> What I have noticed only is when I was changing the theme
> > > >>>>>>> I got the early response from the server for the auto timer,
> > > >>>>>>>
> > > >>>>>>> You may have seen this too with something like json response,
> > > >>>>>>>
> > > >>>>>>> Consider the following scenario.
> > > >>>>>>> 1. You send a change theme request to the server.
> > > >>>>>>> 2. An Auto client side code sends anything in the background to
> > the
> > > >>>> server
> > > >>>>>>> (like in my htmx case).
> > > >>>>>>> 3. You expect that the server will redirect you to the referrer
> > > page (
> > > >>>> the
> > > >>>>>>> last before step 1).
> > > >>>>>>> 4. Instead the server responded early for the ( step 2 )
> request.
> > > >>>>>>> 5. So that you get an unexpected response which was intended
> for
> > > >>>>>>> background.
> > > >>>>>>>
> > > >>>>>>> IMO, This issue can be the same when you login too.
> > > >>>>>>> Whatever lets track this in OFBiz request handling,
> > > >>>>>>> it's not that big an issue, but it's annoying.
> > > >>>>>>>
> > > >>>>>>> Now please try the plugin to my clone of the framework repo
> > (htmx
> > > >>>> ready
> > > >>>>>>> in all themes)
> > > >>>>>>> https://github.com/OmarAbdullwahhab/ofbiz-framework.git
> > > >>>>>>> And it should work as expected (tested in all themes and still
> > > >>>> fantastic),
> > > >>>>>>> Java 21.
> > > >>>>>>>
> > > >>>>>>> TIA and Best Regards
> > > >>>>>>>
> > > >>>>>>>
> > > >>>>>>>
> > > >>>>>>>
> > > >>>>>>> On Sun, Nov 3, 2024 at 7:00 PM Jacques Le Roux <
> > > >>>>>>> jacques.le.r...@les7arts.com> wrote:
> > > >>>>>>>
> > > >>>>>>>> I did not look into code yet, admin/ofbiz can't sign in,
> normal?
> > > >>>>>>>>
> > > >>>>>>>> TIA
> > > >>>>>>>>
> > > >>>>>>>> Le 03/11/2024 à 16:32, Omar Abdullwahhab a écrit :
> > > >>>>>>>>> You are welcome
> > > >>>>>>>>>
> > > >>>>>>>>> On Sun, Nov 3, 2024, 6:32 PM Omar Abdullwahhab <
> > > >>>>>>>> omar.abdullwah...@gmail.com>
> > > >>>>>>>>> wrote:
> > > >>>>>>>>>
> > > >>>>>>>>>> Yes I used it with the current OFBiz trunk repo,
> > > >>>>>>>>>> And the rainbowstone theme.
> > > >>>>>>>>>>
> > > >>>>>>>>>> On Sun, Nov 3, 2024, 6:30 PM Jacques Le Roux <
> > > >>>>>>>> jacques.le.r...@les7arts.com>
> > > >>>>>>>>>> wrote:
> > > >>>>>>>>>>
> > > >>>>>>>>>>> Thanks that's easier I guess
> > > >>>>>>>>>>>
> > > >>>>>>>>>>> Jacques
> > > >>>>>>>>>>>
> > > >>>>>>>>>>> Le 03/11/2024 à 16:25, Omar Abdullwahhab a écrit :
> > > >>>>>>>>>>>> Hi Jacques,
> > > >>>>>>>>>>>> I have made a simple plugin
> > > >>>>>>>>>>>> Which shows cascading select , using Geo Entity
> > > >>>>>>>>>>>> Another one is for auto trigger which gets the sayDate
> > service
> > > >>>>>>>>>>>> Every 3 seconds.
> > > >>>>>>>>>>>> Here is the link for the plugin repo.
> > > >>>>>>>>>>>>
> > > >>>>>>>>>>>> https://github.com/OmarAbdullwahhab/ofbiz-htmx
> > > >>>>>>>>>>>>
> > > >>>>>>>>>>>> I will add more example also with one fantastic thing
> > > >>>>>>>>>>>> Which is called ( web components) that will be a very nice
> > > >>>>>>>>>>>> And seamlessly fits the OFBiz way.
> > > >>>>>>>>>>>> https://youtu.be/-USODEI-kgg
> > > >>>>>>>>>>>>
> > > >>>>>>>>>>>>
> > > >>>>>>>>>>>> On Sun, Nov 3, 2024 at 11:19 AM Jacques Le Roux <
> > > >>>>>>>>>>>> jacques.le.r...@les7arts.com> wrote:
> > > >>>>>>>>>>>>
> > > >>>>>>>>>>>>> Thanks Omar,
> > > >>>>>>>>>>>>>
> > > >>>>>>>>>>>>> I'll have a look again...
> > > >>>>>>>>>>>>>
> > > >>>>>>>>>>>>> Jacques
> > > >>>>>>>>>>>>>
> > > >>>>>>>>>>>>> Le 01/11/2024 à 20:35, Omar Abdullwahhab a écrit :
> > > >>>>>>>>>>>>>> Hi Jacques,
> > > >>>>>>>>>>>>>> You are most welcome.
> > > >>>>>>>>>>>>>> For the complex examples , I will prepare it through
> this
> > > week.
> > > >>>>>>>>>>>>>> For the error you got it's really not clear,
> > > >>>>>>>>>>>>>> But I think its may be related to @ symbole,
> > > >>>>>>>>>>>>>> Try download htmx file instead of using the unpkg site.
> > > >>>>>>>>>>>>>> And include it with the theme js files as normal.
> > > >>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>> Regards
> > > >>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>> On Fri, Nov 1, 2024 at 1:39 PM Jacques Le Roux <
> > > >>>>>>>>>>>>> jacques.le.r...@les7arts.com>
> > > >>>>>>>>>>>>>> wrote:
> > > >>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> Thanks Omar,
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> Got this error in js console:
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> TypeError: Not enough arguments to
> > > >>>>>>>>>>> XPathEvaluator.createExpression.
> > > >>>>>>>>>>>>>>> htmx<https://unpkg.com/htmx.org@2.0.3:1:23876
> > > >>>>>>>>>>>>>>> <anonyme>https://unpkg.com/htmx.org@2.0.3:1:10
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> No ideas what's wrong. I used product as component. I
> put
> > > my
> > > >>>>>>>> patch at
> > > >>>>>>>>>>>>>>> http://les7arts.com/htmx.patch
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> BTW, someone know what has replacedhttps://
> > > paste.apache.org ?
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> TIA
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> Jacques
> > > >>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>> Le 31/10/2024 à 15:25, Omar Abdullwahhab a écrit :
> > > >>>>>>>>>>>>>>>> Sorry
> > > >>>>>>>>>>>>>>>> 8. the java service
> > > >>>>>>>>>>>>>>>> public class HtmxServices {
> > > >>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>> public static Map<String,Object>
> > > >>>> sayDate(DispatchContext
> > > >>>>>>>>>>>>>>>> dispatchContext, Map<String,Object> context){
> > > >>>>>>>>>>>>>>>> var result =
> ServiceUtil.returnSuccess();
> > > >>>>>>>>>>>>>>>> result.put("currentDate",
> > > >>>>>>>>>>> LocalDateTime.now().toString());
> > > >>>>>>>>>>>>>>>> return result;
> > > >>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>> }
> > > >>>>>>>>>>>>>>>> }
> > > >>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>> On Thu, Oct 31, 2024 at 5:07 PM Omar Abdullwahhab <
> > > >>>>>>>>>>>>>>>> omar.abdullwah...@gmail.com> wrote:
> > > >>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> OK
> > > >>>>>>>>>>>>>>>>> For you not to waste your time,
> > > >>>>>>>>>>>>>>>>> Just a quick example
> > > >>>>>>>>>>>>>>>>> I have made
> > > >>>>>>>>>>>>>>>>> 1. first insert the following htmx link in the
> > > Header.ftl in
> > > >>>> the
> > > >>>>>>>>>>> theme
> > > >>>>>>>>>>>>>>> you
> > > >>>>>>>>>>>>>>>>> are using
> > > >>>>>>>>>>>>>>>>> <script src="https://unpkg.com/htmx.org@2.0.3
> > "></script>
> > > >>>>>>>>>>>>>>>>> 2. Controller.xml
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <!-- Request Mappings -->
> > > >>>>>>>>>>>>>>>>> <request-map uri="main">
> > > >>>>>>>>>>>>>>>>> <security https="true" auth="true"/>
> > > >>>>>>>>>>>>>>>>> <response name="success" type="view"
> > > value="main"/>
> > > >>>>>>>>>>>>>>>>> </request-map>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <request-map uri="sayDate">
> > > >>>>>>>>>>>>>>>>> <security https="true" auth="true"/>
> > > >>>>>>>>>>>>>>>>> <event type="service" invoke="sayDate"/>
> > > >>>>>>>>>>>>>>>>> <response name="success" type="view"
> > > >>>>>>>>>>> value="sayDate"></response>
> > > >>>>>>>>>>>>>>>>> </request-map>
> > > >>>>>>>>>>>>>>>>> <!-- View Mappings -->
> > > >>>>>>>>>>>>>>>>> <view-map name="main" type="screen"
> > > >>>>
> > >
> >
> page="component://ofbizFreemarker/widget/OfbizFreemarkerScreens.xml#main"/>
> > > >>>>>>>>>>>>>>>>> <view-map name="sayDate" type="ftl"
> > > >>>>>>>>>>>>>>>
> > page="component://ofbizFreemarker/templates/say_date.ftl"/>
> > > >>>>>>>>>>>>>>>>> 3. services.xml
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <service name="noSyntaxError" engine="interface">
> > > >>>>>>>>>>>>>>>>> <description>
> > > >>>>>>>>>>>>>>>>> Dummy service to prevent empty files
> and
> > > syntax
> > > >>>>>>>> error -
> > > >>>>>>>>>>>>> Remove
> > > >>>>>>>>>>>>>>> when the 1st real service will be added here
> > > >>>>>>>>>>>>>>>>> </description>
> > > >>>>>>>>>>>>>>>>> </service>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <service name="sayDate" engine="java"
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>> location="org.apache.ofbiz.ofbizfreemarker.HtmxServices"
> > > >>>>>>>>>>>>>>>>> invoke="sayDate">
> > > >>>>>>>>>>>>>>>>> <attribute name="currentDate" type="String"
> > > >>>> mode="OUT"
> > > >>>>>>>>>>>>>>> default-value=""/>
> > > >>>>>>>>>>>>>>>>> </service>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> 4. XXXScreens.xml
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <screen name="main">
> > > >>>>>>>>>>>>>>>>> <section>
> > > >>>>>>>>>>>>>>>>> <actions>
> > > >>>>>>>>>>>>>>>>> <set field="headerItem"
> > > value="main"/><!--
> > > >>>> this
> > > >>>>>>>>>>>>> highlights
> > > >>>>>>>>>>>>>>> the selected menu-item with name "main" -->
> > > >>>>>>>>>>>>>>>>> </actions>
> > > >>>>>>>>>>>>>>>>> <widgets>
> > > >>>>>>>>>>>>>>>>> <decorator-screen
> > > >>>>>>>>>>> name="OfbizFreemarkerCommonDecorator"
> > > >>>>>>>>>>>>>>> location="${parameters.mainDecoratorLocation}">
> > > >>>>>>>>>>>>>>>>> <decorator-section name="body">
> > > >>>>>>>>>>>>>>>>> <platform-specific>
> > > >>>>>>>>>>>>>>>>> <html><html-template
> > > >>>> location="component://ofbizFreemarker/templates/Main.ftl"/></html>
> > > >>>>>>>>>>>>>>>>> </platform-specific>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> </decorator-section>
> > > >>>>>>>>>>>>>>>>> </decorator-screen>
> > > >>>>>>>>>>>>>>>>> </widgets>
> > > >>>>>>>>>>>>>>>>> </section>
> > > >>>>>>>>>>>>>>>>> </screen>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> 5. Main.ftl
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <button hx-get="<@ofbizUrl>sayDate</@ofbizUrl>"
> > > >>>>>>>>>>>>>>> hx-target="#responseDiv" hx-swap="outerHTML">
> > > >>>>>>>>>>>>>>>>> Say Date
> > > >>>>>>>>>>>>>>>>> </button>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <div id="responseDiv">
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> </div>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> 6. say_date.ftl
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> <div id="responseDiv">
> > > >>>>>>>>>>>>>>>>> <h4>${requestAttributes.currentDate}</h4>
> > > >>>>>>>>>>>>>>>>> </div>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> 7. That's all.
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>> On Thu, Oct 31, 2024 at 4:42 PM Jacques Le Roux <
> > > >>>>>>>>>>>>>>>>> jacques.le.r...@les7arts.com> wrote:
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>> Great,
> > > >>>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>> That sound to confirm again
> > > >>>>>>>>>>>>>>>>>>
> > > >>>>>>>>
> > https://lists.apache.org/thread/pxoq4484jws79jvw3ct501nt3t26hlyw
> > > >>>>>>>>>>>>>>>>>> We really need to seriously investigate now...
> > > >>>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>> Jacques
> > > >>>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>> Le 31/10/2024 à 14:25, Omar Abdullwahhab a écrit :
> > > >>>>>>>>>>>>>>>>>>> Hi All.
> > > >>>>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>>> Today I was playing around the client side in
> OFBIZ,
> > > >>>>>>>>>>>>>>>>>>> I'm actually not a fan of JS or its frameworks.
> > > >>>>>>>>>>>>>>>>>>> I tried making a test to replace it with htmx.
> > > >>>>>>>>>>>>>>>>>>> It was very good and easy to integrate with OFBiz
> and
> > > >>>>>>>> Freemarker.
> > > >>>>>>>>>>>>>>>>>>> Please have a look
> > > >>>>>>>>>>>>>>>>>>> https://htmx.org/docs/
> > > >>>>>>>>>>>>>>>>>>> I am sure it will be a proven technology for OFBiz.
> > > >>>>>>>>>>>>>>>>>>> Regards
> > > >>>>>>>>>>>>>>>>> --
> > > >>>>>>>>>>>>>>>>> Omar Abu-Arab
> > > >>>>>>>>>>>>>>>>> Java Engineer
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>>>>>>>>>>>>
> > > >>>>>>> --
> > > >>>>>>> Omar Abu-Arab
> > > >>>>>>> Java Engineer
> > > >>>>>>>
> > > >>>>>>>
> > > >>>
> > >
> >
> >
> > --
> > Omar Abu-Arab
> > Java Engineer
> >
>
>
> --
> Bill Harder
> OsZ Technologies
> 256 N State St
> Ste D
> Hemet, CA 92543
>
> Voice: 818-632-5790
>
> eMail: bhar...@osz.com
> www: www.osz.com
>
--
Omar Abu-Arab
Java Engineer
