Jump to content



Photo
- - - - -

Template Engine Functionality Proposal


  • Please log in to reply
68 replies to this topic

#1   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 03 February 2012 - 10:54

Hi All..

This is a proposal for adding actual template engine functionality into osCommerce Online Merchant v3.0 to remove PHP code from the content pages.

The proposal is shown through the development of our new website powered by the osCommerce Online Merchant v3.0 framework. The source code to our new website is published as Open Source (BSD license) however it will not be part of osCommerce Online Merchant v3.0 as it is obviously not a general purpose application. As soon as the template engine functionality is finalized, it will be added to the v3.0 framework to not only implement it to the Admin, Setup, and Shop sites, but to also kickstart the initiative of adding a general purpose CMS Site to osCommerce Online Merchant v3.0.

The template engine functionality is currently aimed at developers. An Admin Application will be needed for users to be able to edit page content and see which template engine functionality is available to them.

The source code of our website and the initial template engine functionality is available at:

https://github.com/h...ommerce_website

Instructions for setting up the website is available at the github repository. It is currently only the front page to demonstrate the template engine functionality.

The idea behind the template engine functionality is to NOT add logic into content pages where users and developers need to learn yet another language for conditions or loops - PHP does this just fine.

The idea is to "widgetize" content pages through the use of simple tags used in addition to HTML. Simple processing is taken care of with Tags and more powerful and modular processing is taken care of with Widgets. Both Tags and Widgets are called in the following format, similar to bbcode:

{tag}value{tag}

No closing {/tag} is used - only matching {tag}{tag} pairs are processed.

The following tags are available:
  • import - include html content from another file
  • lang - get language definition
  • link - produce a url
  • publiclink - produce a url to a public asset
  • value - get the value of a variable
  • widget - process widget
Each Tag is a module. The template processing does not search for a hardcoded list of tags to process, but searches for {[tag-name]}string{[same-tag-name}] and processes "string" with the Tag if the module is available.

It's possible to nest Tags and by default the same processing is also executed on the output of the Tag, for example using {link}Index{link} is possible in a language definition. This can be disabled at the Tag level if it is not required.

It is up to each Tag to process the string value as it requires. Some Tags may need arguments to be passed - both link and publiclink Tags use | as a separator in the string value to process arguments, example {link}Index|Shop{link} would create a link to the Shop Index page, not to the Index page of the current Site.

For cases where more complex arguments are needed, a variable can be pre-set at the Site level to make it available to all of its Applications, or at the Application level specific for that Application. This is contained in $OSCOM_Template->_values[] and the value can be retrieved with the {value} Tag.

Widgets are used where coding logic is needed or to add independent blocks to a page. Each Widget has it's own language definition file and can be added to any page.

Please take a look at the source and provide feedback on the direction this is going in. Caching will need to be looked into.

Thanks!

Edited by Harald Ponce de Leon, 03 February 2012 - 11:02.

Harald Ponce de Leon

#2   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 06 February 2012 - 23:10

Hi All..

I just pushed out some code to the oscommerce_website repository that adds an Admin Sites Application to create skeleton Sites and Applications through the Admin Dashboard. The initial commit is pretty raw/alpha and focuses on creating new Applications - more work is definitely needed.

This will help developers code Sites and Applications faster, and will ultimately help users edit the styling and content of their pages. This uses the new template engine functionality which is why it is committed to the oscommerce_website repository and not yet to the main repo.

Further information will be provided as more code gets pushed out.

Kind regards,
Harald Ponce de Leon

#3   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 08 February 2012 - 17:38

Hi All..

I just pushed out updates to oscommerce_website that replace the usage of Semantic.gs with Twitter Bootstrap. This will also be used for new Sites created through the Admin Dashboard (this feature will be pushed out in the coming days).

For those keeping up to date with oscommerce_website, a link to the public/external/bootstrap is required.

Kind regards,
Harald Ponce de Leon

#4   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 09 February 2012 - 22:58

Hi All..

The feature to create new Sites via the Admin Dashboard has just been pushed to the oscommerce_website repo. It's now possible to create skeleton Sites and Applications via the Admin Dashboard!

This is still pretty raw and focused for developers to use, but does provide great opportunities for awesome user-end features in managing a Site and its Applications.

The code will be pushed to the main repo as soon as the new template engine functionality is moved over as the new Site and Application creation feature creates content pages utilizing the template engine functionality.

Kind regards,
Harald Ponce de Leon

#5   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 09 February 2012 - 23:33

Hi All..

Here's a screenshot of how a new skeleton Site looks like:

Attached File  Hello, world!.png   56.49KB   92 downloads

