app/views/storytime/dashboard/posts/_form.html.erb in storytime-1.2.0 vs app/views/storytime/dashboard/posts/_form.html.erb in storytime-2.0.0

- old
+ new

@@ -1,155 +1,161 @@ -<%= simple_form_for [:dashboard, @post] do |f| %> - <%= f.error_notification %> - - <%= hidden_field_tag :type, @post.type_name %> - <%= hidden_field_tag 'post[published]', @post.published_at.nil? ? 0 : 1 if Pundit.policy(current_user, @post).publish? %> - - <div class="post_field post_title"> - <small> - <div class="pull-right" id="title_character_limit" data-limit="<%= Storytime.post_title_character_limit %>"></div> - </small> - <%= f.input :title, autofocus: true %> +<div> + <div id="versions-panel" class="collapse post-action-panel"> + <div style="padding: 20px;"> + <div class="container-fluid"> + <div class="row"> + <div class="col-md-8 col-md-offset-2"> + <ul class="list-group" style="margin: 0;"> + <%= render partial: 'storytime/dashboard/versions/version.html.erb', collection: @post.versions.order(created_at: :desc), locals: { versionable: @post } %> + </ul> + <%= link_to "Done", '#', class: "btn btn-primary btn-outline pull-right", style: "margin-top: 10px; margin-right: 15px;", data: { toggle: 'collapse', target: '#versions-panel' } %> + </div> + </div> + </div> + </div> </div> - - <div class="post_field post_excerpt"> - <small> - <div class="pull-right" id="excerpt_character_limit" data-limit="<%= Storytime.post_excerpt_character_limit %>"></div> - </small> - <%= f.input :excerpt, required: false %> - </div> - + <%= simple_form_for [:dashboard, @post], html: { class: "post-form #{@post.new_record? ? 'new-post-form' : 'edit-post-form'}", data: { :"autosave-url" => (url_for([:dashboard, @post, :autosaves]) unless @post.new_record?), :"post-type" => current_post_type.type_name.tableize.singularize } } do |f| %> - <div class="post_field post_content"> - <%= f.input :draft_content, as: :text, input_html: { rows: 20, class: "summernote" }, label: "Content" %> - </div> + <%= hidden_field_tag :type, @post.type_name %> + <% if Pundit.policy(current_user, @post).publish? %> + <%= f.input :published, as: :hidden, input_html: { id: "post_published" } %> + <% end %> + <div id="post-advanced-settings" class="collapse post-action-panel"> + <div style="padding: 20px;"> + <div class="container-fluid"> + <div class="row"> + <div class="col-md-8 col-md-offset-2"> - <div class="post_field post_tags"> - <%= f.association :tags, input_html: { :name => 'post[tag_list][]', class: 'chosen-select', multiple: true } %> - </div> - - - <div class="panel-group" id="accordion"> - <% if Storytime.enable_file_upload %> - <div class="panel panel-default"> - <div class="panel-heading"> - <h4 class="panel-title"> - <span class="glyphicon glyphicon-picture"></span> - <a data-toggle="collapse" href="#post_featured_images"> - <%= t('dashboard.posts.featured_images') %> - </a> - </h4> - </div> - <div id="post_featured_images" class="panel-collapse collapse"> - <div class="panel-body"> - - <div class="col-md-6"> - <%= f.input :featured_media_id, as: :hidden, input_html: { id: "featured_media_id" } %> + <% if lookup_context.template_exists?("storytime/dashboard/posts/_#{@post.type_name}_fields") %> + <%= render("storytime/dashboard/posts/#{@post.type_name}_fields", f: f) %> + <% end %> - <div class="featured_image_block center-block"> - <span class="glyphicon glyphicon-picture select_featured_image" style="<% if @post.featured_media %>display: none<% end %>"></span> + <% unless @post.is_a?(Storytime::Page) || @post.is_a?(Storytime::Blog) %> + <div class="post_field post_excerpt character-limit"> + <small> + <div class="pull-right character-limit-display" data-limit="<%= Storytime.post_excerpt_character_limit %>"></div> + </small> + <%= f.input :excerpt, required: false, input_html: { class: "character-limit-input" } %> + </div> - <div id="featured_media_container" class="image_container"> - <%= image_tag @post.featured_media.file_url(:thumb), id: "featured_media_image" if @post.featured_media %> + <div class="post_field post_tags"> + <%= f.association :tags, input_html: { name: "#{@post.class.name.split('::').last.tableize.singularize}[tag_list][]", class: 'chosen-select tags-input', multiple: true } %> </div> + <% end %> - <div class="select_featured_image" <% if @post.featured_media %>style="display: none"<% end %>> - <%= link_to "Select Featured Image", "#", class: "btn btn-primary", id: "featured_media_button" %> + <div class="row"> + <div class="col-sm-6"> + <%= f.input :slug, input_html: { value: (@post.persisted? ? @post.slug : nil) } %> </div> + <div class="col-sm-6"> + <%= f.input :published_at, as: :date_time_picker, label: "Publish Date/Time", input_html: { style: "display: inline;" } %> + </div> </div> + + <hr> - <button type="button" class="btn btn-danger remove_featured_image center-block" <% unless @post.featured_media %>style="display: none"<% end %>> - <%= t('dashboard.posts.remove_image') %> - </button> - </div> + <div class="post_actions"> + <%= link_to "Cancel", '#', class: "btn btn-default", data: { toggle: 'collapse', target: '#post-advanced-settings' } %> - <div class="col-md-6"> - <%= f.input :secondary_media_id, as: :hidden, input_html: { id: "secondary_media_id" } %> - - <div class="featured_image_block center-block"> - <span class="glyphicon glyphicon-picture select_featured_image" style="<% if @post.secondary_media %>display: none<% end %>"></span> - - <div id="secondary_media_container" class="image_container"> - <%= image_tag @post.secondary_media.file_url(:thumb), id: "secondary_media_image" if @post.secondary_media %> + <div class="pull-right"> + <%= f.submit "Save Draft", id: "save-draft-submit", class: "btn btn-default save" unless @post.published? %> + <%= f.submit "Publish", class: "btn btn-primary btn-outline publish", publish: true unless @post.published? %> + <%= f.submit "Update", class: "btn btn-primary btn-outline save" if @post.published? %> </div> + + <% unless @post.is_a?(Storytime::Page) || @post.is_a?(Storytime::Blog) %> + <div class="notify_subscribers_checkbox pull-right"> + <%= f.input :notifications_enabled, as: :boolean, label: "Notify subscribers of new post" unless @post.published? %> + </div> + <% end %> - <div class="select_featured_image" <% if @post.secondary_media %>style="display: none"<% end %>> - <%= link_to "Select Secondary Image", "#", class: "btn btn-primary", id: "secondary_media_button" %> - </div> </div> - - <button type="button" class="btn btn-danger remove_featured_image center-block" <% unless @post.secondary_media %>style="display: none"<% end %>> - <%= t('dashboard.posts.remove_image') %> - </button> </div> - </div> </div> </div> - <% end %> - - <% if lookup_context.template_exists?("storytime/dashboard/posts/_#{@post.type_name}_fields") %> - <div class="panel panel-default"> - <div class="panel-heading"> - <h4 class="panel-title"> - <span class="glyphicon glyphicon-th-list"></span> - <a data-toggle="collapse" href="#post_additional_fields"> - <%= t('dashboard.posts.additional_fields') %> - </a> - </div> - <div id="post_additional_fields" class="panel-collapse collapse in"> - <div class="panel-body"> - <%= render("storytime/dashboard/posts/#{@post.type_name}_fields", f: f) %> + </div> + + <% if Storytime.enable_file_upload && !@post.is_a?(Storytime::Page) && !@post.is_a?(Storytime::Blog) %> + <div class="collapse post-action-panel" id="featured-images-panel"> + <div style="padding: 20px;"> + <div class="container-fluid"> + <div class="row"> + <div class="col-md-8 col-md-offset-2"> + <div class="row"> + <div class="col-sm-10 col-sm-offset-1"> + <div class="row"> + <div class="col-sm-6"> + <div class="well text-center featured_image_block <%= 'has-image' if @post.featured_media %>"> + <%= f.input :featured_media_id, as: :hidden, input_html: { id: "featured_media_id" } %> + <div id="featured_media_container" class="image_container"> + <%= image_tag @post.featured_media.file_url(:thumb), id: "featured_media_image" if @post.featured_media %> + </div> + <button type="button" class="btn btn-danger btn-block remove_featured_image"> + <%= t('dashboard.posts.remove_image') %> + </button> + <i class="icon-st-icons-images select_featured_image"></i> + <div class="select_featured_image"> + <%= link_to "Select Featured Image", "#", class: "btn btn-primary btn-outline text-lighter", id: "featured_media_button" %> + </div> + </div> + </div> + <div class="col-sm-6"> + <div class="well text-center featured_image_block <%= 'has-image' if @post.secondary_media %>"> + <%= f.input :secondary_media_id, as: :hidden, input_html: { id: "secondary_media_id" } %> + <div id="secondary_media_container" class="image_container"> + <%= image_tag @post.secondary_media.file_url(:thumb), id: "secondary_media_image" if @post.secondary_media %> + </div> + <button type="button" class="btn btn-danger btn-block remove_featured_image"> + <%= t('dashboard.posts.remove_image') %> + </button> + <i class="icon-st-icons-images select_featured_image"></i> + <div class="select_featured_image"> + <%= link_to "Select Secondary Image", "#", class: "btn btn-primary btn-outline text-lighter", id: "secondary_media_button" %> + </div> + </div> + </div> + </div> + <%= link_to "Done", '#', class: "btn btn-primary btn-outline pull-right", style: "margin-top: 10px;", data: { toggle: 'collapse', target: '#featured-images-panel' } %> + </div> + </div> + </div> + </div> </div> </div> </div> <% end %> + + <div class="container-fluid editor"> + <div class="row"> + <div class="col-md-8 col-md-offset-2"> - <div class="panel panel-default"> - <div class="panel-heading"> - <h4 class="panel-title"> - <span class="glyphicon glyphicon-cog"></span> - <a data-toggle="collapse" href="#post_advanced_settings"> - <%= t('dashboard.posts.advanced_settings') %> - </a> - </h4> - </div> - <div id="post_advanced_settings" class="panel-collapse collapse"> - <div class="panel-body"> + <%= autosave_info @post if @post.persisted? %> - <%= f.input :slug %> + <%= f.error_notification if false %> + + <div class="character-limit"> + <span id="title_character_limit" class="text-muted character-limit-display" data-limit="<%= Storytime.post_title_character_limit %>"></span> + <h2 contenteditable="true" id="post-title-input" style="outline: none; margin-top: 0;" class="contenteditable character-limit-contenteditable" data-input="#<%= @post.class.name.split('::').last.tableize.singularize %>_title" placeholder="Title" autofocus="autofocus"><%= @post.title %></h2> + <%= f.input :title, as: :hidden, input_html: { class: "character-limit-input" } %> + </div> + <% if @post.errors[:title].present? %> + <span class="has-error"> + <span class="help-block"><%= @post.errors[:title][0] %></span> + </span> + <% end %> - <%= f.input :published_at, as: :date_time_picker, input_html: { style: "display: inline" } if @post.published? %> + <!-- Do not add any extra whitespace inside this div. It gets copied into the post content. --> + <div class="medium-editor" data-input="#<%= @post.class.name.split('::').last.tableize.singularize %>_draft_content" id="medium-editor-post" contenteditable='true' style="outline: none; margin-top: 30px;"><%= raw @post.draft_content %></div> </div> </div> </div> - </div> - - <hr> - <div class="post_actions"> - <% if @post.persisted? %> - <%= link_to 'Delete', url_for([:dashboard, @post]), method: :delete, data: { confirm: t('common.are_you_sure_you_want_to_delete', resource_name: @post.human_name) }, class: "btn btn-danger" %> - <%= link_to "Preview", post_path(@post, preview: true), class: "btn btn-info", id: "preview_post", target: "_blank" %> - <% else %> - <button id="preview_post" class="btn btn-info">Preview</button> - <% end %> + <%= f.input :draft_content, as: :text, label: false, input_html: { class: "codemirror draft-content-input" } %> - <%= f.submit "Save Draft", class: "btn btn-default save" unless @post.published? %> - - <div class="pull-right"> - <%= f.submit "Publish", class: "btn btn-primary publish", publish: true unless @post.published? %> - <%= f.submit "Update", class: "btn btn-default save" if @post.published? %> - </div> - - - <div class="notify_subscribers_checkbox pull-right"> - <%= f.input :send_subscriber_email, as: :boolean, label: "Notify subscribers of new post" unless @post.published? %> - </div> - - </div> -<% end %> + <% end %> +</div> <%= render "storytime/dashboard/media/modal" if Storytime.enable_file_upload %>