Inline translations break page layouts

I am no HTML expert, but the way the inline translations work feels wrong. Also cumbersome to code inside the templates. Also I may be wrong but this is what I think may be a good solution:

I think there should be a single function in form of

inlineEditorHelper('<a href="blah">{{ trans('keyname') }}</a>','keyname')

This function would return result of normal translation if inline editing is disabled:

<a href="blah">{{ trans('keyname') }}</a>

If inline editing is enabled, it would return something like this:

<span style="position:relative;" onmouseover="show popup with id" onmouseout="hide popup with id"><a href="blah">{{ trans('keyname') }}</a><span><a style="position:absolute; display: none;"....then the usual stuff>$diff</a>

This way, when one comes on top of the text to be translated, the translation link would pop up without breaking the page layout.

An alternative would be showing a small floating translate icon next to the texts which wont break the layouts. I think magento translator does something similar.

What do you think?

PS. The reason for giving the key twice was because it is impossible to figure out what was the original key otherwise. Perhaps there could be a better way…

[vsch]

@yurtesen, that is an awesome implementation. I love it. Great work.

If you make it available I will add it to the next release.

[yurtesen]

You are right, I should have done it from the beginning. I have made a pull request now https://github.com/vsch/laravel-translation-manager/pull/43