One of the first dynamic elements for a user-end feature is to have a navigation bar linking to Applications and external links.

Kind regards,
Harald Ponce de Leon

#6   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 10 February 2012 - 19:48

Hi All..

An installation of oscommerce_website is available at:

http://new.oscommerce.com

The pages are currently placeholders and links may not work. This will be kept up to date with what is pushed to the Github repo. This is the first public testing of the template engine functionality and the first peak of our new website :)

Kind regards,

Edited by Harald Ponce de Leon, 10 February 2012 - 19:48.

Harald Ponce de Leon

#7   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 24 February 2012 - 12:56

Hi All..

I just created a new branch in my repo called "template" where the template engine functionality, Tags, and Widgets have been merged to. (Please note the "template" branch is a child of the "master" branch, not the "cfg" branch)

The Login and Configuration Admin Applications have been updated to use the proposed template engine functionality, meaning its content pages contain absolutely no PHP code.

Two logic Tags have been introduced:
  • loop; loop over an array (defined as a parameter) and replace #var# in the block with its value
  • iftrue; output the block if its parameter value is true (similarly an iffalse tag can also be created)
The parameters for these tags are defined as:

{loop var}
<p>#key#</p>
{loop}

{iftrue var}
<p>It's true!</p>
{iftrue}

The API has slightly changed from what was introduced in the oscommerce_website repo which will soon be updated with the new changes.

Kind regards,

Edited by Harald Ponce de Leon, 24 February 2012 - 12:57.

Harald Ponce de Leon

#8   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 24 February 2012 - 13:30

Hi Harald,
i'll take a look during this weekend

I have a dream ... i hope, a day, Samantha Fox will be an Array. and maybe, a new getContent method() could surrendering to the spirit of the night /w00t.gif' class='bbc_emoticon' alt='(w00t)' />
-------------------

#9   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 25 February 2012 - 17:46

(Please note the "template" branch is a child of the "master" branch, not the "cfg" branch)


ok, in this case, i can't test it with kendo UI.
I'm only developping with 3.0.4.(need to implement services)
fragmentation is dangerous. /sick.gif' class='bbc_emoticon' alt=':x' />

Edited by foxp2, 25 February 2012 - 17:47.

-------------------

#10   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 02 March 2012 - 19:31

Hi All..

The Admin template has been updated to remove the PHP code and use the Template Tags. There is a limitation here I'd like to address that can be shown perfectly with this commit:

https://github.com/h...28d32297a91e5b3

As can be seen, the values for the page content are defined in the Site Controller - these are available to all Applications. Application specific values are defined in the Application Controller. So far so good, however it's not a flexible/dynamic solution at all:

1) Values are hardcoded in Controllers.
2) Imagine a GUI for editing template files, it will be cumbersome to parse files to return a list of values available to use

I think it would be much better to move these values into modules and have the {value} Tag call the specified module. This helps immensely with #2 as a list of available values can easily be generated (Core values and Custom/Add-On values).

Now to think about where these modules should exist ....
Harald Ponce de Leon

#11   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 02 March 2012 - 19:54

hi Harald,
after repititive and too much static codes, you create a complicated overlapping between application layers.
it leaves me speechless. /sick.gif' class='bbc_emoticon' alt=':x' />
-------------------

#12   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 02 March 2012 - 19:59

Hi Laurent..

Can you please describe your thoughts further and point out what is being repetitive and overlapped?

Thanks,
Harald Ponce de Leon

#13   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 02 March 2012 - 20:27

Hi Laurent..

Can you please describe your thoughts further and point out what is being repetitive and overlapped?

Thanks,


No.
I will wait for your implementation of this template engine and a real dynamic binding between Views, Models and Controllers.
For now, IMO, your code becomes increasingly unreadable.
i'm sorry but I am not convinced

Edited by foxp2, 02 March 2012 - 20:28.

-------------------

#14   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 02 March 2012 - 20:31

Hi Laurent..

The architecture knows how it all comes together ;)

After the values have been moved to modules you will see how flexible it will become.

The only thing I'm not happy with at the moment is how parameters are passed to Tags - I will bring this up for discussion soon to see how it can be improved.

Kind regards,
Harald Ponce de Leon

#15   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 02 March 2012 - 21:04

Hi Harald,
osCommerce framework is really fantastic.
Our framework has really qualities.
I have a full respect for your work.

but i think, sometimes, you forget a thing : the combination between user experience and user interface.
Let us make sure we'll have the better tomorrow.
-------------------

#16   Harald Ponce de Leon

Harald Ponce de Leon

    Healthy Giraffe

  • Core Team
  • 4,706 posts
  • Real Name:Harald Ponce de Leon
  • Gender:Male
  • Location:Solingen, Germany

