Jump to:

3373 Posts in 998 Topics by 712 members

Data Model Questions

SilverStripe Forums » Data Model Questions » jquerymobile Weirdness - editor issue

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 936 Views
  • tazzydemon
    Avatar
    Community Member
    114 Posts

    jquerymobile Weirdness - editor issue Link to this post

    Guys

    I have a weird one here. I have modified and extended the silverstripe-mobile module (using this fork https://github.com/fonsekaean/silverstripe-mobile) and am using a new version of jquerymobile.

    It all works fine save for one thing. The pages are ajax loaded and thus the base href is the calculated as the first page (say http://mydomain.com/home) This makes many subsequent images fail given that they start "assets" and not "/assets"

    That's when the wierdness starts. In the following example:

    <p><img class="left" src="assets/images/abouttheshow/_resampled/resizedimage350233-Fish1a.jpg" alt="show" width="350" height="233" />A show for the whole family.</p>
    <p class="clearboth">&nbsp;</p>
    <p><img class="right" src="/assets/images/abouttheshow/_resampled/resizedimage400266-Kids8a.jpg" alt="Kids" width="300" /></p>

    If I change the first image to "/assets" and save, it changes back and yet that does not happen to the image with the right class. Huh? This is clearly being manipulated by SS prior to saving but where? I can't find it.

    Furthermore how can I force the system or TinyMCE to use root relative urls. TinyMCE is surprisingly vague on this as their idea of relative and absolute urls is a bit different. I want root relative urls.

    Julian

  • benjamin-smith
    Avatar
    Community Member
    17 Posts

    Re: jquerymobile Weirdness - editor issue Link to this post

    I can verify that I have the same troubles as tazzy.

    Seems the base href default functionality in SilverStripe is rather limiting in this case. I'm not sure how to get around the issue, without major overhauls to the way the WYSIWYG outputs file paths.

    Any ideas anyone?

  • Spaghetti
    Avatar
    Community Member
    31 Posts

    Re: jquerymobile Weirdness - editor issue Link to this post

    Yes I've experienced this too. What fun.

    There is one workaround, you can extend Page's onWriteBefore method to prefix the URL but I don't like this as it won't work if silverstripe isn't installed in the root directory on your server (so, for instance for local testing, it's no good to me). Found it in this post: http://www.electrictoolbox.com/silverstripe-prefix-img-src-assets-leading-slash/

    I have a workaround but it's not pretty. Basically absolute urls. This works but it's fuggly UX. I really don't like the whole 'image dialog' anyway, it's really bad design - ideally I'd like a point and click solution.

    Looking for a better way... let you know if I find one.

  • Spaghetti
    Avatar
    Community Member
    31 Posts

    Re: jquerymobile Weirdness - editor issue Link to this post

    Right, got a better solution. Worked for me, try this:

    in your mysite / _config.php add a configuration variable to say where your assets folder is relative to '/' (your web root) -as this is 'installation-specific configuration'.

    //My assets dir is off a subdirectory which is SS's root.
    global $assetsPrependHack;
    $assetsPrependHack = "/ss/assets/";

    Then in mysite / code / Page.php I added something similar to that blog post I mentioned before:

    //AC: Hack to rewrite the start of asset
    // urls so that they work on the ajaxy mobile version of the site.
    global $assetsPrependHack;
    if( isset($assetsPrependHack) ) {
    $this->Content = str_replace(
    ' src="assets/', ' src="'.$assetsPrependHack,
    $this->Content);         
    }

  • benjamin-smith
    Avatar
    Community Member
    17 Posts

    Re: jquerymobile Weirdness - editor issue Link to this post

    Or a jQuery solution...

    ;(function($){
    $(document).bind("pageinit", function(){
    $('.typography img').each(function(){
    $(this).attr('src','/'+$(this).attr('src'));
    });
    });
    })(jQuery);

    936 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.