Sidebar blocks of Article editor can be expanded/collapsed.

6 files changed, 65 insertions, 25 deletions

diff --git a/ratatoeskr/cms_style/images/expandarrow_collapsed.png b/ratatoeskr/cms_style/images/expandarrow_collapsed.png
new file mode 100644
index 0000000..62f662b
--- /dev/null
+++ b/ratatoeskr/cms_style/images/expandarrow_collapsed.png
diff --git a/ratatoeskr/cms_style/images/expandarrow_expanded.png b/ratatoeskr/cms_style/images/expandarrow_expanded.png
new file mode 100644
index 0000000..a5e4c41
--- /dev/null
+++ b/ratatoeskr/cms_style/images/expandarrow_expanded.png
diff --git a/ratatoeskr/cms_style/layout.css b/ratatoeskr/cms_style/layout.css
index 1163887..a88537d 100644
--- a/ratatoeskr/cms_style/layout.css
+++ b/ratatoeskr/cms_style/layout.css
@@ -257,3 +257,15 @@ ul.bulletfree {
 	list-style: none;
 	padding-left: 0mm;
 }
+
+.metabar_element_expanded {
+	min-height: 12px;
+	background: url(images/expandarrow_expanded.png) 0px 4px no-repeat;
+	padding-left: 12px;
+}
+
+.metabar_element_collapsed {
+	min-height: 12px;
+	background: url(images/expandarrow_collapsed.png) 0px 4px no-repeat;
+	padding-left: 12px;
+}
\ No newline at end of file
diff --git a/ratatoeskr/js/backend.js b/ratatoeskr/js/backend.js
new file mode 100644
index 0000000..d131bfe
--- /dev/null
+++ b/ratatoeskr/js/backend.js
@@ -0,0 +1,19 @@
+$(function()
+{
+	$("div.articleeditor-metabar-element h2").addClass("metabar_element_expanded").click(function()
+	{
+		self = $(this);
+		if(self.hasClass("metabar_element_expanded"))
+		{
+			self.removeClass("metabar_element_expanded");
+			self.addClass("metabar_element_collapsed");
+			$("div.articleeditor-metabar-element-content", self.parent()).hide("fast");
+		}
+		else
+		{
+			self.removeClass("metabar_element_collapsed");
+			self.addClass("metabar_element_expanded");
+			$("div.articleeditor-metabar-element-content", self.parent()).show("fast");
+		}
+	});
+});
\ No newline at end of file
diff --git a/ratatoeskr/templates/src/systemtemplates/content_write.html b/ratatoeskr/templates/src/systemtemplates/content_write.html
index 3d63c61..08d6ec1 100644
--- a/ratatoeskr/templates/src/systemtemplates/content_write.html
+++ b/ratatoeskr/templates/src/systemtemplates/content_write.html
@@ -26,33 +26,40 @@
 		</div>
 		
 		<div class="column_right">
