locked
Widget problem with iFrames RRS feed

  • Question

  • I'm using the Bing Translator Widget to (you guessed it!) translate a number of pages in our intranet. Most of it is working nicely but on some pages the content is divided into several iFrames - and it seems that the widget is simply ignoring their content. Why is that? Is there a way to configure the widget (or adjusting the javascript) to process the iFrame content as well? As of now all content in iFrames lacks translation what is questioning the entire project.

    As a workaround I tried to include the script in every iFrame (using the onload event of the iFrame elements) and that does work sometimes - but on a random basis. Mostly some iFrames are translated and some others not and sometimes the TRANSLATE button is being displayed multiple times. Having tried several ways to include the scripts on the page and in the iFrames all with no 100% satisfactory result I have come to the conclusion that this is probably not the way to go. Or is it? How are we supposed to handle this problem?


    Tuesday, February 17, 2015 8:51 AM

Answers

  • Hi,

    Sorry for not getting back to you on this. I'm afraid we don't have any other (free) solution to offer. The Widget was built to be a simple, out-of-the-box ready to use free tool not a complete solution for all types of sites.

    The only alternative would be a direct integration of the API into your page to have full freedom on how to use it. But beyond the free 2M characters a month free tier you would have to subscribe to a paid subscription.

    As far as the bookmarklet not showing languages this is odd. Unless we can repro it (which will be hard because it's your own intranet) I'm not sure how we can help.

    Olivier.


    Microsoft Translator team - www.microsoft.com/Translator

    Friday, March 27, 2015 12:51 AM

All replies

  • Hi Sandro,

    thanks for the question. The widget will not translate the content on iframes, unless the page in that iframe contains the widget as well. You can turn off the translate button using the &ui=false switch (https://msdn.microsoft.com/en-us/library/dn735968.aspx).

    The widget can only translate the page that it sits on. Or, more generally, JavaScript can modify the page that it runs on, or was injected by the user. Never any other pages.

    The other way to address this is with the bookmarklet: http://labs.microsofttranslator.com/bookmarklet/. User invokes the bookmarklet, so it doesn't need to be embedded. Not sure how it works with iframes, but something you may try in your site.

    Let us know if any of these help,
    Chris Wendt
    Microsoft Translator

    Wednesday, February 18, 2015 2:19 AM
  • Hi Chris

    thanks for the information. I was able to get a better behaviour by adjusting the ui=false parameter but the solution is still not 100%. Let me show you what I got so far:

    <script type="text/javascript">
    
     $(document).ready(initTranslation);
    
     function initTranslation(){
      setTimeout(function(){
       for (i=0;i<document.getElementsByTagName('iframe').length;i++){
        attachScript(document.getElementsByTagName('iframe')[i],'');
       }
      },0);
      setTimeout(function(){
       $('.footer-body').prepend('<div id="MicrosoftTranslatorWidget" class="Dark" style="color:white;background-color:#555555"></div>');
       attachScript(document.getElementsByTagName('head')[0]||document.documentElement,'?ctf=false&ui=true&settings=Manual&from=de');
      },3000);
     }
    
     function attachScript(e,p){
      var s=document.createElement('script');
      s.type='text/javascript';s.charset='UTF-8';
      s.src=((location && location.href && location.href.indexOf('https') == 0)?'https://ssl.microsofttranslator.com':'http://www.microsofttranslator.com')+'/ajax/v3/WidgetV3.ashx'+p;
      e.insertBefore(s,e.firstChild);
     }
    
    </script>

    First problem: I don't understand the timing between inserting the different scripts. As you can see I'm inserting the scripts to the iFrames at first and to the root document 3s later. This seems stupid but without some delay I'm irregularly getting javasvcript errors ('_msctl3' not defined, type not defined etc.) and adding a delay of at least 3s has resulted in the best behavior so far. Is there a better way to handle this? What would be the correct process for doing that?

    Second problem: I tried adding an ajaxCompleted-event to translate content that is loaded after the initial display of the page:

      $(document).ajaxComplete(function(){
       Microsoft.Translator.Widget.Translate('de','ar');
      });

    This actually does work - although with an ugly flickering as the whole page gets reset and then retranslated. Is there a way to translate only the new elements or to ignore the already translated elements from being retranslated? And how to I get the correct values for the now hardcoded from/to language parameters?

    As an alternative I tried using the bookmarklet you suggested. This actually does work with iFrames! What I don't understand is that sometimes the translation header is missing the language options:

    Any ideas about that? And finally there's  one BIG problem with the bookmarklet: Unlike the widget the bookmarklets script request points to http only and there seems to be no https address available (at least changing to https currently doesn't work?). Therefore using the bookmarklet on secure pages imposes some new problems...


    • Edited by Sandro Rudin Wednesday, February 18, 2015 11:11 AM
    Wednesday, February 18, 2015 11:08 AM
  • So the questions remain:

    • Widget: How to exactly insert the scripts on a page with iFrames in order to improve my solution?
    • Widget: How to handle ajax-events?
    • Bookmarklet: Why are the language dropdowns missing?

    Chris? Anyone else?

    Thursday, February 26, 2015 7:55 AM
  • Hi,

    Sorry for not getting back to you on this. I'm afraid we don't have any other (free) solution to offer. The Widget was built to be a simple, out-of-the-box ready to use free tool not a complete solution for all types of sites.

    The only alternative would be a direct integration of the API into your page to have full freedom on how to use it. But beyond the free 2M characters a month free tier you would have to subscribe to a paid subscription.

    As far as the bookmarklet not showing languages this is odd. Unless we can repro it (which will be hard because it's your own intranet) I'm not sure how we can help.

    Olivier.


    Microsoft Translator team - www.microsoft.com/Translator

    Friday, March 27, 2015 12:51 AM