[TYPO3-english] TelephoneNumber ViewHelper

Discussion:

Robert Wildling

2013-06-30 11:31:50 UTC

Hi,

I am trying to get into writing my own ViewHelpers. The first "bigger"
test is a TelephonNumber ViewHelper that transforms phone numbers to
links with the href:"tel:*" attr (knowing that modern devices do this
automatically, also knowing about the respective meta-tag... as said:
this is just for practicing).

So far I got this, which works fine (thanks to the vhc collection; the
whole thing gets implemented into the cbgooglemaps ext):

// Script
class Tx_Cbgooglemaps_ViewHelpers_Link_TelephoneNumberViewHelper extends
Tx_Fluid_Core_ViewHelper_AbstractTagBasedViewHelper {
protected $tagName = 'a';
/**
* @param string $number The phone number to parse
* @param string $type The link type ("tel", "skype", "callme",...)
* @return string Rendered phone link
*/
public function render( $number, $type='tel' ) {
$linkText = $number;
$tagContent = $this->renderChildren();
if ($tagContent !== NULL) { $linkText = $tagContent; }
$this->tag->setContent($linkText);
$this->tag->addAttribute('href', $type.':' . $number);
return $this->tag->render();
}
}

// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber
number="{phone}">{phone}</l:Link.TelephoneNumber>

So far, so good. The problem starts, when there are is a list of comma
seperated phone numbers to deal with. I started out with this:

public function render( $number, $type='tel' ) {
$explodeStr = ",";
// if $number is an array...
if( strpos( $number, explodeStr) ){
$numberArray = trim( explode( explodeStr, $number ));
foreach ( $numberArray as $num ) {
// how to deal with the $this->tag->foo, when
// there is only one tag?
// how shall the return value be put together?
}
} else {
// code as before
}
[...]

As the comments already say, I do not know how to deal with the
render->children() and the like commands. Also, the final render-command
has to be placed outside the foreach loop, right? So what would be the
proper way to build it?

Thanks for your hints!
Greetings, Robert

Robert Wildling

2013-06-30 16:14:18 UTC

Permalink

It seems as if I found a working way:

// Class
class Tx_Cbgooglemaps_ViewHelpers_Link_TelephoneNumberViewHelper extends
Tx_Fluid_Core_ViewHelper_AbstractTagBasedViewHelper
{

protected $tagName = 'a';

/**
* @param string $number The phone number to parse
* @param string $type The link type ("tel", "skype", "callme",...)
*
* @return string Rendered phone link
*/
public function render($number, $type = 'tel') {
$explodeStr = ",";
$content = "";

if (strpos($number, $explodeStr)) {
$i = 0;
$numberArray = explode($explodeStr, $number);

foreach ($numberArray as $num) {
$i++;
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($num)) . "'>" . trim($num) . "</a>";
if ($i < count($numberArray)) {
$content .= ", ";
}
}
} else {
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($number)) . "'>" . trim($number) . "</a>";
}

return $content;
}

/**
* This method strips unwanted characters from the given telephone number,
* such as white spaces or brackets
*
* @param string $number The number to be parsed
*
* @return string parsed
* @static
* @author Daniel Regelein <daniel.regelein at diehl-informatik.de>
*/
private static function clearPhoneNumber($number) {
$search = array('(', ')', '-', ' ', '/', '\\', '|', '{', '}', '[', ']');

return str_replace($search, '', $number);
}
}

// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber number="{phone}" />

I just have my doubts, whether this is a good solution. Doesn't feel
very "Fluid".

I'd apprciate any comments on how to improve this ViewHelper!
Thanks! Robert

