X-Git-Url: https://jasonwoof.com/gitweb/?p=wfpl-cms.git;a=blobdiff_plain;f=admin_pages.html;h=f47aac2b3282d054af62cdf29afebdc73d9ddf6f;hp=4b2b1b36baf80747840fb5e91a88040097359a22;hb=3b9b94e5e746542e8bacec485df87a265e7daeda;hpb=28ee7e23561dfd8eaef88eac5333df84f08ec214

diff --git a/admin_pages.html b/admin_pages.html
index 4b2b1b3..f47aac2 100644
--- a/admin_pages.html
+++ b/admin_pages.html
@@ -2,13 +2,13 @@
 
 <html>
 <head>
-	<title><!--~$title show {~-->~$host~ Admin: <!--~listings {~-->Pages Listing<!--~}~--><!--~form {~--><!--~id {~-->Add a new page<!--~}~--><!--~id unset {~-->Edit page "~title html~"<!--~}~--><!--~}~--><!--~}~--></title>
+	<title><!--~$title show {~-->~$host~ Admin: <!--~listings once_if {~-->Pages Listing<!--~}~--><!--~form {~--><!--~id {~-->Add a new page<!--~}~--><!--~id unset {~-->Edit page "~title html~"<!--~}~--><!--~}~--><!--~}~--></title>
 	<!--~$head {~-->
-	<script type="text/javascript" src="code/ckeditor/ckeditor.js"></script>
+	<script src="inc/ckeditor/ckeditor.js"></script>
 	<style>
 		/* icon in cke buttons */
 		.cke_button_icon.cke_button__wfpl_images_icon {
-			background-image: url(/code/ckeditor/plugins/icons.png?t=D5AC);
+			background-image: url(/inc/ckeditor/plugins/icons.png?t=D5AC);
 			background-position: 0 -1504px;
 		}
 		.cke_wfpl_images_dialog * {
@@ -29,6 +29,10 @@
 		.cke_wfpl_images_dialog * + p {
 			padding-top: 5px;
 		}
+		.cke_wfpl_images_dialog * a {
+			text-decoration: underline;
+			color: blue;
+		}
 		.cke_wfpl_images_dialog .cke_wfpl_thumbs {
 			height: 270px;
 			overflow-y: scroll;
@@ -55,19 +59,18 @@
 			border: 2px solid #444;
 		}
 	</style>
-	<script type="text/javascript">
+	<script>
 		window.cke_wfpl_images = {
-			images: {~wfpl_images {~
-				"~id~": {
+			images: [~wfpl_images {~
+				{
 					thumb: "~image thumb_src jsdq~",
 					image: "~image image_src jsdq~",
 					image_width: "~image image_width~",
 					image_height: "~image image_height~",
 					sizes: "~sizes jsdq~",
 					caption: "~caption jsdq~"
-				}
-				~ sep {~,~}~
-			~}~},
+				}~ sep {~,~}~~}~
+			],
 			next_id: 0,
 			selected: [],
 			editors: []
@@ -95,7 +98,7 @@
 			var image;
 			var code, width, height, src, size, caption;
 			if (selected == null) {
-				console.log("no selected picture"); // FIXME
+				CKEDITOR.dialog.getCurrent().hide();
 				return;
 			}
 			image = window.cke_wfpl_images.images[selected];
@@ -144,36 +147,28 @@
 					code += '</div>'
 				break;
 			}
-			CKEDITOR.dialog.getCurrent().hide(); // FIXME
-			console.log(code);
-			editor.insertHtml(code);
+			CKEDITOR.dialog.getCurrent().hide();
+			editor.insertElement(CKEDITOR.dom.element.createFromHtml(code));
 		}
 		CKEDITOR.plugins.add('wfpl_images', {
 			init: function (editor) {
 				var plugin_id = window.cke_wfpl_images.editors.length;
 				window.cke_wfpl_images.editors.push(editor);
-				window.cke_wfpl_images.selected.push(null);
+				window.cke_wfpl_images.selected.push(window.cke_wfpl_images.images.length > 0 ? 0 : null);
 
 				editor.addCommand('wfpl_images', new CKEDITOR.dialogCommand('wfpl_images_dialog'));
 				editor.ui.addButton('wfpl_images', {
 					label: 'Insert Image',
 					command: 'wfpl_images',
-					toolbar: 'insert' /* which section to put this button in */
+					toolbar: 'insert'
 				});
 				CKEDITOR.dialog.add('wfpl_images_dialog', function (api) {
-					// CKEDITOR.dialog.definition
 					return {
 						title: 'Insert Image',
 						minWidth: 700,
 						minHeight: 350,
-						onShow: function() {
-							// FIXME unselect and remove hilight
-							// window.cke_wfpl_images.selected[plugin_id] = null;
-						},
 						contents: [
 							{
-								id: 'tab1',
-								label: '?not displayed',
 								expand: true,
 								padding: 0,
 								elements: [
@@ -181,9 +176,9 @@
 										type: 'html',
 										html: '<div class="cke_wfpl_images_dialog">'
 											+ '<h3>Step 1: Choose an image to insert:</h3>'
-											+ "<div class=\"cke_wfpl_thumbs\">~wfpl_images {~ <div class=\"cke_wfpl_thumb\" onclick=\"return window.cke_wfpl_images_thumb_click("+plugin_id+", this, ~id~)\" style=\"background-image: url(~image thumb_src attr jsdq~)\">~caption empty {~~name html jsdq~~}~~caption nonempty {~~caption html jsdq~~}~</div>~}~</div>"
-										+ "</div>"
-										+ '<p style="white-space: normal">If you\'d like to insert an image not shown above, you can <a style="color: blue; text-decoration: underline" href="admin_images?new=1" target="_blank">upload it here</a>. Sorry, it won\'t appear here until you reload this editor page (hit Save below, then "edit this page" again.)</p>'
+											+ "<div class=\"cke_wfpl_thumbs\">~wfpl_images {~ <div class=\"~ first {~selected ~}~cke_wfpl_thumb\" onclick=\"return window.cke_wfpl_images_thumb_click("+plugin_id+", this, ~id~)\" style=\"background-image: url(~image thumb_src attr jsdq~)\">~caption empty {~~name html jsdq~~}~~caption nonempty {~~caption html jsdq~~}~</div>~}~</div>"
+										+ '<p>If you\'d like to insert an image not shown above, you can <a href="admin_images?new=1" target="_blank">upload it here</a>. Sorry, it won\'t appear here until you reload this editor page (hit Save below, then "edit this page" again.)</p>'
+										+ '</div>'
 									}
 								]
 							}
@@ -191,7 +186,6 @@
 						buttons: [
 							{
 								type: 'button',
-								id: 'left',
 								label: 'Insert on Left',
 								className: 'cke_dialog_ui_button_ok',
 								onClick: function() {
@@ -200,7 +194,6 @@
 							},
 							{
 								type: 'button',
-								id: 'center',
 								label: 'Insert Centered',
 								className: 'cke_dialog_ui_button_ok',
 								onClick: function() {
@@ -209,7 +202,6 @@
 							},
 							{
 								type: 'button',
-								id: 'right',
 								label: 'Insert on Right',
 								className: 'cke_dialog_ui_button_ok',
 								onClick: function() {
@@ -218,7 +210,6 @@
 							},
 							{
 								type: 'button',
-								id: 'full',
 								label: 'Insert BIG',
 								className: 'cke_dialog_ui_button_ok',
 								onClick: function() {
@@ -226,14 +217,7 @@
 								}
 							},
 							CKEDITOR.dialog.cancelButton
-						],
-						onOk: function () {
-							var image = this.getContentElement('tab1', 'image').getValue();
-							if (image === null) {
-								return;
-							}
-							editor.insertHtml('<img alt="" src="' + window.wfpl_images[image].image + '">');
-						}
+						]
 					};
 				});
 			}
@@ -241,6 +225,7 @@
 		function make_wysiwyg(name) {
 			CKEDITOR.replace(name, {
 				'contentsCss': 'style.css?m=~style.css mtime~',
+				bodyId: '~$basename~' + '-wysiwyg-' + name,
 				'allowedContent': true,
 				'stylesSet': [
 					{ name: 'Paragraph', element: 'p'},
@@ -287,7 +272,7 @@
 
 			<div class="caption">Title</div>
 			<div class="field_notes">(This appears at the top of the page, in the window title-bar (by the close button) and as the headline/link of search engine results.)</div>
-			<div class="field"><input type="text" name="title" value="~title attr~"></div>
+			<div class="field"><input type="text" name="title" value="~title attr~" class="wide_field"></div>
 
 			<div class="caption">Filename</div>
 			<div class="field_notes">(<!--~editing {~-->Careful: if you change this, be sure to update all links to this page<!--~}~--><!--~editing unset {~-->Please use only a-z, 0-9 and _ (underscore) in your filename. Please, no capitals, punctuation or spaces.<!--~}~-->)</div>
@@ -308,9 +293,10 @@
 					<li>If you don't see an editor below (with buttons in it) then please try this page in <a href="http://getfirefox.com">Mozilla FireFox</a> or <a href="http://www.google.com/chrome/">Google Chrome</a>.</li>
 					<li>If you're pasting from Microsoft Word, please use the "paste from word" button (looks like a clipboard with a "W").</li>
 					<li>To make a link, type the text to be clicked, select it, click the "Link" button (looks like a short chain) and paste the web address (where the link should point to) into the "URL" field. Exception: If you're making a link to another page on this site, please remove the "http://~$host~/" from the beginning of the "URL" field and set the "Protocol" to &lt;other&gt;.</li>
+					<li>To insert an image: place the cursor at the beginning of a line and click the "insert image" button in the editor. Note that you will only be able to insert images that you have already uploaded on the <a href="admin_images" target="_blank">manage images</a> page.</li>
 				</ul>
 			</div>
-			<div class="field"><textarea class="html_editor" rows="20" cols="50" id="content" name="content">~content html~</textarea><script type="text/javascript">make_wysiwyg('content');</script></div>
+			<div class="field"><textarea class="html_editor" rows="20" cols="50" id="content" name="content">~content html~</textarea><script>make_wysiwyg('content');</script></div>
 
 			<div class="caption">Description</div>
 			<div class="field_notes">(Hidden description of this page, primarily for search engines.)</div>
@@ -333,7 +319,7 @@
 		<!--~listings once_if {~-->
 			<p><a href="admin_pages?new=1">[Add a new page]</a></p>
 
-			<table cellspacing="0" cellpadding="4" border="1" summary="">
+			<table cellspacing="0" cellpadding="4" border="0" summary="" class="evenodd">
 				<tr><th>Title</th><th>Filename</th><th>&nbsp;</th></tr>
 				<!--~listings {~-->
 				<tr>
