]> git.immae.eu Git - github/shaarli/Shaarli.git/blobdiff - tpl/editlink.html
Template upgrade to handle plugin zones
[github/shaarli/Shaarli.git] / tpl / editlink.html
index 4ad43b35cac94e2db396423eb23f832103458292..889d913d9126a664c43f669efdcce636eca2a774 100644 (file)
@@ -1,28 +1,85 @@
 <!DOCTYPE html>
 <html>
-<head>{include="includes"}</head>
-<body 
-{if condition="$link.title==''"}onload="document.linkform.lf_title.focus();"
-{elseif condition="$link.description==''"}onload="document.linkform.lf_description.focus();"
+<head>{include="includes"}
+    <link type="text/css" rel="stylesheet" href="../inc/awesomplete.css" />
+    <script src="inc/awesomplete.min.js#"></script>
+</head>
+<body
+{if="$link.title==''"}onload="document.linkform.lf_title.focus();"
+{elseif="$link.description==''"}onload="document.linkform.lf_description.focus();"
 {else}onload="document.linkform.lf_tags.focus();"{/if} >
 <div id="pageheader">
+       {if="$source !== 'firefoxsocialapi'"}
        {include="page.header"}
+       {/if}
        <div id="editlinkform">
            <form method="post" name="linkform">
                <input type="hidden" name="lf_linkdate" value="{$link.linkdate}">
-               <i>URL</i><br><input type="text" name="lf_url" value="{$link.url|htmlspecialchars}" style="width:100%"><br>
-               <i>Title</i><br><input type="text" name="lf_title" value="{$link.title|htmlspecialchars}" style="width:100%"><br>
-               <i>Description</i><br><textarea name="lf_description" rows="4" cols="25" style="width:100%">{$link.description|htmlspecialchars}</textarea><br>
-               <i>Tags</i><br><input type="text" id="lf_tags" name="lf_tags" value="{$link.tags|htmlspecialchars}" style="width:100%"><br>
-               <input type="checkbox" {if condition="$link.private!=0"}checked="yes"{/if} style="margin:7 0 10 0;" name="lf_private" id="lf_private">&nbsp;<label for="lf_private"><i>Private</i></label><br>
-               <input type="submit" value="Save" name="save_edit" class="bigbutton" style="margin-left:40px;">
-               <input type="submit" value="Cancel" name="cancel_edit" class="bigbutton" style="margin-left:40px;">
-               {if condition="!$link_is_new"}<input type="submit" value="Delete" name="delete_link" class="bigbutton" style="margin-left:180px;" onClick="return confirmDeleteLink();">{/if}
+               <label for="lf_url"><i>URL</i></label><br><input type="text" name="lf_url" id="lf_url" value="{$link.url}" class="lf_input"><br>
+            <label for="lf_title"><i>Title</i></label><br><input type="text" name="lf_title" id="lf_title" value="{$link.title}" class="lf_input"><br>
+            <label for="lf_description"><i>Description</i></label><br><textarea name="lf_description" id="lf_description" rows="4" cols="25">{$link.description}</textarea><br>
+            <label for="lf_tags"><i>Tags</i></label><br>
+            <input type="text" name="lf_tags" id="lf_tags" value="{$link.tags}" class="lf_input"
+                data-list="{loop="$tags"}{$key}, {/loop}" data-multiple autocomplete="off" ><br>
+
+            {loop="$edit_link_plugin"}
+                {$value}
+            {/loop}
+
+               {if="($link_is_new && $GLOBALS['privateLinkByDefault']==true) || $link.private == true"}
+            <input type="checkbox" checked="checked" name="lf_private" id="lf_private">
+            &nbsp;<label for="lf_private"><i>Private</i></label><br>
+            {else}
+            <input type="checkbox"  name="lf_private" id="lf_private">
+            &nbsp;<label for="lf_private"><i>Private</i></label><br>
+            {/if}
+               <input type="submit" value="Save" name="save_edit" class="bigbutton">
+               <input type="submit" value="Cancel" name="cancel_edit" class="bigbutton">
+               {if="!$link_is_new"}<input type="submit" value="Delete" name="delete_link" class="bigbutton delete" onClick="return confirmDeleteLink();">{/if}
                <input type="hidden" name="token" value="{$token}">
-               {if condition="$http_referer"}<input type="hidden" name="returnurl" value="{$http_referer|htmlspecialchars}">{/if}
+               {if="$http_referer"}<input type="hidden" name="returnurl" value="{$http_referer}">{/if}
            </form>
        </div>
 </div>
+{if="$source !== 'firefoxsocialapi'"}
 {include="page.footer"}
+{/if}
+{if="($GLOBALS['config']['OPEN_SHAARLI'] || isLoggedIn())"}
+<script>
+    $ = Awesomplete.$;
+    awesomplete = new Awesomplete($('input[data-multiple]'), {
+        filter: function(text, input) {
+            return Awesomplete.FILTER_CONTAINS(text, input.match(/[^ ]*$/)[0]);
+        },
+        replace: function(text) {
+            var before = this.input.value.match(/^.+ \s*|/)[0];
+            this.input.value = before + text + " ";
+        },
+        minChars: 1
+    });
+
+    /**
+     * Remove already selected items from autocompletion list.
+     * HTML list is never updated, so removing a tag will add it back to awesomplete.
+     *
+     * FIXME: This a workaround waiting for awesomplete to handle this.
+     *  https://github.com/LeaVerou/awesomplete/issues/16749
+     */
+    var input = document.querySelector('#lf_tags');
+    input.addEventListener('input', function()
+    {
+        proposedTags = input.getAttribute('data-list').replace(/,/g, '').split(' ');
+        reg = /(\w+) /g;
+        while((match = reg.exec(input.value)) !== null) {
+            id = proposedTags.indexOf(match[1]);
+            if(id != -1 ) {
+                proposedTags.splice(id, 1);
+            }
+        }
+
+        awesomplete.list = proposedTags;
+    });
+</script>
+{/if}
 </body>
-</html>
\ No newline at end of file
+</html>