ASP Classic blog framework - BrainOrdure
Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.

91 рядки
3.7KB

  1. <div class="row">
  2. <div class="col-lg-8">
  3. <div class="card shadow-sm">
  4. <div class="card-body">
  5. <h1 class="h3 mb-4">Edit Post</h1>
  6. <form method="post" action="<%= PostUpdateUrl(post.PostID) %>">
  7. <div class="mb-3">
  8. <label class="form-label" for="Title">Title</label>
  9. <input class="form-control" type="text" id="Title" name="Title" value="<%= H(post.Title) %>" required>
  10. </div>
  11. <div class="mb-3">
  12. <label class="form-label" for="Summary">Summary</label>
  13. <textarea class="form-control" id="Summary" name="Summary" rows="3"><%= H(post.Summary) %></textarea>
  14. </div>
  15. <div class="mb-3">
  16. <label class="form-label" for="BodyEditor">Body</label>
  17. <input type="hidden" id="Body" name="Body" value="<%= H(post.Body) %>">
  18. <div class="editor-shell">
  19. <div id="BodyEditor" class="rich-editor" aria-label="Post body editor"></div>
  20. </div>
  21. <div class="form-text">Use the toolbar to format the post or add an AI-generated image.</div>
  22. </div>
  23. <div class="mb-4">
  24. <label class="form-label" for="CategoryID">Category ID</label>
  25. <input class="form-control" type="number" id="CategoryID" name="CategoryID" min="0" value="<%= H(post.CategoryID) %>">
  26. </div>
  27. <div class="d-flex flex-wrap gap-2">
  28. <button class="btn btn-primary" type="submit">Update Post</button>
  29. <button class="btn btn-outline-info" type="submit" formaction="<%= AdminPostAIUrl(post.PostID) %>" formmethod="post">AI Content</button>
  30. <a class="btn btn-outline-secondary" href="<%= PostsUrl() %>">Cancel</a>
  31. </div>
  32. </form>
  33. <form method="post" action="<%= PostDeleteUrl(post.PostID) %>" class="mt-3">
  34. <button class="btn btn-outline-danger" type="submit">Delete Post</button>
  35. </form>
  36. </div>
  37. </div>
  38. </div>
  39. </div>
  40. <link href="https://cdn.jsdelivr.net/npm/quill@1.3.7/dist/quill.snow.css" rel="stylesheet" />
  41. <script src="https://cdn.jsdelivr.net/npm/quill@1.3.7/dist/quill.min.js"></script>
  42. <script>
  43. (function () {
  44. if (!window.Quill) return;
  45. var bodyInput = document.getElementById('Body');
  46. var bodyEditor = document.getElementById('BodyEditor');
  47. bodyEditor.innerHTML = bodyInput.value || '';
  48. var quill = new Quill(bodyEditor, {
  49. theme: 'snow',
  50. modules: {
  51. toolbar: [
  52. [{ header: [1, 2, 3, false] }],
  53. ['bold', 'italic', 'underline', 'blockquote', 'code-block'],
  54. [{ list: 'ordered' }, { list: 'bullet' }],
  55. ['link', 'image', 'clean']
  56. ]
  57. }
  58. });
  59. var toolbar = quill.getModule('toolbar').container;
  60. var aiButton = document.createElement('button');
  61. aiButton.type = 'button';
  62. aiButton.className = 'btn btn-sm btn-outline-secondary ms-2';
  63. aiButton.innerHTML = '<i class="bi bi-image me-1"></i>AI Image';
  64. aiButton.addEventListener('click', function () {
  65. var prompt = window.prompt('Describe the image to generate with AI');
  66. if (!prompt) return;
  67. var url = 'https://pollinations.ai/p/' + encodeURIComponent(prompt);
  68. var range = quill.getSelection(true) || { index: quill.getLength() };
  69. quill.insertEmbed(range.index, 'image', url, Quill.sources.USER);
  70. quill.insertText(range.index + 1, '\n', Quill.sources.SILENT);
  71. quill.setSelection(range.index + 2, Quill.sources.SILENT);
  72. });
  73. toolbar.appendChild(aiButton);
  74. var form = bodyInput.closest('form');
  75. form.addEventListener('submit', function () {
  76. bodyInput.value = quill.root.innerHTML;
  77. });
  78. })();
  79. </script>

Powered by TurnKey Linux.