Menu
▾
▴
[Sciret-svn] SF.net SVN: sciret:[627] trunk
|
From: <al...@us...> - 2008-08-24 19:16:00
|
Revision: 627
http://sciret.svn.sourceforge.net/sciret/?rev=627&view=rev
Author: alpeb
Date: 2008-08-24 19:15:56 +0000 (Sun, 24 Aug 2008)
Log Message:
-----------
replaced fck editor with yui RTE
Modified Paths:
--------------
trunk/flowMap.php
trunk/javascript/general.js
trunk/style.css
trunk/views/EditArticle.php
Added Paths:
-----------
trunk/images/html_editor.gif
Modified: trunk/flowMap.php
===================================================================
--- trunk/flowMap.php 2008-08-24 19:14:05 UTC (rev 626)
+++ trunk/flowMap.php 2008-08-24 19:15:56 UTC (rev 627)
@@ -52,6 +52,7 @@
'SaveArticle' => array(User::ROLE_REGISTERED, true),
'SaveBookmark' => array(User::ROLE_REGISTERED, true),
'UploadFile' => array(User::ROLE_REGISTERED, true),
+ 'UploadImage' => array(User::ROLE_REGISTERED, true),
'GetFile' => array(User::ROLE_ANONYMOUS, true, true),
'DeleteFile' => array(User::ROLE_REGISTERED, true),
'AddLink' => array(User::ROLE_REGISTERED, true),
Property changes on: trunk/images/html_editor.gif
___________________________________________________________________
Added: svn:mime-type
+ application/octet-stream
Modified: trunk/javascript/general.js
===================================================================
--- trunk/javascript/general.js 2008-08-24 19:14:05 UTC (rev 626)
+++ trunk/javascript/general.js 2008-08-24 19:15:56 UTC (rev 627)
@@ -7,6 +7,15 @@
* @packager TheGang
*/
+/**
+ * Classes enforce private and public members through the Module Pattern
+ * (the vars outside are private, and what goes inside the return is public)
+ * @see http://yuiblog.com/blog/2007/06/12/module-pattern/
+ */
+
+YAHOO.namespace("sciret");
+SCIRET = YAHOO.sciret;
+
// *********************************************************
// ** BROWSER DETECTION **
// *********************************************************
@@ -482,7 +491,219 @@
}
}
+/**
+ * Rich-text editor
+ */
+SCIRET.editor = function() {
+ var myEditor;
+ var state = 'off';
+ var resize = null;
+ /*
+ yuiImgUploader
+
+ Taken from http://allmybrain.com/2007/10/16/an-image-upload-extension-for-yui-rich-text-editor
+
+ variables:
+ rte: The YAHOO.widget.Editor instance
+ upload_url: the url to post the file to
+ upload_image_name: the name of the post parameter to send the file as
+
+ Your server must handle the posted image. You must return a JSON object
+ with the result url that the image can be viewed at on your server. If
+ the upload fails, you can return an error message. For successful
+ uploads, the status must be set to UPLOADED. All other status messages,
+ or the lack of a status message is interpreted as an error. IE will
+ try to open a new document window when the response is returned if your
+ content-type header on your response is not set to 'text/javascript'
+
+ Example Success:
+ {status:'UPLOADED', image_url:'/somedirectory/filename'}
+ Example Failure:
+ {status:'We only allow JPEG Images.'}
+
+ */
+ var yuiImgUploader = function(rte, upload_url, upload_image_name) {
+ // customize the editor img button
+
+ YAHOO.log( "Adding Click Listener" ,'debug');
+ rte.addListener('toolbarLoaded',function() {
+ rte.toolbar.addListener ( 'insertimageClick', function(o) {
+ try {
+ var imgPanel=new YAHOO.util.Element('yui-editor-panel');
+ imgPanel.on ( 'contentReady', function() {
+ try {
+ var Dom=YAHOO.util.Dom;
+ var label=document.createElement('label');
+ label.innerHTML='<strong>Upload:</strong>'+
+ '<input type="file" id="insertimage_upload" name="'+upload_image_name+
+ '" size="10" style="width: 20%" />'+
+ '<a href="#" id="insertimage_upload_btn" style="width: 20%; margin-left: 10em;">Upload Image</a>'+
+ '</label>';
+
+ var img_elem=Dom.get('insertimage_url');
+ Dom.getAncestorByTagName(img_elem, 'form').encoding = 'multipart/form-data';
+
+ Dom.insertAfter(
+ label,
+ img_elem.parentNode);
+
+ YAHOO.util.Event.on ( 'insertimage_upload_btn', 'click', function(ev) {
+ // //alert ( "Upload Click" );
+ YAHOO.util.Event.stopEvent(ev); // no default click action
+ YAHOO.util.Connect.setForm ( img_elem.form, true, true );
+ var c=YAHOO.util.Connect.asyncRequest(
+ 'POST', upload_url, {
+ upload:function(r){
+ try {
+ // strip pre tags if they got added somehow
+ resp=r.responseText.replace( /<pre>/i, '').replace ( /<\/pre>/i, '');
+ var o=eval('('+resp+')');
+ if (o.status=='UPLOADED') {
+ Dom.get('insertimage_upload').value='';
+ Dom.get('insertimage_url').value=o.image_url;
+ // tell the image panel the url changed
+ // hack instead of fireEvent('blur')
+ // which for some reason isn't working
+ Dom.get('insertimage_url').focus();
+ Dom.get('insertimage_upload').focus();
+ } else {
+ alert ( "Upload Failed: "+o.status );
+ }
+
+ } catch ( eee ) {
+ YAHOO.log( eee.message, 'error' )
+ }
+ }
+ }
+ );
+ return false;
+ });
+
+ } catch ( ee ) { YAHOO.log( ee.message, 'error' ) }
+ });
+ } catch ( e ) {
+ YAHOO.log( e.message, 'error' )
+ }
+ });
+ });
+
+ }
+
+ return {
+
+ init: function(width, height, element) {
+ YAHOO.log('Create the Editor..', 'info', 'example');
+ myEditor = new YAHOO.widget.Editor(element, {
+ width: width,
+ height: height,
+ dompath: true, //Turns on the bar at the bottom
+ animate: true, //Animates the opening, closing and moving of Editor windows
+ handleSubmit: true
+ });
+
+ myEditor.on('toolbarLoaded', function() {
+ this.toolbar.addButtonGroup({
+ group: 'editcodeGroup',
+ label: ' ',
+ buttons: [
+ {
+ type: 'separator'
+ },
+ {
+ type: 'push',
+ label: 'Edit HTML Code',
+ value: 'editcode'
+ }]
+ });
+
+ this.toolbar.on('editcodeClick', function() {
+ var ta = this.get('element');
+ var iframe = this.get('iframe').get('element');
+
+ if (state == 'on') {
+ state = 'off';
+ this.toolbar.set('disabled', false);
+ YAHOO.log('Inject the HTML from the textarea into the editor', 'info', 'example');
+ this.setEditorHTML(ta.value);
+ if (!this.browser.ie) {
+ this._setDesignMode('on');
+ }
+
+ YAHOO.util.Dom.removeClass(iframe, 'editor-hidden');
+ YAHOO.util.Dom.addClass(ta, 'editor-hidden');
+ this.show();
+ this._focusWindow();
+ } else {
+ state = 'on';
+ YAHOO.log('Show the Code Editor', 'info', 'example');
+ this.cleanHTML();
+ YAHOO.log('Save the Editors HTML', 'info', 'example');
+ YAHOO.util.Dom.addClass(iframe, 'editor-hidden');
+ YAHOO.util.Dom.removeClass(ta, 'editor-hidden');
+ this.toolbar.set('disabled', true);
+ this.toolbar.getButtonByValue('editcode').set('disabled', false);
+ this.toolbar.selectButton('editcode');
+ this.dompath.innerHTML = 'Editing HTML Code';
+ this.hide();
+ }
+ return false;
+ }, this, true);
+
+ this.on('cleanHTML', function(ev) {
+ YAHOO.log('cleanHTML callback fired..', 'info', 'example');
+ this.get('element').value = ev.html;
+ }, this, true);
+
+ this.on('afterRender', function() {
+ var wrapper = this.get('editor_wrapper');
+ wrapper.appendChild(this.get('element'));
+ this.setStyle('width', '100%');
+ this.setStyle('height', '100%');
+ this.setStyle('visibility', '');
+ this.setStyle('top', '');
+ this.setStyle('left', '');
+ this.setStyle('position', '');
+
+ this.addClass('editor-hidden');
+ }, this, true);
+
+ }, myEditor, true);
+
+ myEditor.on('editorContentLoaded', function() {
+ resize = new YAHOO.util.Resize(myEditor.get('element_cont').get('element'), {
+ handles: ['br'],
+ autoRatio: true,
+ status: true,
+ proxy: true,
+ setSize: false
+ });
+
+ resize.on('startResize', function() {
+ this.hide();
+ this.set('disabled', true);
+ }, myEditor, true);
+
+ resize.on('resize', function(args) {
+ var h = args.height;
+ var th = (this.toolbar.get('element').clientHeight + 2); // it has a 1px border
+ var dh = (this.dompath.clientHeight + 1); // it has a 1px top border
+ var newH = (h - th - dh);
+ this.set('width', args.width + 'px');
+ this.set('height', newH + 'px');
+ this.set('disabled', false);
+ this.show();
+ }, myEditor, true);
+ });
+
+ myEditor._defaultToolbar.titlebar = false;
+ yuiImgUploader(myEditor, 'index.php?action=UploadImage', 'image');
+ myEditor.render();
+ }
+ }
+}();
+
+
// *********************************************************
// ** OTHER FUNCTIONS **
// *********************************************************
Modified: trunk/style.css
===================================================================
--- trunk/style.css 2008-08-24 19:14:05 UTC (rev 626)
+++ trunk/style.css 2008-08-24 19:15:56 UTC (rev 627)
@@ -168,3 +168,57 @@
width :100%;
padding :5px;
}
+
+/* -------- YUI RTE ---------- */
+
+.yui-skin-sam .yui-toolbar-container .yui-toolbar-editcode span.yui-toolbar-icon {
+ background-image: url( images/html_editor.gif );
+ background-position: 0 1px;
+ left: 5px;
+}
+.yui-skin-sam .yui-toolbar-container .yui-button-editcode-selected span.yui-toolbar-icon {
+ background-image: url( images/html_editor.gif );
+ background-position: 0 1px;
+ left: 5px;
+}
+
+/* this is to add a line break in the toolbar */
+.yui-skin-sam .yui-toolbar-container .yui-toolbar-classname {
+ width:130px;
+}
+.yui-skin-sam .yui-toolbar-container .yui-toolbar-separator-6 {
+ clear: left;
+ padding: 0;
+ margin: 0;
+ *float: none;
+ _width: 0;
+ _font-size: 0;
+}
+.yui-toolbar-container.yui-toolbar-grouped span.yui-toolbar-separator-6 {
+ *height: 0;
+}
+
+/* The ID of the editor's container and the bottom right resize handle. */
+#editor_container .yui-resize-handle-br {
+ /* Make the handle a little bigger than the default */
+ height: 11px;
+ width: 11px;
+ /* Resposition the image */
+ background-position: -20px -60px;
+ /* Kill the hover on the handle */
+ background-color: transparent;
+}
+
+.editor-hidden {
+ visibility: hidden;
+ top: -9999px;
+ left: -9999px;
+ position: absolute;
+}
+
+textarea {
+ border: 0;
+ margin: 0;
+ padding: 0;
+}
+
Modified: trunk/views/EditArticle.php
===================================================================
--- trunk/views/EditArticle.php 2008-08-24 19:14:05 UTC (rev 626)
+++ trunk/views/EditArticle.php 2008-08-24 19:15:56 UTC (rev 627)
@@ -11,7 +11,6 @@
require 'views/View.php';
require 'models/CategoryGateway.php';
-require 'fckeditor/fckeditor.php';
class EditArticle extends View {
@@ -113,11 +112,7 @@
$this->_parseCategoriesDropdown($category, 0, $selectedCategory);
}
- $ofckeditor = new fckeditor('content') ;
- $ofckeditor->BasePath = 'fckeditor/';
- $ofckeditor->Value = $articleId > 0? $article->getContent() : '';
- $ofckeditor->Height = '400';
- $this->tpl->set_var('textarea', $ofckeditor->CreateHtml());
+ $this->tpl->set_var('textareaContent', $articleId > 0? $article->getContent() : '');
$this->tpl->pparse('out', 'edit_article');
}
This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.
|
