Twig Function Semantic Naming

General discussion of development ideas and the approaches taken in the 3.x branch of phpBB. The current feature release of phpBB 3 is 3.3/Proteus.
Forum rules
Please do not post support questions regarding installing, updating, or upgrading phpBB 3.3.x. If you need support for phpBB 3.3.x please visit the 3.3.x Support Forum on phpbb.com.

If you have questions regarding writing extensions please post in Extension Writers Discussion to receive proper guidance from our staff and community.
User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: Twig Function Semantic Naming

Post by hanakin »

you apparently have no idea what you are talking about there is all of that in template files and have not read or completely understood what you read so let me try and break it down with examples

here is a sample template from chameleon

Code: Select all

<li class="o-list-item c-topic-item t-topic-item" role="row">
                    ^ this is CSS an object to be specific!!!!
                    
<li class="o-list-item c-topic-item t-topic-item" role="row">
                                 ^ this is CSS an component

<li class="o-list-item c-topic-item t-topic-item" role="row">
                                                    ^ this is CSS an theme

<time datetime="{{ item.last_time }}" title="{{ item.last_time }}" data-short="{{ item.last_time }}">{{ item.last_time|moment("YYYYMMDD", true) }}</time>
                             ^ PHP                          ^ PHP                             ^ PHP                                         ^PHP
                                  
<a class="c-subscribe-action{% if not S_WATCHING_TOPIC %} is-active {% endif %}" href="{U_WATCH_TOPIC}" title="{S_WATCH_TOPIC_TITLE}" data-ajax="swap_subscribe" data-swap="subscribe" data-toggle-url="{U_WATCH_TOPIC_TOGGLE}" data-update-all=".c-cubscribe-action">
                                                                                                                                            ^ JS also if we have to support a feature without js it will require css classes of js-xxxx
prosilver in 4.0

Code: Select all

{{ Icon('iconify', 'fa:chevron-circle-up', '', true) }}<span>{L_BACK_TO_TOP}</span>
      ^ this is php a twig function!
      
<button type="button" class="button button-icon-only bbcode-b" accesskey="b" name="addbbcode0" value=" B " onclick="bbstyle(0)" title="{L_BBCODE_B_HELP}">
                                                                                                               ^ JS all thouygh should not be there

Also still no one here has answered any of the points and benefits laid out in the previous posts the biggest advantage being self documentation and the need to leave a template file. So let me also walk you through that

everything other than html (HTML is onlt the tags them selves anything within an attribute or property is not HTML and is associated to the source it comes from ie css classes are CSS) Is scoped to its specific function to provide the editor (IDE) and developer full benefits

What does this mean in laymen's terms

Here is a list of scopes
  • O- CSS Object
  • C- CSS Component
  • T- CSS Theme
  • U- CSS Utility
  • IS- CSS Action
  • HAS- CSS Action
  • JS- CSS JS Hook
  • F- Twig Function
  • _ CSS Temp Hack
Why are these useful, well not only do they tel us what there role is but they offer us the advantage in our IDE to allow us to look them up.

I am a style developer wanting to do something hmm is there a twig function to do this let me see instead of going and digging through documentation all I have to do is type F- which gives me a list of all defined twig functions with documentation from the code base docbloc! This is the point of doc blocks

Without this I have to try and guess what a function might be or dig through endless documentation or the entire codebase!!!!
Donations welcome via Paypal Image

User avatar
martti
Registered User
Posts: 45
Joined: Wed Aug 20, 2014 4:50 pm
Location: Belgium

Re: Twig Function Semantic Naming

Post by martti »

hanakin wrote: Sat May 02, 2020 7:27 pm

Code: Select all

<li class="o-list-item c-topic-item t-topic-item" role="row">
                    ^ this is CSS an object to be specific!!!!
It's just an HTML tag with attributes.
It might be used as a selector by the styling sheet.

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: Twig Function Semantic Naming

