midori/data/speeddial-head.html

<!--
 Speed Dial head template for Midori.
 Copyright (C) 2009 Jean-François Guchens <zcx000@gmail.com>
 Copyright (C) 2011 Paweł Forysiuk <tuxator@o2.pl>
 Copyright (C) 2011 Cassidy James <email@cassidyjames.com>
 This file is licensed under the terms of the expat license, see the file EXPAT.
-->

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>{title}</title>
    <style>
    * {
        margin: 0;
        padding: 0;
        cursor: default;
        font-size: 13px;
        color: #4d4d4d;
    }

    html, body {
        font-family: sans-serif;
        width: 100%;
        height: 100%;
        outline: 0;
    }

    #content {
        width: 100%;
        height: 95%;
        margin: 0 auto;
        padding: 0;
    }

    div.shortcut {
        width: 25%;
        height: 33%;
        float: left;
    }

    div.shortcut .preview {
        width: 70%;
        height: 60%;
        margin: 20% auto;
        -webkit-box-shadow: 0 1px 6px rgba(0,0,0,.25), 0 0 2px #fff inset;
        box-shadow: 0 1px 6px rgba(0,0,0,.25), 0 0 2px #fff inset;
        background-image: -webkit-gradient(
            linear, center top, center bottom,
            from(#f6f6f6), to(#e3e3e3));
        border: 1px solid #bebebe;
        border-bottom-color: #a0a0a0;
        position: relative;
    }

    div.shortcut .preview img {
        width: 100%;
        height: 98%;
        cursor: pointer;
    }

    div.shortcut .preview.new .add {
        display: block;
        height: 100%;
        width: 50%;
        margin: 0 auto;
        cursor: pointer;
    }

    .title {
        text-align: center;
        margin-top: -12%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        cursor: text;
    }

    .cross {
        display: block;
        width: 27px;
        height: 27px;
        top: -14px;
        right: -14px;
        background: url(res://close.png);
        position: absolute;
        cursor: pointer;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: opacity 0.15s;
    }

    div.shortcut .preview:hover .cross {
        visibility: visible;
        opacity: 1;
        -webkit-transition-delay: 0.5s;
    }

    .box.added {
        display:none;
    }

    div.osd {
        top: 9px;
        position: fixed;
        width: 100%;
        text-align: right;
    }

    div.osd span {
        border: 1px solid #999;
        background-color: #f5f5f5;
        padding: 8px;
        color: #999;
        -webkit-border-bottom-left-radius: 10px;
        visibility: hidden;
    }
    </style>

    <script type="text/javascript">

    var getAction = function (id)
    {
        var host = document.getElementById(id).childNodes[0].childNodes[0].host;
        if (host)
            return true;

        var url = prompt ("{enter_shortcut_address}", "http://");
        if (!url) return false;
        if (url.indexOf ("://") == -1)
            url = "http://" + url;

        console.log ("speed_dial-save-add " + id + " " + url + " ");
        return false;
    }

    var renameShortcut = function (id)
    {
        var old_name = document.getElementById(id).childNodes[1].textContent;

        var name = prompt ("{enter_shortcut_name}", old_name);
        if (!name) return;

        console.log ("speed_dial-save-rename " + id + " " + name);
    }

    var clearShortcut = function (id)
    {
        if(!confirm("{are_you_sure}"))
            return;

        console.log ("speed_dial-save-delete " + id);
    }

    var key_id = 's';
    var key_timeout;

    document.onkeypress = function ()
    {
        key_id = key_id + String.fromCharCode (event.which);

        clearTimeout (key_timeout);

        document.getElementById('dialing').innerText = key_id.substr(1);
        document.getElementById('dialing').style.visibility = 'visible';

        var div = document.getElementById(key_id);
        if (div)
        {
            if (key_id.substr(1) > 9)
            {
                if (getAction (key_id))
                    document.location = div.childNodes[0].childNodes[0].href;
                key_id = 's';
            }
            else
                key_timeout = setTimeout ('if (getAction (key_id)) document.location = document.getElementById(key_id).childNodes[0].childNodes[0].href; key_id = \'s\'', 1000);
        }
        else
            key_id = 's';

        if (key_id.length <= 1)
            document.getElementById('dialing').style.visibility = 'hidden';

        return false;
    }

    </script>
</head>
<body>
    <div class="osd" >
        <span id="dialing"></span>
    </div>
    <div id="content">
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`<!--`
			`Speed Dial head template for Midori.`
			`Copyright (C) 2009 Jean-François Guchens <zcx000@gmail.com>`
Show speed dial close button only when hovering over thumbnail 2011-10-14 17:42:29 +00:00			`Copyright (C) 2011 Paweł Forysiuk <tuxator@o2.pl>`
			`Copyright (C) 2011 Cassidy James <email@cassidyjames.com>`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`This file is licensed under the terms of the expat license, see the file EXPAT.`
			`-->`

			`<html xmlns="http://www.w3.org/1999/xhtml">`
			`<head>`
			`<title>{title}</title>`
			`<style>`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`* {`
			`margin: 0;`
			`padding: 0;`
			`cursor: default;`
			`font-size: 13px;`
			`color: #4d4d4d;`
Store speed dial as JSON instead of actual HTML source This will make it possible to change the layout of the page without losing shortcuts. 2009-05-13 21:56:55 +00:00			`}`

Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`html, body {`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`font-family: sans-serif;`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`width: 100%;`
			`height: 100%;`
			`outline: 0;`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`}`

Remove the search field from the speed dial 2009-05-15 21:47:32 +00:00			`#content {`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`width: 100%;`
			`height: 95%;`
			`margin: 0 auto;`
			`padding: 0;`
Remove the search field from the speed dial 2009-05-15 21:47:32 +00:00			`}`

Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`div.shortcut {`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`width: 25%;`
			`height: 33%;`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`float: left;`
			`}`

Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`div.shortcut .preview {`
			`width: 70%;`
			`height: 60%;`
			`margin: 20% auto;`
			`-webkit-box-shadow: 0 1px 6px rgba(0,0,0,.25), 0 0 2px #fff inset;`
			`box-shadow: 0 1px 6px rgba(0,0,0,.25), 0 0 2px #fff inset;`
			`background-image: -webkit-gradient(`
			`linear, center top, center bottom,`
			`from(#f6f6f6), to(#e3e3e3));`
			`border: 1px solid #bebebe;`
			`border-bottom-color: #a0a0a0;`
Properly position speed dial close and show on hover 2011-10-10 23:52:39 +00:00			`position: relative;`
			`}`

			`div.shortcut .preview img {`
			`width: 100%;`
			`height: 98%;`
			`cursor: pointer;`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`}`

Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`div.shortcut .preview.new .add {`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`display: block;`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`height: 100%;`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`width: 50%;`
			`margin: 0 auto;`
			`cursor: pointer;`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`}`

Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`.title {`
			`text-align: center;`
			`margin-top: -12%;`
Generate speed dial from key file without JSON A timer for speed dial is shown if MIDORI_STARTTIME is defined. 2011-03-22 21:59:56 +00:00			`white-space: nowrap;`
			`text-overflow: ellipsis;`
			`overflow: hidden;`
Allow adding speed dial shortcuts from the context menu 2009-05-09 14:41:01 +00:00			`cursor: text;`
Allow custom shortcut and column count in speed dial 2010-05-16 15:56:22 +00:00			`}`

Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`.cross {`
			`display: block;`
			`width: 27px;`
			`height: 27px;`
			`top: -14px;`
Speed dial should honor close-buttons-left value 2011-10-12 23:40:39 +00:00			`right: -14px;`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`background: url(res://close.png);`
Properly position speed dial close and show on hover 2011-10-10 23:52:39 +00:00			`position: absolute;`
Allow custom shortcut and column count in speed dial 2010-05-16 15:56:22 +00:00			`cursor: pointer;`
Properly position speed dial close and show on hover 2011-10-10 23:52:39 +00:00			`visibility: hidden;`
			`opacity: 0;`
			`-webkit-transition: opacity 0.15s;`
			`}`

Show speed dial close button only when hovering over thumbnail 2011-10-14 17:42:29 +00:00			`div.shortcut .preview:hover .cross {`
Properly position speed dial close and show on hover 2011-10-10 23:52:39 +00:00			`visibility: visible;`
			`opacity: 1;`
			`-webkit-transition-delay: 0.5s;`
Allow custom shortcut and column count in speed dial 2010-05-16 15:56:22 +00:00			`}`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`.box.added {`
			`display:none;`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`}`

			`div.osd {`
			`top: 9px;`
			`position: fixed;`
			`width: 100%;`
			`text-align: right;`
			`}`

			`div.osd span {`
			`border: 1px solid #999;`
			`background-color: #f5f5f5;`
			`padding: 8px;`
			`color: #999;`
			`-webkit-border-bottom-left-radius: 10px;`
			`visibility: hidden;`
			`}`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`</style>`

			`<script type="text/javascript">`
Store speed dial as JSON instead of actual HTML source This will make it possible to change the layout of the page without losing shortcuts. 2009-05-13 21:56:55 +00:00
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`var getAction = function (id)`
			`{`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`var host = document.getElementById(id).childNodes[0].childNodes[0].host;`
Drop MooTools dependency in speed dial 2011-09-06 20:50:20 +00:00			`if (host)`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`return true;`

			`var url = prompt ("{enter_shortcut_address}", "http://");`
			`if (!url) return false;`
Assume 'http://' if adding address without scheme to speed dial 2010-06-06 21:29:08 +00:00			`if (url.indexOf ("://") == -1)`
			`url = "http://" + url;`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00
Set speed dial shortcut title without asking 2011-10-10 23:53:12 +00:00			`console.log ("speed_dial-save-add " + id + " " + url + " ");`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`return false;`
			`}`

Store speed dial as JSON instead of actual HTML source This will make it possible to change the layout of the page without losing shortcuts. 2009-05-13 21:56:55 +00:00			`var renameShortcut = function (id)`
Allow adding speed dial shortcuts from the context menu 2009-05-09 14:41:01 +00:00			`{`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`var old_name = document.getElementById(id).childNodes[1].textContent;`
Store speed dial as JSON instead of actual HTML source This will make it possible to change the layout of the page without losing shortcuts. 2009-05-13 21:56:55 +00:00
Drop MooTools dependency in speed dial 2011-09-06 20:50:20 +00:00			`var name = prompt ("{enter_shortcut_name}", old_name);`
			`if (!name) return;`
Fix the search in the custom homepage and optimize the saving 2009-05-09 21:29:35 +00:00
Generate speed dial from key file without JSON A timer for speed dial is shown if MIDORI_STARTTIME is defined. 2011-03-22 21:59:56 +00:00			`console.log ("speed_dial-save-rename " + id + " " + name);`
Allow adding speed dial shortcuts from the context menu 2009-05-09 14:41:01 +00:00			`}`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00
			`var clearShortcut = function (id)`
			`{`
			`if(!confirm("{are_you_sure}"))`
			`return;`

Generate speed dial from key file without JSON A timer for speed dial is shown if MIDORI_STARTTIME is defined. 2011-03-22 21:59:56 +00:00			`console.log ("speed_dial-save-delete " + id);`
Fix the search in the custom homepage and optimize the saving 2009-05-09 21:29:35 +00:00			`}`

Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`var key_id = 's';`
			`var key_timeout;`

Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00			`document.onkeypress = function ()`
			`{`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`key_id = key_id + String.fromCharCode (event.which);`
Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`clearTimeout (key_timeout);`

Drop MooTools dependency in speed dial 2011-09-06 20:50:20 +00:00			`document.getElementById('dialing').innerText = key_id.substr(1);`
			`document.getElementById('dialing').style.visibility = 'visible';`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00
Drop MooTools dependency in speed dial 2011-09-06 20:50:20 +00:00			`var div = document.getElementById(key_id);`
			`if (div)`
Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00			`{`
Fix opening speed dial shortcuts via keyboard 2011-04-03 22:15:58 +00:00			`if (key_id.substr(1) > 9)`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`{`
			`if (getAction (key_id))`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`document.location = div.childNodes[0].childNodes[0].href;`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`key_id = 's';`
			`}`
			`else`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`key_timeout = setTimeout ('if (getAction (key_id)) document.location = document.getElementById(key_id).childNodes[0].childNodes[0].href; key_id = \'s\'', 1000);`
Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00			`}`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`else`
			`key_id = 's';`

			`if (key_id.length <= 1)`
Drop MooTools dependency in speed dial 2011-09-06 20:50:20 +00:00			`document.getElementById('dialing').style.visibility = 'hidden';`
Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`return false;`
Implement keyboard access and dynamic columns in speed dial 2010-05-14 20:59:21 +00:00			`}`

Localize "Search" in quick dial and use the user's default search 2009-05-08 00:56:26 +00:00			`</script>`
Implement quick launch page code named Tandoori The quick launch page replaces the blank page unless it turns out to be a bad idea. 2009-05-07 20:22:43 +00:00			`</head>`
Fix the search in the custom homepage and optimize the saving 2009-05-09 21:29:35 +00:00			`<body>`
Combined speed dial resize and thumbnail sizes 2010-06-01 21:56:04 +00:00			`<div class="osd" >`
			`<span id="dialing"></span>`
			`</div>`
Implement embossed speed dial with custom close buttons The close button position is wrong. 2011-10-09 23:38:39 +00:00			`<div id="content">`