Posted 03 March 2012 - 11:27

Hi All..

The values made available to the template have now been abstracted to modules. This can be seen with the following commit:

https://github.com/h...e7...9b3236e192

The {value} Template Tag has been updated to retrieve the value in the following order:
  • Load the value module at the Application level (if module exists), else
  • Load the value module at the Site level (if module exists), else
  • Load the value internally if no module exists
This improves performance of loading modular values on demand and improves flexibility where values can be defined without editing core source code files.

Laurent pointed out that there is a lot of static code in the framework. YES! Not all classes must be instantiated into objects - those that do not need to work as objects are kept static to improve performance and memory. We are also moving in the direction of strictly checking loadable modules against a base abstract class, eg:

if ( class_exists($module) && is_subclass_of($module, 'ModuleAbstract') )

This strengthens the API and makes sure the modules contain the minimum set of needed functionality.

The framework has 2 main namespace levels: Core and Custom. A third level will be introduced for templates where additional templates can override content based on the default template. This existed in v3.0Alpha5 but was removed during the migration to the new framework. Having the PHP code removed from the template content (Views) helps here immensely.

Laurent is working on a KendoUI template for the Admin Site. This will not be part of the core however it will make for an awesome add-on that shows the flexibility of the core framework.

Tim (who works for Nick Weisser) previously worked on a jQuery Mobile template for the Shop Site. Again, the work here in whole helps create optimized templates without duplication of core PHP code. YES! There will be duplication of HTML code (Views) specific for each template as CSS is not the answer to everything.

Kind regards,

Edited by Harald Ponce de Leon, 03 March 2012 - 11:29.

Harald Ponce de Leon

#17   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 08 March 2012 - 10:24

clone public/sites/Admin/templates/oscom -> public/sites/Admin/templates/Sail :

-------------------

#18   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 10 March 2012 - 12:20

Hi harald,
Could you modify the Access class to account for the new structure in Custom/Site/' . OSCOM::getSite() . '/Template ?
thanks
/happy.png' class='bbc_emoticon' alt='^_^' />
-------------------

#19   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 10 March 2012 - 16:04

Hi harald,
i really need your help.
i have a serious problem with access class.
i need to override this class (but i feel it's not possible with your new structure)
why ? it is really simple : in static function getLevels, we have : $_SESSION['Admin']['id'] harcoded, but in my scenario (with a new Site PublicAdmin, it doesn't work, because the session should be $_SESSION['PublicAdmin']['id'])
so, how to override this class in Custom folder and the correct Namespace ?

i hope, like Rick, you never gonna give me up ... /crying.gif' class='bbc_emoticon' alt=':'(' />
-------------------

#20   foxp2

foxp2

    strong as a Twig

  • Banned
  • 310 posts
  • Real Name:Laurent
  • Gender:Male
  • Location:France

Posted 10 March 2012 - 18:33

Meanwhile, i've changed this method with this code :
    public static function getLevels($group = null) {
	  $access = array();
	  if ( isset($_SESSION['Admin']['id']) && isset($_SESSION['Admin']['access']) ) {
	    foreach ( $_SESSION['Admin']['access'] as $module => $data ) {
		  if ( ($data['linkable'] === true) && (empty($group) || ($group == $data['group'])) ) {
		    if ( !isset($access[$data['group']][$data['sort_order']]) ) {
			  $access[$data['group']][$data['sort_order']] = $data;
		    } else {
			  $access[$data['group']][] = $data;
		    }
		  }
	    }
	    ksort($access);
	    foreach ( $access as $group => $modules ) {
		  ksort($access[$group]);
	    }
	  }elseif(  isset($_SESSION['PublicAdmin']['id']) && isset($_SESSION['PublicAdmin']['access']) )  {
	    foreach ( $_SESSION['PublicAdmin']['access'] as $module => $data ) {
		  if ( ($data['linkable'] === true) && (empty($group) || ($group == $data['group'])) ) {
		    if ( !isset($access[$data['group']][$data['sort_order']]) ) {
			  $access[$data['group']][$data['sort_order']] = $data;
		    } else {
			  $access[$data['group']][] = $data;
		    }
		  }
	    }
	    ksort($access);
	    foreach ( $access as $group => $modules ) {
		  ksort($access[$group]);
	    }	   
	  }
	  return $access;
    }

this code is functionnal (now, i can get a Public Admin Site and Private Admin Site, each have their own namespace/custom folder/template/Session/Database) but I'm not really satisfy because this class is in the Core
I'm waiting for a response ...
-------------------