Post by hanakin »

Apparently this is all way over your head and you still can not read
hanakin wrote: Sat May 02, 2020 7:27 pm everything other than html (HTML is only the tags themselves anything within an attribute or property is not HTML and is associated to the source it comes from ie css classes are CSS) Is scoped to its specific function to provide
Donations welcome via Paypal Image

User avatar
david63
Registered User
Posts: 355
Joined: Mon Feb 07, 2005 7:23 am

Re: Twig Function Semantic Naming

Post by david63 »

hanakin wrote: Sun May 03, 2020 6:50 am Apparently this is all way over your head
When I was working in training there was a rule - if somebody does not understand something it is not their fault, it is the fault of the one doing the explaining. Perhaps this may be the problem here.
David
Remember: You only know what you know -
and you do not know what you do not know!

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: Twig Function Semantic Naming

Post by hanakin »

Interesting as I work in training, specifically training the most difficult cases. And that’s not a rule it’s a cop out as some people do not want to learn. Everything is laid out here in simple terms for anyone who has the proper understanding. I do not have the time to provide anymore remedial information.
Donations welcome via Paypal Image

BondGamer
Registered User
Posts: 113
Joined: Mon Dec 15, 2003 8:20 pm
Contact:

Re: Twig Function Semantic Naming

Post by BondGamer »

It looks like things are getting a bit heated here. There is no need to resort to passive aggressive comments towards each other.

User avatar
martti
Registered User
Posts: 45
Joined: Wed Aug 20, 2014 4:50 pm
Location: Belgium

Re: Twig Function Semantic Naming

Post by martti »

BondGamer wrote: Tue May 05, 2020 3:31 am It looks like things are getting a bit heated here. There is no need to resort to passive aggressive comments towards each other.
Right. Now it's about how I need to be "educated" because I see HTML attributes just as ... HTML attributes and not as CSS or JS. So dumb of me, I'm not capable of separating concerns.
People don't like being told they are dumb. Unfortunately naming convention issues often tend to be of religious nature.

User avatar
3Di
Registered User
Posts: 951
Joined: Tue Nov 01, 2005 9:50 pm
Location: Milano 🇮🇹 Frankfurt 🇩🇪
Contact:

Re: Twig Function Semantic Naming

Post by 3Di »

And in any case, I don't imagine this discussion will go very far, at least in the near future.
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Want to compensate me for my interest? Donate
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades

User avatar
martti
Registered User
Posts: 45
Joined: Wed Aug 20, 2014 4:50 pm
Location: Belgium

Re: Twig Function Semantic Naming

Post by martti »

hanakin wrote: Sat May 02, 2020 7:27 pm
Here is a list of scopes
  • O- CSS Object
  • C- CSS Component
  • T- CSS Theme
  • U- CSS Utility
  • IS- CSS Action
  • HAS- CSS Action
  • JS- CSS JS Hook
  • F- Twig Function
  • _ CSS Temp Hack
Why are these useful, well not only do they tel us what there role is but they offer us the advantage in our IDE to allow us to look them up.
Well, that's all nice you want to structure your HTML attributes. You could even separate the concerns more by reserving the class attributes entirely for use by CSS and the data-* attributes for use by JS.

But Twig functions and filters are different. They are part of the control structure of the template, not the static content. And the Twig developers did already their job to differentiate the control structure from static content by use of delimiters {% %} and {{ }}
hanakin wrote: Sat May 02, 2020 7:27 pm
I am a style developer wanting to do something hmm is there a twig function to do this let me see instead of going and digging through documentation all I have to do is type F- which gives me a list of all defined twig functions with documentation from the code base docbloc! This is the point of doc blocks

Without this I have to try and guess what a function might be or dig through endless documentation or the entire codebase!!!!
The doc blocks would be defined above the PHP methods, wouldn't they? Then it seems handy that those PHP methods are named the same as the corresponding twig functions. Just like a lot of PHP standard functions are named after their C counterparts. (I.e. sprintf() ) They are wrappers for them. It provides the smallest mental jump for developers.