Post by Robert Wildling
Hi,
I am trying to get into writing my own ViewHelpers. The first "bigger"
test is a TelephonNumber ViewHelper that transforms phone numbers to
links with the href:"tel:*" attr (knowing that modern devices do this
this is just for practicing).
So far I got this, which works fine (thanks to the vhc collection; the
// Script
class Tx_Cbgooglemaps_ViewHelpers_Link_TelephoneNumberViewHelper extends
Tx_Fluid_Core_ViewHelper_AbstractTagBasedViewHelper {
protected $tagName = 'a';
/**
*/
public function render( $number, $type='tel' ) {
$linkText = $number;
$tagContent = $this->renderChildren();
if ($tagContent !== NULL) { $linkText = $tagContent; }
$this->tag->setContent($linkText);
$this->tag->addAttribute('href', $type.':' . $number);
return $this->tag->render();
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber
number="{phone}">{phone}</l:Link.TelephoneNumber>
So far, so good. The problem starts, when there are is a list of comma
public function render( $number, $type='tel' ) {
$explodeStr = ",";
// if $number is an array...
if( strpos( $number, explodeStr) ){
$numberArray = trim( explode( explodeStr, $number ));
foreach ( $numberArray as $num ) {
// how to deal with the $this->tag->foo, when
// there is only one tag?
// how shall the return value be put together?
}
} else {
// code as before
}
[...]
As the comments already say, I do not know how to deal with the
render->children() and the like commands. Also, the final render-command
has to be placed outside the foreach loop, right? So what would be the
proper way to build it?
Thanks for your hints!
Greetings, Robert

Robert Wildling

2013-07-01 18:56:55 UTC

Permalink

Anybody, please? Some directions?

Post by Robert Wildling
// Class
class Tx_Cbgooglemaps_ViewHelpers_Link_TelephoneNumberViewHelper extends
Tx_Fluid_Core_ViewHelper_AbstractTagBasedViewHelper
{
protected $tagName = 'a';
/**
*
*/
public function render($number, $type = 'tel') {
$explodeStr = ",";
$content = "";
if (strpos($number, $explodeStr)) {
$i = 0;
$numberArray = explode($explodeStr, $number);
foreach ($numberArray as $num) {
$i++;
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($num)) . "'>" . trim($num) . "</a>";
if ($i < count($numberArray)) {
$content .= ", ";
}
}
} else {
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($number)) . "'>" . trim($number) . "</a>";
}
return $content;
}
/**
* This method strips unwanted characters from the given telephone number,
* such as white spaces or brackets
*
*
*/
private static function clearPhoneNumber($number) {
$search = array('(', ')', '-', ' ', '/', '\\', '|', '{', '}', '[', ']');
return str_replace($search, '', $number);
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber number="{phone}" />
I just have my doubts, whether this is a good solution. Doesn't feel
very "Fluid".
I'd apprciate any comments on how to improve this ViewHelper!
Thanks! Robert

Henjo Hoeksma | Stylence

2013-07-01 19:13:51 UTC

Permalink

Hi Robert,

why don't just parse the phonenumbers as an array in Fluid?
<l:link.telephoneNumber numbers="{0:'firstnumber', 1:'secondnumber',
2:'...'}" type="tel" />

Kind regards,

Henjo

Problems are small because we learned how to deal with them.
Problems are big because we need to learn how to deal with them.

Post by Robert Wildling
Anybody, please? Some directions?

Post by Robert Wildling
// Class
class Tx_Cbgooglemaps_ViewHelpers_**Link_TelephoneNumberViewHelper
extends
Tx_Fluid_Core_ViewHelper_**AbstractTagBasedViewHelper
{
protected $tagName = 'a';
/**
*
*/
public function render($number, $type = 'tel') {
$explodeStr = ",";
$content = "";
if (strpos($number, $explodeStr)) {
$i = 0;
$numberArray = explode($explodeStr, $number);
foreach ($numberArray as $num) {
$i++;
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($**num)) . "'>" . trim($num) . "</a>";
if ($i < count($numberArray)) {
$content .= ", ";
}
}
} else {
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($**number)) . "'>" . trim($number) . "</a>";
}
return $content;
}
/**
* This method strips unwanted characters from the given telephone number,
* such as white spaces or brackets
*
*
*/
private static function clearPhoneNumber($number) {
$search = array('(', ')', '-', ' ', '/', '\\', '|', '{', '}', '[', ']');
return str_replace($search, '', $number);
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber number="{phone}" />
I just have my doubts, whether this is a good solution. Doesn't feel
very "Fluid".
I'd apprciate any comments on how to improve this ViewHelper!
Thanks! Robert
Hi,

Post by Robert Wildling
I am trying to get into writing my own ViewHelpers. The first "bigger"
test is a TelephonNumber ViewHelper that transforms phone numbers to
links with the href:"tel:*" attr (knowing that modern devices do this
this is just for practicing).
So far I got this, which works fine (thanks to the vhc collection; the
// Script
class Tx_Cbgooglemaps_ViewHelpers_**Link_TelephoneNumberViewHelper
extends
Tx_Fluid_Core_ViewHelper_**AbstractTagBasedViewHelper {
protected $tagName = 'a';
/**
*/
public function render( $number, $type='tel' ) {
$linkText = $number;
$tagContent = $this->renderChildren();
if ($tagContent !== NULL) { $linkText = $tagContent; }
$this->tag->setContent($**linkText);
$this->tag->addAttribute('**href', $type.':' . $number);
return $this->tag->render();
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber
number="{phone}">{phone}</l:**Link.TelephoneNumber>
So far, so good. The problem starts, when there are is a list of comma
public function render( $number, $type='tel' ) {
$explodeStr = ",";
// if $number is an array...
if( strpos( $number, explodeStr) ){
$numberArray = trim( explode( explodeStr, $number ));
foreach ( $numberArray as $num ) {
// how to deal with the $this->tag->foo, when
// there is only one tag?
// how shall the return value be put together?
}
} else {
// code as before
}
[...]
As the comments already say, I do not know how to deal with the
render->children() and the like commands. Also, the final render-command
has to be placed outside the foreach loop, right? So what would be the
proper way to build it?
Thanks for your hints!
Greetings, Robert

______________________________**_________________
TYPO3-english mailing list
TYPO3-english at lists.typo3.org
http://lists.typo3.org/cgi-**bin/mailman/listinfo/typo3-**english<http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-english>

Robert Wildling

2013-07-01 19:19:26 UTC

Permalink

Hi, Henjo,

thanks for your response!

Would your solution work? The (only) input field in the BE allows for
one or more (comma seperated) numbers, like this:

01 3423422342, 023 234234234, 0234 23423423423

But what if there is only one number? Would Fluid ignore the other
arguments?

Also, concerning escape of vertain unwanted characters: where would I
have to do that?

Well... newbie I am! :-)

Thanks! Robert

Post by Henjo Hoeksma | Stylence
Hi Robert,
why don't just parse the phonenumbers as an array in Fluid?
<l:link.telephoneNumber numbers="{0:'firstnumber', 1:'secondnumber',
2:'...'}" type="tel" />
Kind regards,
Henjo
Problems are small because we learned how to deal with them.
Problems are big because we need to learn how to deal with them.

Post by Robert Wildling
Anybody, please? Some directions?

Henjo Hoeksma | Stylence

2013-07-01 20:34:20 UTC

Permalink

Hi Robert,

in that case it would be different.

First of all - if this is really the way you would want to handle it, I
think I would prefer using a textbox for the BE input and on every new line
a number.
Next you would want to make sure the input is correct, rather than cleaning
stuff up in your view, so you would need to use 'eval' to only allow
numbers to be inputted.
Now in your Fluid you can just add the property like so:
<l:link.telephoneNumber numbers="{numbers}" type="tel" />
In your VH you do the following:
- convert the $numbers to an array based on the newline break as separator
- foreach $number add them to your $output[] as a link.
- return $output (array)

Now in Fluid it would look like this:

<f:if condition="{numbers}">
<ul>
<f:for each="{l:telephoneNumbers(numbers:'{numbers}', type:'tel')}"
as="number">
<li>{number}</li>
</f:for>
</ul>
</f:if>

Still it seems to me this is a little hacky: how do you know a number is of
the type tel? Why not make the number an object with a type property? In
the BE use irre to add them in your form and the user experience will still
be good (with some cleanup of the defaults ;-) ).
That combined with a linkViewHelper based on the Fluid's linkVH create a
ViewHelper for each type: link.email -> link.tel -> link.skype ->
link.iMessage etc.

May be this is overkill for your situation, but it would be clean, reusable
and a nice handson experience ;-)

Have fun!

Kind regards,

Henjo

Problems are small because we learned how to deal with them.
Problems are big because we need to learn how to deal with them.

Post by Robert Wildling
Hi, Henjo,
thanks for your response!
Would your solution work? The (only) input field in the BE allows for one
01 3423422342, 023 234234234, 0234 23423423423
But what if there is only one number? Would Fluid ignore the other
arguments?
Also, concerning escape of vertain unwanted characters: where would I have
to do that?
Well... newbie I am! :-)
Thanks! Robert
Hi Robert,

Post by Henjo Hoeksma | Stylence
why don't just parse the phonenumbers as an array in Fluid?
<l:link.telephoneNumber numbers="{0:'firstnumber', 1:'secondnumber',
2:'...'}" type="tel" />
Kind regards,
Henjo
Problems are small because we learned how to deal with them.
Problems are big because we need to learn how to deal with them.
Anybody, please? Some directions?

Post by Robert Wildling

Post by Robert Wildling
// Class
class Tx_Cbgooglemaps_ViewHelpers_****Link_TelephoneNumberViewHelper
extends
Tx_Fluid_Core_ViewHelper_****AbstractTagBasedViewHelper
{
protected $tagName = 'a';
/**
*
*/
public function render($number, $type = 'tel') {
$explodeStr = ",";
$content = "";
if (strpos($number, $explodeStr)) {
$i = 0;
$numberArray = explode($explodeStr, $number);
foreach ($numberArray as $num) {
$i++;
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($****num)) . "'>" . trim($num) . "</a>";
if ($i < count($numberArray)) {
$content .= ", ";
}
}
} else {
$content .= "<a href='" . $type . ":" .
self::clearPhoneNumber(trim($****number)) . "'>" . trim($number) .
"</a>";
}
return $content;
}
/**
* This method strips unwanted characters from the given telephone number,
* such as white spaces or brackets
*
*

Post by Robert Wildling
*/

private static function clearPhoneNumber($number) {
$search = array('(', ')', '-', ' ', '/', '\\', '|', '{', '}', '[', ']');
return str_replace($search, '', $number);
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber number="{phone}" />
I just have my doubts, whether this is a good solution. Doesn't feel
very "Fluid".
I'd apprciate any comments on how to improve this ViewHelper!
Thanks! Robert
Hi,

Post by Robert Wildling
I am trying to get into writing my own ViewHelpers. The first "bigger"
test is a TelephonNumber ViewHelper that transforms phone numbers to
links with the href:"tel:*" attr (knowing that modern devices do this
this is just for practicing).
So far I got this, which works fine (thanks to the vhc collection; the
// Script
class Tx_Cbgooglemaps_ViewHelpers_****Link_TelephoneNumberViewHelper
extends
Tx_Fluid_Core_ViewHelper_****AbstractTagBasedViewHelper {
protected $tagName = 'a';
/**
*/
public function render( $number, $type='tel' ) {
$linkText = $number;
$tagContent = $this->renderChildren();
if ($tagContent !== NULL) { $linkText = $tagContent; }
$this->tag->setContent($****linkText);
$this->tag->addAttribute('****href', $type.':' . $number);
return $this->tag->render();
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber
number="{phone}">{phone}</l:****Link.TelephoneNumber>
So far, so good. The problem starts, when there are is a list of comma
public function render( $number, $type='tel' ) {
$explodeStr = ",";
// if $number is an array...
if( strpos( $number, explodeStr) ){
$numberArray = trim( explode( explodeStr, $number ));
foreach ( $numberArray as $num ) {
// how to deal with the $this->tag->foo, when
// there is only one tag?
// how shall the return value be put together?
}
} else {
// code as before
}
[...]
As the comments already say, I do not know how to deal with the
render->children() and the like commands. Also, the final
render-command
has to be placed outside the foreach loop, right? So what would be the
proper way to build it?
Thanks for your hints!
Greetings, Robert

______________________________****_________________

TYPO3-english mailing list
TYPO3-english at lists.typo3.org
http://lists.typo3.org/cgi-****bin/mailman/listinfo/typo3-****english<http://lists.typo3.org/cgi-**bin/mailman/listinfo/typo3-**english>
<http://lists.typo3.**org/cgi-bin/mailman/listinfo/**typo3-english<http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-english>

Robert Wildling

2013-07-01 20:46:15 UTC

Permalink

Wow! That looks awesome!
I'll work it through tomorrow -for now let me just say: Thanks a lot
for you time and help!!!

All the best, Robert

Post by Henjo Hoeksma | Stylence
Hi Robert,
in that case it would be different.
First of all - if this is really the way you would want to handle it, I
think I would prefer using a textbox for the BE input and on every new line
a number.
Next you would want to make sure the input is correct, rather than cleaning
stuff up in your view, so you would need to use 'eval' to only allow
numbers to be inputted.
<l:link.telephoneNumber numbers="{numbers}" type="tel" />
- convert the $numbers to an array based on the newline break as separator
- foreach $number add them to your $output[] as a link.
- return $output (array)
<f:if condition="{numbers}">
<ul>
<f:for each="{l:telephoneNumbers(numbers:'{numbers}', type:'tel')}"
as="number">
<li>{number}</li>
</f:for>
</ul>
</f:if>
Still it seems to me this is a little hacky: how do you know a number is of
the type tel? Why not make the number an object with a type property? In
the BE use irre to add them in your form and the user experience will still
be good (with some cleanup of the defaults ;-) ).
That combined with a linkViewHelper based on the Fluid's linkVH create a
ViewHelper for each type: link.email -> link.tel -> link.skype ->
link.iMessage etc.
May be this is overkill for your situation, but it would be clean, reusable
and a nice handson experience ;-)
Have fun!
Kind regards,
Henjo
Problems are small because we learned how to deal with them.
Problems are big because we need to learn how to deal with them.

Post by Robert Wildling

Post by Robert Wildling
*/

Post by Robert Wildling
I am trying to get into writing my own ViewHelpers. The first "bigger"
test is a TelephonNumber ViewHelper that transforms phone numbers to
links with the href:"tel:*" attr (knowing that modern devices do this
this is just for practicing).
So far I got this, which works fine (thanks to the vhc collection; the
// Script
class Tx_Cbgooglemaps_ViewHelpers_****Link_TelephoneNumberViewHelper
extends
Tx_Fluid_Core_ViewHelper_****AbstractTagBasedViewHelper {
protected $tagName = 'a';
/**
*/
public function render( $number, $type='tel' ) {
$linkText = $number;
$tagContent = $this->renderChildren();
if ($tagContent !== NULL) { $linkText = $tagContent; }
$this->tag->setContent($****linkText);
$this->tag->addAttribute('****href', $type.':' . $number);
return $this->tag->render();
}
}
// Template
{namespace l=Tx_Cbgooglemaps_ViewHelpers}
Telefon: <l:Link.TelephoneNumber
number="{phone}">{phone}</l:****Link.TelephoneNumber>
So far, so good. The problem starts, when there are is a list of comma
public function render( $number, $type='tel' ) {
$explodeStr = ",";
// if $number is an array...
if( strpos( $number, explodeStr) ){
$numberArray = trim( explode( explodeStr, $number ));
foreach ( $numberArray as $num ) {
// how to deal with the $this->tag->foo, when
// there is only one tag?
// how shall the return value be put together?
}
} else {
// code as before
}
[...]
As the comments already say, I do not know how to deal with the
render->children() and the like commands. Also, the final
render-command
has to be placed outside the foreach loop, right? So what would be the
proper way to build it?
Thanks for your hints!
Greetings, Robert

______________________________****_________________