-			<h2><ste:get_translation for="settings_meta" /></h2>
-			
-			<p><ste:get_translation for="urlname" />: <input type="text" name="urlname" value="<ste:escape>$urlname</ste:escape>" class="fullwidth" /></p>
-			<p>
-				<ste:get_translation for="article_section" />:
-				<select name="section" class="fullwidth">
-					<ste:foreach array="sections" value="section_name">
-						<option value="<ste:escape>$section_name</ste:escape>"?{~{$section_name|eq|$article_section}| selected="selected"|}><ste:escape>$section_name</ste:escape></option>
-					</ste:foreach>
-				</select>
-			</p>
-			<p><ste:get_translation for="tags_cs" />: <input type="text" name="tags" value="<ste:escape>$tags</ste:escape>" class="fullwidth" /></p>
-			<p><ste:get_translation for="date_time" />:<br />(YYYY-MM-DD HH:MM:SS) <input type="text" name="date"?{$date| value="<ste:date timestamp='$date'>%Y-%m-%d %H:%M:%S</ste:date>"|} class="fullwidth" /></p>
-			<p>
-				<ste:get_translation for="article_status" />:
-				<ste:set var="article_status">?{$article_status|$article_status|1}</ste:set>
-				<select name="article_status" class="fullwidth">
-					<option value="0"?{~{$article_status|eq|0}| selected="selected"|}><ste:get_translation for="article_status_hidden" /></option>
-					<option value="1"?{~{$article_status|eq|1}| selected="selected"|}><ste:get_translation for="article_status_live" /></option>
-					<option value="2"?{~{$article_status|eq|2}| selected="selected"|}><ste:get_translation for="article_status_sticky" /></option>
-				</select>
-			</p>
-			<p><ste:get_translation for="allow_comments" />: <input type="checkbox" name="allow_comments" value="yes" ?{$allow_comments|checked="checked" |}/></p>
+			<div class="articleeditor-metabar-element">
+				<h2><ste:get_translation for="settings_meta" /></h2>
+				<div class="articleeditor-metabar-element-content">
+					<p><ste:get_translation for="urlname" />: <input type="text" name="urlname" value="<ste:escape>$urlname</ste:escape>" class="fullwidth" /></p>
+					<p>
+						<ste:get_translation for="article_section" />:
+						<select name="section" class="fullwidth">
+							<ste:foreach array="sections" value="section_name">
+								<option value="<ste:escape>$section_name</ste:escape>"?{~{$section_name|eq|$article_section}| selected="selected"|}><ste:escape>$section_name</ste:escape></option>
+							</ste:foreach>
+						</select>
+					</p>
+					<p><ste:get_translation for="tags_cs" />: <input type="text" name="tags" value="<ste:escape>$tags</ste:escape>" class="fullwidth" /></p>
+					<p><ste:get_translation for="date_time" />:<br />(YYYY-MM-DD HH:MM:SS) <input type="text" name="date"?{$date| value="<ste:date timestamp='$date'>%Y-%m-%d %H:%M:%S</ste:date>"|} class="fullwidth" /></p>
+					<p>
+						<ste:get_translation for="article_status" />:
+						<ste:set var="article_status">?{$article_status|$article_status|1}</ste:set>
+						<select name="article_status" class="fullwidth">
+							<option value="0"?{~{$article_status|eq|0}| selected="selected"|}><ste:get_translation for="article_status_hidden" /></option>
+							<option value="1"?{~{$article_status|eq|1}| selected="selected"|}><ste:get_translation for="article_status_live" /></option>
+							<option value="2"?{~{$article_status|eq|2}| selected="selected"|}><ste:get_translation for="article_status_sticky" /></option>
+						</select>
+					</p>
+					<p><ste:get_translation for="allow_comments" />: <input type="checkbox" name="allow_comments" value="yes" ?{$allow_comments|checked="checked" |}/></p>
+				</div>
+			</div>
 			
 			<ste:foreach array="displayed_plugins" value="plugin">
-				<h2><ste:escape>$plugin[label]</ste:escape></h2>
-				<ste:load name="$plugin[template]" />
+				<div class="articleeditor-metabar-element">
+					<h2><ste:escape>$plugin[label]</ste:escape></h2>
+					<div class="articleeditor-metabar-element-content">
+						<ste:load name="$plugin[template]" />
+					</div>
+				</div>
 			</ste:foreach>
 		</div>
 		
diff --git a/ratatoeskr/templates/src/systemtemplates/master.html b/ratatoeskr/templates/src/systemtemplates/master.html
index ddf6d08..406bab6 100755
--- a/ratatoeskr/templates/src/systemtemplates/master.html
+++ b/ratatoeskr/templates/src/systemtemplates/master.html
@@ -25,6 +25,8 @@
 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 	<meta http-equiv="Content-Style-Type" content="text/css" />
 	<title><ste:get_translation for="section_$section" />::<ste:escape>$pagetitle</ste:escape> - Ratatöskr</title>
+	<script type="text/javascript" src="$rel_path_to_root/ratatoeskr/libs/jquery.min.js"></script>
+	<script type="text/javascript" src="$rel_path_to_root/ratatoeskr/js/backend.js"></script>
 	<ste:mktag name="cms_style"><link rel="stylesheet" type="text/css" media="screen" href="$rel_path_to_root/ratatoeskr/cms_style/<ste:tagcontent />" /></ste:mktag>
 	<ste:cms_style>layout.css</ste:cms_style>
 	<ste:foreach array="additional_styles" value="cssfile"><ste:cms_style>$cssfile</ste:cms_style></ste:foreach>