<div dir="ltr"><div class="gmail_extra"><div class="gmail_quote">2013/11/30 Michael Van Canneyt <span dir="ltr"><<a href="mailto:michael@freepascal.org" target="_blank">michael@freepascal.org</a>></span><br><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">

[...]<br>

I want to program the browser itself. In Pascal.<br></blockquote><div><br></div><div>Hello Michael,</div><div><br></div><div>Why not use an existing webkit (like Qt or Chrome) and incorporate it into Lazarus? That would leave the responsibility for compatibility with HTML5, CSS3, mp3 encode, webGL, file manipulation, , support for cross-platform etc. for the webkit.<br>

</div><div><br></div><div>Please see this nice project:</div><div><br></div><div><a href="https://github.com/rogerwang/node-webkit">https://github.com/rogerwang/node-webkit</a><br></div><div><br></div><div>It uses a embedded Qt webkit version, and is very easy to use. E.g.:</div>

<div>-------</div><div><h2 style="margin:1em 0px 15px;line-height:1.7;font-size:2em;padding:0px;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(238,238,238);color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif">

Quick Start</h2><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">Create <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">index.html</code>:</p>

<div class="" style="color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px"><pre style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:13px;margin-top:15px;margin-bottom:15px;background-color:rgb(248,248,248);border:1px solid rgb(221,221,221);line-height:19px;overflow:auto;padding:6px 10px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal">

<span class="" style="color:rgb(153,153,153);font-weight:bold"><!DOCTYPE html></span>

<span class="" style="color:navy"><html></span>

  <span class="" style="color:navy"><head></span>

    <span class="" style="color:navy"><title></span>Hello World!<span class="" style="color:navy"></title></span>

  <span class="" style="color:navy"></head></span>

  <span class="" style="color:navy"><body></span>

    <span class="" style="color:navy"><h1></span>Hello World!<span class="" style="color:navy"></h1></span>

We are using node.js <span class="" style="color:navy"><script><span class="" style="color:rgb(0,134,179)">document<span class="">.<span class="">write<span class="">(<span class="">process<span class="">.<span class="">version<span class="">)<span class="" style="color:navy"></script>.

  <span class="" style="color:navy"></body></span>

<span class="" style="color:navy"></html></span>

</pre></div><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">Create <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">package.json</code>:</p>

<div class="" style="color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px"><pre style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:13px;margin-top:15px;margin-bottom:15px;background-color:rgb(248,248,248);border:1px solid rgb(221,221,221);line-height:19px;overflow:auto;padding:6px 10px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal">

<span class="">{</span>

  <span class="" style="color:navy">"name"</span><span class="">:</span> <span class="" style="color:rgb(221,17,68)">"nw-demo"</span><span class="">,</span>

  <span class="" style="color:navy">"main"</span><span class="">:</span> <span class="" style="color:rgb(221,17,68)">"index.html"</span>

<span class="">}</span>

</pre></div><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">Compress <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">index.html</code> and <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">package.json</code> into a zip archive called <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">app.nw</code>:</p>

<div class="" style="color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px"><pre style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:13px;margin-top:15px;margin-bottom:15px;background-color:rgb(248,248,248);border:1px solid rgb(221,221,221);line-height:19px;overflow:auto;padding:6px 10px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal">

<span class="" style="color:teal">$ </span>zip app.nw index.html package.json

</pre></div><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">This should create a structure like this:</p><pre style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:13px;margin-top:15px;margin-bottom:15px;background-color:rgb(248,248,248);border:1px solid rgb(221,221,221);line-height:19px;overflow:auto;padding:6px 10px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal;color:rgb(51,51,51)">

<code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px;padding:0px;border:none;background-color:transparent;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal">app.nw

|-- package.json

`-- index.html

</code></pre><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">Download the prebuilt binary for your platform and use it to open the <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">app.nw</code> file:</p>

<div class="" style="color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px"><pre style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:13px;margin-top:15px;margin-bottom:15px;background-color:rgb(248,248,248);border:1px solid rgb(221,221,221);line-height:19px;overflow:auto;padding:6px 10px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;word-wrap:normal">

<span class="" style="color:teal">$ </span>./nw app.nw

</pre></div><p style="margin:15px 0px;color:rgb(51,51,51);font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:15px;line-height:25px">Note: on Windows, you can drag the <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">app.nw</code> to <code style="font-family:Consolas,'Liberation Mono',Courier,monospace;font-size:12px;margin:0px 2px;padding:0px 5px;border:1px solid rgb(221,221,221);background-color:rgb(248,248,248);border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;white-space:nowrap">nw.exe</code> to open it.</p>

</div><div>-------<br></div><div><br></div><div>It tested it in my Windows and worked like a charm:</div><div><br></div><div><a href="https://www.dropbox.com/s/hx489n2oxruvf45/nwk.png">https://www.dropbox.com/s/hx489n2oxruvf45/nwk.png</a><br>

</div><div><br></div><div>Adopting a webkit, we would gain a long time, because it already has all hard implementation that a browser needs to work.<br></div><div><br></div><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left-width:1px;border-left-color:rgb(204,204,204);border-left-style:solid;padding-left:1ex">

[...]<br>

Michael.</blockquote></div><div><br></div>-- <br>Silvio Clécio<br>My public projects - <a href="http://github.com/silvioprog" target="_blank">github.com/silvioprog</a>

</div></div>