Start reworking project edit page
This commit is contained in:
		
							parent
							
								
									2fbc1a5d5a
								
							
						
					
					
						commit
						e6dc21f058
					
				| 
						 | 
				
			
			@ -1,4 +1,4 @@
 | 
			
		|||
{{ template "base.html" . }}
 | 
			
		||||
{{ template "base-2024.html" . }}
 | 
			
		||||
 | 
			
		||||
{{ define "extrahead" }}
 | 
			
		||||
	{{ template "markdown_previews.html" .TextEditor }}
 | 
			
		||||
| 
						 | 
				
			
			@ -22,22 +22,71 @@
 | 
			
		|||
{{ end }}
 | 
			
		||||
 | 
			
		||||
{{ define "content" }}
 | 
			
		||||
	<div class="ph3 ph0-ns">
 | 
			
		||||
		{{ if .Editing }}
 | 
			
		||||
			<h1>Edit {{ .ProjectSettings.Name }}</h1>
 | 
			
		||||
		{{ else }}
 | 
			
		||||
			<h1>Create a new {{ if .ProjectSettings.JamParticipation }}jam {{ end }}project</h1>
 | 
			
		||||
		{{ end }}
 | 
			
		||||
		<form id="project_form" class="tabbed edit-form" method="POST" enctype="multipart/form-data">
 | 
			
		||||
	<div class="pa3">
 | 
			
		||||
		<div class="flex g3">
 | 
			
		||||
			<form id="project_form" class="edit-form bg--card pa3 flex-fair" method="POST" enctype="multipart/form-data">
 | 
			
		||||
				{{ csrftoken .Session }}
 | 
			
		||||
			<div class="tab" data-name="General" data-slug="general">
 | 
			
		||||
 | 
			
		||||
				<h1 class="f4">
 | 
			
		||||
					{{ if .Editing }}
 | 
			
		||||
						Edit {{ .ProjectSettings.Name }}
 | 
			
		||||
					{{ else }}
 | 
			
		||||
						Create a {{ if .ProjectSettings.JamParticipation }}jam {{ end }}project
 | 
			
		||||
					{{ end }}
 | 
			
		||||
				</h1>
 | 
			
		||||
 | 
			
		||||
				<hr>
 | 
			
		||||
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Project name:</div>
 | 
			
		||||
					<div class="pt-input-ns">Project title:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<input required type="text" name="project_name" maxlength="255" class="textbox" value="{{ .ProjectSettings.Name }}">
 | 
			
		||||
						<span class="note">* Required</span>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Short description:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea id="description" required maxlength="140" name="shortdesc">
 | 
			
		||||
							{{- .ProjectSettings.Blurb -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="c--dim f7">Plaintext only. No links or markdown.</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Long description:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea id="full_description" class="w-100 h5 minh-5 mono lh-copy" name="full_description">
 | 
			
		||||
							{{- .ProjectSettings.Description -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="flex justify-end items-center mt2">
 | 
			
		||||
							<div class="upload_bar flex-grow-1">
 | 
			
		||||
								<div class="instructions">
 | 
			
		||||
									Upload files by dragging & dropping, pasting, or <label class="pointer link" for="file_input">selecting</label> them.
 | 
			
		||||
								</div>
 | 
			
		||||
								<div class="progress flex">
 | 
			
		||||
									<div class="progress_text mr3"></div>
 | 
			
		||||
									<div class="progress_bar flex-grow-1 flex-shrink-1 pa1"><div class=""></div></div>
 | 
			
		||||
								</div>
 | 
			
		||||
							</div>
 | 
			
		||||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div>Light theme logo:</div>
 | 
			
		||||
					<div class="light_logo">
 | 
			
		||||
						{{ template "image_selector.html" imageselectordata "light_logo" .ProjectSettings.LightLogo false }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div>Dark theme logo:</div>
 | 
			
		||||
					<div class="dark_logo">
 | 
			
		||||
						{{ template "image_selector.html" imageselectordata "dark_logo" .ProjectSettings.DarkLogo false }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
 | 
			
		||||
				<hr>
 | 
			
		||||
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Status:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
| 
						 | 
				
			
			@ -100,10 +149,22 @@
 | 
			
		|||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				{{ end }}
 | 
			
		||||
				{{ if and .Editing .User.IsStaff }}
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
						<div class="pt-input-ns">Admin settings</div>
 | 
			
		||||
					<div class="pt-input-ns">Project links:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea class="links" name="links" id="links" maxlength="2048" data-max-chars="2048">
 | 
			
		||||
							{{- .ProjectSettings.LinksText -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="c--dim f7">
 | 
			
		||||
							<div>Relevant links to put on the project page.</div>
 | 
			
		||||
							<div>Format: url [Title] (e.g. <code>http://example.com/ Example Site</code>)</div>
 | 
			
		||||
							<div>(1 per line, 10 max)</div>
 | 
			
		||||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
 | 
			
		||||
				{{ if and .Editing .User.IsStaff }}
 | 
			
		||||
					<hr>
 | 
			
		||||
					<div class="edit-form-row">
 | 
			
		||||
						<div>Official:</div>
 | 
			
		||||
						<div>
 | 
			
		||||
| 
						 | 
				
			
			@ -135,85 +196,7 @@
 | 
			
		|||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				{{ end }}
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div></div>
 | 
			
		||||
					<div>
 | 
			
		||||
						{{ if .Editing }}
 | 
			
		||||
							<input type="submit" value="Save" />
 | 
			
		||||
						{{ else }}
 | 
			
		||||
							<a class="button submit" href="javascript:;" onclick="gotoTab('description');">Next</a>
 | 
			
		||||
						{{ end }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
			<div class="tab" data-name="Description" data-slug="description">
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Short description:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea id="description" required maxlength="140" name="shortdesc">
 | 
			
		||||
							{{- .ProjectSettings.Blurb -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="c--dim f7">Plaintext only. No links or markdown.</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Project links:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea class="links" name="links" id="links" maxlength="2048" data-max-chars="2048">
 | 
			
		||||
							{{- .ProjectSettings.LinksText -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="c--dim f7">
 | 
			
		||||
							<div>Relevant links to put on the project page.</div>
 | 
			
		||||
							<div>Format: url [Title] (e.g. <code>http://example.com/ Example Site</code>)</div>
 | 
			
		||||
							<div>(1 per line, 10 max)</div>
 | 
			
		||||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div class="pt-input-ns">Full description:</div>
 | 
			
		||||
					<div>
 | 
			
		||||
						<textarea id="full_description" class="w-100 h5 minh-5 mono lh-copy" name="full_description">
 | 
			
		||||
							{{- .ProjectSettings.Description -}}
 | 
			
		||||
						</textarea>
 | 
			
		||||
						<div class="flex justify-end items-center mt2">
 | 
			
		||||
							<div class="upload_bar flex-grow-1">
 | 
			
		||||
								<div class="instructions">
 | 
			
		||||
									Upload files by dragging & dropping, pasting, or <label class="pointer link" for="file_input">selecting</label> them.
 | 
			
		||||
								</div>
 | 
			
		||||
								<div class="progress flex">
 | 
			
		||||
									<div class="progress_text mr3"></div>
 | 
			
		||||
									<div class="progress_bar flex-grow-1 flex-shrink-1 pa1"><div class=""></div></div>
 | 
			
		||||
								</div>
 | 
			
		||||
							</div>
 | 
			
		||||
						</div>
 | 
			
		||||
						<div class="b mt3 mb2">Preview:</div>
 | 
			
		||||
						<div id="desc-preview" class="w-100"></div>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div></div>
 | 
			
		||||
					<div>
 | 
			
		||||
						{{ if .Editing }}
 | 
			
		||||
							<input type="submit" value="Save" />
 | 
			
		||||
						{{ else }}
 | 
			
		||||
							<a class="button submit" href="javascript:;" onclick="gotoTab('assets');">Next</a>
 | 
			
		||||
						{{ end }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
			<div class="tab" data-name="Assets" data-slug="assets">
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div>Light theme logo:</div>
 | 
			
		||||
					<div class="light_logo">
 | 
			
		||||
						{{ template "image_selector.html" imageselectordata "light_logo" .ProjectSettings.LightLogo false }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div>Dark theme logo:</div>
 | 
			
		||||
					<div class="dark_logo">
 | 
			
		||||
						{{ template "image_selector.html" imageselectordata "dark_logo" .ProjectSettings.DarkLogo false }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
 | 
			
		||||
				<div class="edit-form-row">
 | 
			
		||||
					<div></div>
 | 
			
		||||
					<div>
 | 
			
		||||
| 
						 | 
				
			
			@ -224,10 +207,15 @@
 | 
			
		|||
						{{ end }}
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
			</form>
 | 
			
		||||
		<input type="file" multiple name="file_input" id="file_input" class="dn" />{{/* NOTE(mark): copied NOTE(asaf): Placing this outside the form to avoid submitting it to the server by accident */}}
 | 
			
		||||
			<div class="bl b--dimmest"></div>
 | 
			
		||||
			<div class="flex-fair">
 | 
			
		||||
				<div id="desc-preview" class="w-100"></div>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
	</div>
 | 
			
		||||
	<input type="file" multiple name="file_input" id="file_input" class="dn" />{{/* NOTE(mark): copied NOTE(asaf): Placing this outside the form to avoid submitting it to the server by accident */}}
 | 
			
		||||
	
 | 
			
		||||
	<script>
 | 
			
		||||
	let csrf = JSON.parse({{ csrftokenjs .Session }});
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Reference in New Issue