story editor polish
This commit is contained in:
parent
0ac1c341df
commit
f6bac88800
@ -1,6 +1,6 @@
|
|||||||
GIT
|
GIT
|
||||||
remote: https://github.com/HubFeenixMakers/merged
|
remote: https://github.com/HubFeenixMakers/merged
|
||||||
revision: ee228d48f4a20dc89a7c09ea9354b4b2c899271b
|
revision: a452bd5d8daf83387172fe635ba3ccbb4bdd9ace
|
||||||
specs:
|
specs:
|
||||||
merged (0.1.0)
|
merged (0.1.0)
|
||||||
active_hash
|
active_hash
|
||||||
|
@ -48,6 +48,7 @@ class MembersController < ApplicationController
|
|||||||
|
|
||||||
# Only allow a list of trusted parameters through.
|
# Only allow a list of trusted parameters through.
|
||||||
def member_params
|
def member_params
|
||||||
params.require(:member).permit(:name, :public, :bio , :picture, :arrived ,:left)
|
params.require(:member).permit(:name, :public, :bio , :picture,
|
||||||
|
:picture_cache , :arrived ,:left)
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
@ -7,6 +7,9 @@ class Member < ApplicationRecord
|
|||||||
mount_uploader :picture, PictureUploader
|
mount_uploader :picture, PictureUploader
|
||||||
has_many :stories
|
has_many :stories
|
||||||
|
|
||||||
|
validates :bio, length: { maximum: 1000 }
|
||||||
|
validates :name , length: { minimum: 3 }
|
||||||
|
|
||||||
def admin
|
def admin
|
||||||
self.email == "torsten@villataika.fi"
|
self.email == "torsten@villataika.fi"
|
||||||
end
|
end
|
||||||
|
@ -3,8 +3,8 @@ class Story < ApplicationRecord
|
|||||||
|
|
||||||
mount_uploader :picture, PictureUploader
|
mount_uploader :picture, PictureUploader
|
||||||
|
|
||||||
validates :text, length: { maximum: 1000 }
|
validates :text, length: { minimum: 5 , maximum: 1000 }
|
||||||
validates :header , length: { minimum: 5 }
|
validates :header , length: { minimum: 5 , maximum: 400}
|
||||||
|
|
||||||
def name
|
def name
|
||||||
header
|
header
|
||||||
|
@ -14,12 +14,10 @@ class PictureUploader < CarrierWave::Uploader::Base
|
|||||||
end
|
end
|
||||||
|
|
||||||
# Provide a default URL as a default if there hasn't been a file uploaded:
|
# Provide a default URL as a default if there hasn't been a file uploaded:
|
||||||
# def default_url(*args)
|
def default_url(*args)
|
||||||
# # For Rails 3.1+ asset pipeline compatibility:
|
# For Rails 3.1+ asset pipeline compatibility:
|
||||||
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
|
ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
|
||||||
#
|
end
|
||||||
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
|
|
||||||
# end
|
|
||||||
|
|
||||||
# Process files as they are uploaded:
|
# Process files as they are uploaded:
|
||||||
# process scale: [200, 300]
|
# process scale: [200, 300]
|
||||||
|
@ -11,9 +11,6 @@
|
|||||||
.field
|
.field
|
||||||
= f.label :name
|
= f.label :name
|
||||||
= f.text_field :name
|
= f.text_field :name
|
||||||
.field
|
|
||||||
= f.label :public
|
|
||||||
= f.check_box :public
|
|
||||||
.field
|
.field
|
||||||
= f.label :picture
|
= f.label :picture
|
||||||
= f.file_field :picture
|
= f.file_field :picture
|
||||||
|
@ -3,42 +3,27 @@
|
|||||||
|
|
||||||
.flex.justify-center.m-20
|
.flex.justify-center.m-20
|
||||||
.flex.flex-col
|
.flex.flex-col
|
||||||
%h1.text-4xl Editing profile
|
%h1.text-4xl Edit your profile
|
||||||
|
|
||||||
= simple_form_for @member do |f|
|
= simple_form_for @member do |f|
|
||||||
= f.error_notification
|
|
||||||
|
|
||||||
.grid.grid-cols-4.mx-20
|
.flex.justify-center
|
||||||
|
.column{class: "w-11/12 md:w-10/12 lg:w-8/12 xl:w-6/12"}
|
||||||
|
.grid.grid-cols-1.md:grid-cols-2.mx-20.gap-10
|
||||||
|
= render "merged/form/editor" , object: @member , field: :bio, form: f
|
||||||
.info.mr-8
|
.info.mr-8
|
||||||
|
.text-red-700= f.error_notification
|
||||||
= f.input :name
|
= f.input :name
|
||||||
.grid.grid-cols-2.gap-10
|
.grid.grid-cols-2.gap-10
|
||||||
= f.input :arrived
|
= f.input :arrived
|
||||||
= f.input :left
|
= f.input :left
|
||||||
= f.input :public , label: "Public: (Click box below)"
|
.flex.h-16.mt-2
|
||||||
= f.input :picture , as: :file , label: (@member.picture.blank? ? "Add picture" : "Change picture")
|
= image_tag(@member.picture_url , class: "align-middle mr-2") if @member.picture?
|
||||||
|
= f.input :picture , as: :file , input_html: {wrapper_class: "w-full"},
|
||||||
|
label: (@member.picture.blank? ? "Add picture" : "Change picture")
|
||||||
|
= f.hidden_field :picture_cache
|
||||||
.flex.justify-center.actions.m-10
|
.flex.justify-center.actions.m-10
|
||||||
= f.button :button, "Update", class: button_classes + " bg-cyan-200"
|
= f.button :button, "Update", class: button_classes + " bg-cyan-200"
|
||||||
= link_to member_path(@member) do
|
= link_to member_path(@member) do
|
||||||
%button.ml-10{type: :submit, class: button_classes}
|
%button.ml-10{type: :submit, class: button_classes}
|
||||||
Back
|
Back
|
||||||
.field.flex.flex-col.pr-2.border-r-8.border-slate-600
|
|
||||||
= f.text_area :bio ,rows: 18 , "v-model" => "markdown" , class: "appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
|
|
||||||
%div.h-90
|
|
||||||
-if @member.picture_url
|
|
||||||
%div.overflow-hidden.ml-2.mr-8
|
|
||||||
= image_tag @member.picture_url, class: "object-contain w-full"
|
|
||||||
-else
|
|
||||||
No Picture
|
|
||||||
.preview.prose
|
|
||||||
%b.text-2xl Preview
|
|
||||||
%div{"v-html" => "compiledMarkdown"}
|
|
||||||
:ruby2js
|
|
||||||
class Mark < Vue
|
|
||||||
options el: '.grid'
|
|
||||||
def initialize
|
|
||||||
@markdown = "#{@member.bio.to_s.html_safe}"
|
|
||||||
end
|
|
||||||
def compiledMarkdown
|
|
||||||
marked.parse(@markdown)
|
|
||||||
end
|
|
||||||
end
|
|
||||||
|
@ -1,17 +1,20 @@
|
|||||||
%div
|
%div
|
||||||
Story layout changes with the amount of text.
|
Story layout changes with the amount of text.
|
||||||
For short lext a wide picture is best. Otherwise square, and for
|
For short text a wide picture is best. Otherwise square, and for
|
||||||
longer text a high picture also works.
|
longer text a high picture also works.
|
||||||
= simple_form_for @story do |f|
|
= simple_form_for @story do |f|
|
||||||
= f.error_notification
|
= f.error_notification
|
||||||
|
.flex.h-16.mt-2
|
||||||
= f.input :picture , as: :file , label: (@story.picture.blank? ? "Add picture" : "Change picture")
|
= image_tag(@story.picture_url , class: "align-middle mr-2") if @story.picture?
|
||||||
|
= f.input :picture , as: :file , input_html: {wrapper_class: "w-full"},
|
||||||
|
label: (@story.picture.blank? ? "Add picture" : "Change picture")
|
||||||
|
= f.hidden_field :picture_cache
|
||||||
= f.input :header
|
= f.input :header
|
||||||
= render "merged/form/editor" , object: @story , field: :text, form: f
|
= render "merged/form/editor" , object: @story , field: :text, form: f
|
||||||
= f.input :happened , wrapper_class: "flex mt-4 align-center"
|
= f.input :happened , wrapper_class: "flex mt-4 align-center"
|
||||||
.flex.justify-between.mt-6
|
.flex.justify-between.mt-6
|
||||||
%button.bg-cyan-200.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
|
%button.bg-cyan-200.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
|
||||||
= f.submit 'Save'
|
= f.submit 'Save'
|
||||||
= link_to @story do
|
= link_to member_path(current_member) do
|
||||||
%button.ml-20.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
|
%button.ml-20.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
|
||||||
Back
|
Back
|
||||||
|
Loading…
Reference in New Issue
Block a user