editlink.html 3.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <!DOCTYPE html>
  2. <html>
  3. <head>{include="includes"}
  4. <link type="text/css" rel="stylesheet" href="../inc/awesomplete.css" />
  5. <script src="inc/awesomplete.min.js#"></script>
  6. </head>
  7. <body
  8. {if="$link.title==''"}onload="document.linkform.lf_title.focus();"
  9. {elseif="$link.description==''"}onload="document.linkform.lf_description.focus();"
  10. {else}onload="document.linkform.lf_tags.focus();"{/if} >
  11. <div id="pageheader">
  12. {if="$source !== 'firefoxsocialapi'"}
  13. {include="page.header"}
  14. {/if}
  15. <div id="editlinkform">
  16. <form method="post" name="linkform">
  17. <input type="hidden" name="lf_linkdate" value="{$link.linkdate}">
  18. <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>
  19. <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>
  20. <label for="lf_description"><i>Description</i></label><br><textarea name="lf_description" id="lf_description" rows="4" cols="25">{$link.description}</textarea><br>
  21. <label for="lf_tags"><i>Tags</i></label><br>
  22. <input type="text" name="lf_tags" id="lf_tags" value="{$link.tags}" class="lf_input"
  23. data-list="{loop="$tags"}{$key}, {/loop}" data-multiple autocomplete="off" ><br>
  24. {if="($link_is_new && $GLOBALS['privateLinkByDefault']==true) || $link.private == true"}
  25. <input type="checkbox" checked="checked" name="lf_private" id="lf_private">
  26. &nbsp;<label for="lf_private"><i>Private</i></label><br>
  27. {else}
  28. <input type="checkbox" name="lf_private" id="lf_private">
  29. &nbsp;<label for="lf_private"><i>Private</i></label><br>
  30. {/if}
  31. <input type="submit" value="Save" name="save_edit" class="bigbutton">
  32. <input type="submit" value="Cancel" name="cancel_edit" class="bigbutton">
  33. {if="!$link_is_new"}<input type="submit" value="Delete" name="delete_link" class="bigbutton delete" onClick="return confirmDeleteLink();">{/if}
  34. <input type="hidden" name="token" value="{$token}">
  35. {if="$http_referer"}<input type="hidden" name="returnurl" value="{$http_referer}">{/if}
  36. </form>
  37. </div>
  38. </div>
  39. {if="$source !== 'firefoxsocialapi'"}
  40. {include="page.footer"}
  41. {/if}
  42. {if="($GLOBALS['config']['OPEN_SHAARLI'] || isLoggedIn())"}
  43. <script>
  44. $ = Awesomplete.$;
  45. awesomplete = new Awesomplete($('input[data-multiple]'), {
  46. filter: function(text, input) {
  47. return Awesomplete.FILTER_CONTAINS(text, input.match(/[^ ]*$/)[0]);
  48. },
  49. replace: function(text) {
  50. var before = this.input.value.match(/^.+ \s*|/)[0];
  51. this.input.value = before + text + " ";
  52. },
  53. minChars: 1
  54. });
  55. /**
  56. * Remove already selected items from autocompletion list.
  57. * HTML list is never updated, so removing a tag will add it back to awesomplete.
  58. *
  59. * FIXME: This a workaround waiting for awesomplete to handle this.
  60. * https://github.com/LeaVerou/awesomplete/issues/16749
  61. */
  62. var input = document.querySelector('#lf_tags');
  63. input.addEventListener('input', function()
  64. {
  65. proposedTags = input.getAttribute('data-list').replace(/,/g, '').split(' ');
  66. reg = /(\w+) /g;
  67. while((match = reg.exec(input.value)) !== null) {
  68. id = proposedTags.indexOf(match[1]);
  69. if(id != -1 ) {
  70. proposedTags.splice(id, 1);
  71. }
  72. }
  73. awesomplete.list = proposedTags;
  74. });
  75. </script>
  76. {/if}
  77. </body>
  78. </html>