Then for the ability to search all defined twig functions it's practical that the doc blocks themselves contain a specific tag like i.e @ingroup template_function or something. A search for that will only give the template functions. (defined by the phpBB core at least). f- is not unique. It's likely to give a lot of false search results.

A tag like template_function or phpbb_twig_function is explicit. It's English. It's generally understood. f- is not. Obviously it must mean something in the phpBB universe, but what? I.e. I have been wondering for a long time what the S_ prefix means in a phpBB template variable. I think it is "switch" and that stands for a "boolean" but I'm still not sure.

f- looks the same as your HTML attribute naming pattern, a character and a hyphen. Adapting the same naming pattern works against recognition in difference of template control structure and content.

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: Twig Function Semantic Naming

Post by hanakin »

again everything you say is just irrelevant dribble...
Well, that's all nice you want to structure your HTML attributes. You could even separate the concerns more by reserving the class attributes entirely for use by CSS and the data-* attributes for use by JS.
What are you even saying here? This is dribble
But Twig functions and filters are different. They are part of the control structure of the template, not the static content. And the Twig developers did already their job to differentiate the control structure from static content by use of delimiters {% %} and {{ }}
Again WTF, {% %} and {{ }} yes is twig nothing to do with anything we are discussing. This also has nothing to do with structure of a template again dribble
The doc blocks would be defined above the PHP methods, wouldn't they? Then it seems handy that those PHP methods are named the same as the corresponding twig functions. Just like a lot of PHP standard functions are named after their C counterparts. (I.e. sprintf() ) They are wrappers for them. It provides the smallest mental jump for developers.
WTF? again what are you talking about? The point of a doc block which yes is above the definition of a function. Is to provide information about the function to the IDE so that when you use it it displays this inline!!!!!! What does any of this have to do with anything the name of the doc block matches the name of the fucntion yes that is common sense but you can change the name of the function to whatever you flippin want.
Then for the ability to search all defined twig functions it's practical that the doc blocks themselves contain a specific tag like i.e @ingroup template_function or something. A search for that will only give the template functions. (defined by the phpBB core at least). f- is not unique. It's likely to give a lot of false search results.
Again dribble! why are you talking about searching for anything no one is talking about searching. In your editor when you type anything you are presented with a dropdown overlay that displays possible choices based on typing this is called intelisense which is what we are discussing here. f- with intellisense will show anything that starts with f- in a list to chose from!
A tag like template_function or phpbb_twig_function is explicit. It's English. It's generally understood. f- is not. Obviously it must mean something in the phpBB universe, but what? I.e. I have been wondering for a long time what the S_ prefix means in a phpBB template variable. I think it is "switch" and that stands for a "boolean" but I'm still not sure.

f- looks the same as your HTML attribute naming pattern, a character and a hyphen. Adapting the same naming pattern works against recognition in difference of template control structure and content.
again pointless. given the response above. Also I do not care about the PHP the fact is thwey cross the stream into HTML whioch mens they need to abide by the location they are used. normal naming conventions for normal php/js fucntions work fine as they are used or called in there respective files.

These are not they are called in HTML and should adhere to those naming conventions

Lastly the naming conventions I posted here are industry standards for html see SMACCS, ITCSS, OOCSS, BEM all of which leverage these naming conventions or damn near close

They only thing you said in this entire wall of text that makes some sense is the S_ in phpBB which as far as I know is not a widely used standard for SWITCH/BOOLEAN which is IIRC is what it means but do not quote me as I am not a php developer. I am a front-end developer.

Lastly none of these response are on topic at this point and all the points have been laid out with no valid rebuttals so unless someone else has anything to add to this conversation I will transition this into a team discussion.
Donations welcome via Paypal Image

Post Reply