<html>
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    sorry i'm not an web expert, you'd better wait for someone more
    experienced answer :)<br>
    <br>
    <div class="moz-cite-prefix">11.06.2015 16:44, Rudi Timmermans
      пишет:<br>
    </div>
    <blockquote cite="mid:557974A7.2010400@gmx.us" type="cite">
      <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
      <font size="+1">Hi Andrey,<br>
        <br>
        Ok i have try it but now i can not open anymore my chat window.<br>
        <br>
        If you can give me a hint what i change as the best i would love
        it thanks for that !<br>
        <br>
        <br>
        This i have into my code as messenger.js<br>
        <br>
      </font><br>
      <meta name="qrichtext" content="1">
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><!--StartFragment--><span style=" color:#c0c0c0;">    </span>(<span style=" color:#808000;">function</span>(){</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" color:#808000;">var</span><span style=" color:#c0c0c0;"> </span><span style=" font-style:italic; color:#2985c7;">meta</span><span style=" color:#c0c0c0;"> </span>=<span style=" color:#c0c0c0;"> </span>document.createElement(<span style=" color:#008000;">'meta'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" font-style:italic; color:#2985c7;">meta</span>.setAttribute(<span style=" color:#008000;">'name'</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">'viewport'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" color:#808000;">if</span><span style=" color:#c0c0c0;"> </span>(screen.width<span style=" color:#c0c0c0;"> </span><=<span style=" color:#c0c0c0;"> </span>540)</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">          </span><span style=" font-style:italic; color:#2985c7;">meta</span>.setAttribute(<span style=" color:#008000;">'content'</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">'width=device-width/1.5,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">initial-scale='</span>+(1.5)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">maximum-scale='</span>+(1.5)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">user-scalable=no'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" color:#808000;">else</span><span style=" color:#c0c0c0;"> </span><span style=" color:#808000;">if</span><span style=" color:#c0c0c0;"> </span>(screen.width<span style=" color:#c0c0c0;"> </span>><span style=" color:#c0c0c0;"> </span>540<span style=" color:#c0c0c0;"> </span>&&<span style=" color:#c0c0c0;"> </span>screen.width<span style=" color:#c0c0c0;"> </span><=<span style=" color:#c0c0c0;"> </span>768)</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">          </span><span style=" font-style:italic; color:#2985c7;">meta</span>.setAttribute(<span style=" color:#008000;">'content'</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">'width=device-width/2.0,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">initial-scale='</span>+(2.0)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">maximum-scale='</span>+(2.0)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">user-scalable=no'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" color:#808000;">else</span><span style=" color:#c0c0c0;"> </span><span style=" color:#808000;">if</span><span style=" color:#c0c0c0;"> </span>(screen.width<span style=" color:#c0c0c0;"> </span>><span style=" color:#c0c0c0;"> </span>768)</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">           </span><span style=" font-style:italic; color:#2985c7;">meta</span>.setAttribute(<span style=" color:#008000;">'content'</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">'width=device-width/3.0,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">initial-scale='</span>+(3.0)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">maximum-scale='</span>+(3.0)+<span style=" color:#008000;">',</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">user-scalable=no'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" color:#808000;">else</span></pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">            </span><span style=" font-style:italic; color:#2985c7;">meta</span>.setAttribute(<span style=" color:#008000;">'content'</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">'width=device-width,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">initial-scale=1.0,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">maximum-scale=1.0,</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">user-scalable=no'</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span>document.head.appendChild(<span style=" font-style:italic; color:#2985c7;">meta</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">        </span><span style=" font-style:italic; color:#0055af;">console</span>.log(<span style=" color:#008000;">"inserte</span><span style=" color:#c0c0c0;"> </span><span style=" color:#008000;">meta"</span>);</pre>
      <pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" color:#c0c0c0;">    </span>})();

Into my messenger.qml i have this:


<meta name="qrichtext" content="1">
<pre style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><!--StartFragment--><span style=" color:#800080;">Page</span><span style=" color:#c0c0c0;"> </span>{</pre>
<span style=" color:#c0c0c0;">    </span><span style=" color:#800000;">id</span>:<span style=" color:#c0c0c0;"> </span><span style=" font-style:italic; color:#000000;">page</span>
<span style=" color:#c0c0c0;">    </span><span style=" color:#800080;">SilicaWebView</span><span style=" color:#c0c0c0;"> </span>{


<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">url</span>:<span style=" color:#c0c0c0;"> </span><span style=" color:#008000;"><a moz-do-not-send="true" class="moz-txt-link-rfc2396E" href="https://www.messenger.com/login">"https://www.messenger.com/login"</a></span>
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">anchors.fill</span>:<span style=" color:#c0c0c0;"> </span><span style=" font-style:italic; color:#000000;">parent</span>
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">overridePageStackNavigation</span>:<span style=" color:#c0c0c0;"> </span>true
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.preferences.developerExtrasEnabled</span>:<span style=" color:#c0c0c0;"> </span>true
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.userStyleSheet</span>:<span style=" color:#c0c0c0;"> </span><span style=" font-style:italic; color:#0055af;">Qt</span>.resolvedUrl(<span style=" color:#008000;">"helper/messenger.css"</span>)
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.userScripts</span>:<span style=" color:#c0c0c0;"> </span>[
<span style=" color:#c0c0c0;">            </span><span style=" font-style:italic; color:#0055af;">Qt</span>.resolvedUrl(<span style=" color:#008000;">"helper/console.js"</span>),
<span style=" color:#c0c0c0;">            </span><span style=" font-style:italic; color:#0055af;">Qt</span>.resolvedUrl(<span style=" color:#008000;">"helper/messenger.js"</span>)
<span style=" color:#c0c0c0;">        </span>]
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.preferences.navigatorQtObjectEnabled</span>:<span style=" color:#c0c0c0;"> </span>true
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.preferences.fullScreenEnabled</span>:<span style=" color:#c0c0c0;"> </span>true
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">experimental.preferences.offlineWebApplicationCacheEnabled</span>:<span style=" color:#c0c0c0;"> </span>true
<span style=" color:#c0c0c0;">        </span><span style=" color:#800000;">onTitleChanged</span>:<span style=" color:#c0c0c0;"> </span>{<span style=" color:#c0c0c0;">    </span>

<pre style="-qt-paragraph-type:empty; margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><!--EndFragment-->

</pre><style type="text/css">
p, li { white-space: pre-wrap; }
</style>
<!--EndFragment--></pre>
    <style type="text/css">
p, li { white-space: pre-wrap; }
</style>
    <pre class="moz-signature" cols="72">---
Best regards!

Rudi Timmermans.</pre>
    <div class="moz-cite-prefix">Andrey Kozhevnikov schreef op 11/06/15
      om 13:30:

    </div>
    <blockquote cite="mid:5579716F.5030401@gmail.com" type="cite">
      <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
      I mean webpage viewport size. when you using QML WebView server
      detect it as mobile client and setting webpage width to your
      device screen width, and you can't scroll.

      

      <div class="moz-cite-prefix">11.06.2015 16:28, Rudi Timmermans
        пишет:

      </div>
      <blockquote cite="mid:557970FA.90202@gmx.us" type="cite">
        <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
        <font size="+1">Hi Andrey,

          

          Can you tell me where i can change this as best into the code
          please ?

          

          I'm nit shure i understand this corectly sorry...

        </font>
        <pre class="moz-signature" cols="72">---
Best regards!

Rudi Timmermans.</pre>
        <div class="moz-cite-prefix">Andrey Kozhevnikov schreef op
          11/06/15 om 13:22:

        </div>
        <blockquote cite="mid:55796F8A.7080209@gmail.com" type="cite">
          <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
          It should scroll if viewport width is higher than webview
          width.

          

          <div class="moz-cite-prefix">11.06.2015 16:20, Rudi Timmermans
            пишет:

          </div>
          <blockquote cite="mid:55796F16.90303@gmx.us" type="cite">
            <meta http-equiv="content-type" content="text/html; charset=UTF-8">
            <font size="+1">Hi,

              

              As i'm start with coding for Sailfish OS, i have some idea
              but i can not figer it out how i can fix this into the
              code.

              

              I have made a Facebook Messenger with the <a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="http://www.messenger.com">www.messenger.com</a>
              webpage build into the app, now i like to have that users
              can scroll horizontal to see older message into the chat
              window, the same as on the webpage when you have open it
              into the browser...

              

              I have search and search for examples how to code this but
              i can not found anything and i can found it out how i need
              to code it.

              

              You can find all the messenger sources here:

              

              messenger.css

              

              <a moz-do-not-send="true" class="moz-txt-link-freetext" href="https://drive.google.com/open?id=0B8QiRsNYbAIqMFhqOHExVDBFdGM&authuser=0">https://drive.google.com/open?id=0B8QiRsNYbAIqMFhqOHExVDBFdGM&authuser=0</a>

              

              messenger.js

              

              <a moz-do-not-send="true" class="moz-txt-link-freetext" href="https://drive.google.com/open?id=0B8QiRsNYbAIqbk9GbEZNWmpaWWc&authuser=0">https://drive.google.com/open?id=0B8QiRsNYbAIqbk9GbEZNWmpaWWc&authuser=0</a>

              

              messengerpage.qml

              

              <a moz-do-not-send="true" class="moz-txt-link-freetext" href="https://drive.google.com/open?id=0B8QiRsNYbAIqTGF1NDYzSGRQRlE&authuser=0">https://drive.google.com/open?id=0B8QiRsNYbAIqTGF1NDYzSGRQRlE&authuser=0</a>

              

              Thanks guys for the helps !!!

            </font>
            <pre class="moz-signature" cols="72">-- 
---
Best regards!

Rudi Timmermans.</pre>
            

            <fieldset class="mimeAttachmentHeader"></fieldset>
            

            <pre wrap="">_______________________________________________
SailfishOS.org Devel mailing list
To unsubscribe, please send a mail to <a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="mailto:devel-unsubscribe@lists.sailfishos.org">devel-unsubscribe@lists.sailfishos.org</a></pre>
          </blockquote>
          

          

          <fieldset class="mimeAttachmentHeader"></fieldset>
          

          <pre wrap="">_______________________________________________
SailfishOS.org Devel mailing list
To unsubscribe, please send a mail to <a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="mailto:devel-unsubscribe@lists.sailfishos.org">devel-unsubscribe@lists.sailfishos.org</a></pre>
        </blockquote>
        

        

        <fieldset class="mimeAttachmentHeader"></fieldset>
        

        <pre wrap="">_______________________________________________
SailfishOS.org Devel mailing list
To unsubscribe, please send a mail to <a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="mailto:devel-unsubscribe@lists.sailfishos.org">devel-unsubscribe@lists.sailfishos.org</a></pre>
      </blockquote>
      

      

      <fieldset class="mimeAttachmentHeader"></fieldset>
      

      <pre wrap="">_______________________________________________
SailfishOS.org Devel mailing list
To unsubscribe, please send a mail to <a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="mailto:devel-unsubscribe@lists.sailfishos.org">devel-unsubscribe@lists.sailfishos.org</a></pre>
    </blockquote>
    

  



<fieldset class="mimeAttachmentHeader"></fieldset>
<pre wrap="">_______________________________________________
SailfishOS.org Devel mailing list
To unsubscribe, please send a mail to <a class="moz-txt-link-abbreviated" href="mailto:devel-unsubscribe@lists.sailfishos.org">devel-unsubscribe@lists.sailfishos.org</a></pre>

</blockquote>
</body></html>