Author: brushed
Date: Sun Jun 14 19:11:08 2009
New Revision: 784605
URL: http://svn.apache.org/viewvc?rev=784605&view=rev
Log:
Version 3.0.0-svn-130: new version of jspwiki-common.js, jpswiki-edit.js and
jspwiki.css.
* extensive documentation has been added
* jspwiki-edit.js has been updated to replace posteditor.js.
* The plain editor has a new simplified toolbar with some new icons.
* The js ajax routines better fit with new the stripes approach.
Added:
incubator/jspwiki/trunk/src/WebContent/scripts/dialog.js
incubator/jspwiki/trunk/src/WebContent/templates/default/images/application_tile_horizontal.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/application_tile_vertical.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/arrleft.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/arrright.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/bg-button.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/circle-256.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/cog.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/color_wheel.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/cursor.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/find.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/font.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/key.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/paintbrush.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/plugin.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/redo.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/text_letter_omega.png
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/undo.gif
(with props)
incubator/jspwiki/trunk/src/WebContent/templates/default/images/vcard.png
(with props)
Modified:
incubator/jspwiki/trunk/ChangeLog
incubator/jspwiki/trunk/src/WebContent/Edit.jsp
incubator/jspwiki/trunk/src/WebContent/WEB-INF/classes/templates/default.properties
incubator/jspwiki/trunk/src/WebContent/scripts/jspwiki-common.js
incubator/jspwiki/trunk/src/WebContent/scripts/jspwiki-commonstyles.js
incubator/jspwiki/trunk/src/WebContent/scripts/jspwiki-edit.js
incubator/jspwiki/trunk/src/WebContent/scripts/jspwiki-prefs.js
incubator/jspwiki/trunk/src/WebContent/templates/default/Favorites.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/FindContent.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/PageActionsBottom.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/SearchBox.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/UserBox.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/editors/plain.jsp
incubator/jspwiki/trunk/src/WebContent/templates/default/jspwiki.css
incubator/jspwiki/trunk/src/java/org/apache/wiki/Release.java
Modified: incubator/jspwiki/trunk/ChangeLog
URL:
http://svn.apache.org/viewvc/incubator/jspwiki/trunk/ChangeLog?rev=784605&r1=784604&r2=784605&view=diff
==============================================================================
--- incubator/jspwiki/trunk/ChangeLog (original)
+++ incubator/jspwiki/trunk/ChangeLog Sun Jun 14 19:11:08 2009
@@ -1,3 +1,20 @@
+2009-06-14 Dirk Frederickx <brushed AT apache DOT org>
+
+ * 3.0.0-svn-130
+
+ * Checked in new versions of jspwiki-common.js, jpswiki-edit.js
+ and jspwiki.css.
+ Extensive documentation has been added to the javascript and css
+ files, although not complete yet.
+ The jspwiki-edit.js has been updated to replace posteditor.js. Expect
+ still some loose ends though. The plain editor has a new simplified
+ toolbar, but this is still work in progress.
+
+ * Updated the js ajax routines to better fit with new the stripes
approach.
+ FindContents.jsp is now dynamically updating search results.
+ The jsonrpc javascript is still unchanged.
+
+
2009-06-11 Harry Metske <[email protected]>
* 3.0.0-svn-129
Modified: incubator/jspwiki/trunk/src/WebContent/Edit.jsp
URL:
http://svn.apache.org/viewvc/incubator/jspwiki/trunk/src/WebContent/Edit.jsp?rev=784605&r1=784604&r2=784605&view=diff
==============================================================================
--- incubator/jspwiki/trunk/src/WebContent/Edit.jsp (original)
+++ incubator/jspwiki/trunk/src/WebContent/Edit.jsp Sun Jun 14 19:11:08 2009
@@ -35,7 +35,10 @@
<!-- Add Javascript for editors -->
<s:layout-component name="script">
<script type="text/javascript" src="<wiki:Link format='url'
jsp='scripts/jspwiki-edit.js' />"></script>
+ <script type="text/javascript" src="<wiki:Link format='url'
jsp='scripts/dialog.js' />"></script>
+ <%--
<script type="text/javascript" src="<wiki:Link format='url'
jsp='scripts/posteditor.js' />"></script>
+ --%>
</s:layout-component>
<s:layout-component name="content">
Modified:
incubator/jspwiki/trunk/src/WebContent/WEB-INF/classes/templates/default.properties
URL:
http://svn.apache.org/viewvc/incubator/jspwiki/trunk/src/WebContent/WEB-INF/classes/templates/default.properties?rev=784605&r1=784604&r2=784605&view=diff
==============================================================================
---
incubator/jspwiki/trunk/src/WebContent/WEB-INF/classes/templates/default.properties
(original)
+++
incubator/jspwiki/trunk/src/WebContent/WEB-INF/classes/templates/default.properties
Sun Jun 14 19:11:08 2009
@@ -29,6 +29,7 @@
common.nopage=This page does not exist. Why don’t you go and {0}?
common.createit=create it
common.more=More...
+common.ajax.loading=Loading...
# AttachmentTab.jsp
attach.tab=Attach
@@ -398,7 +399,13 @@
editor.plain.cancel.title=Cancel editing. Your changes will be lost. [ q ]
editor.commentsignature=Comment signature
editor.plain.toolbar=Toolbar
+editor.plain.action=Action
+editor.plain.insert=Insert
+editor.plain.style=Style
+editor.plain.extra=Extra
editor.plain.find=Find
+editor.plain.find.title=Find
+editor.plain.config.title=Configure the editor
editor.plain.replace=Replace
editor.plain.matchcase=Match Case
editor.plain.regexp=RegExp
@@ -415,7 +422,8 @@
editor.plain.smartpairs.title=Auto pairing of () [] {} <> ""
''
editor.plain.tabcompletion=Tab Completion (keyword+Tab)
editor.plain.tabcompletion.title=Auto expansion of keyword to Wiki Markup
-editor.plain.sneakpreview.title=Live Preview. The live preview will
automatically update when you click outside the editor text area.
+editor.plain.livepreview=Live Preview
+editor.plain.livepreview.title=The live preview will automatically update when
you type in the editor text area.
editor.plain.tbLink.title=link - Insert wiki link
editor.plain.tbH1.title=h1 - Insert heading1
editor.plain.tbH2.title=h2 - Insert heading2
Added: incubator/jspwiki/trunk/src/WebContent/scripts/dialog.js
URL:
http://svn.apache.org/viewvc/incubator/jspwiki/trunk/src/WebContent/scripts/dialog.js?rev=784605&view=auto
==============================================================================
--- incubator/jspwiki/trunk/src/WebContent/scripts/dialog.js (added)
+++ incubator/jspwiki/trunk/src/WebContent/scripts/dialog.js Sun Jun 14
19:11:08 2009
@@ -0,0 +1,434 @@
+
+/*
+Class: SelectionDialog
+ A selection dialog generates a dialog box, with a set
+ of selectable/clickable items.
+
+Arguments:
+ options - see [Dialog] object
+
+Options:
+ body - set of selectable items, defined as a string ,array or object.
+ onSelect - callback function when an item is clicked
+ autoClose - (default false) hide the dialog when an iten is clicked
+
+Inherits from:
+ [Dialog]
+
+Example:
+ (start code)
+ new SelectionDialog({
+ body:"a|b|c|d",
+ caption:"Snippet Dialog",
+ autoClose:true,
+ onClick:function(v){ alert('clicked '+v) }
+ });
+ new SelectionDialog({
+ body:[a,b,c,d],
+ caption:"Snippet Dialog",
+ onClick:function(v){ alert('clicked '+v) }
+ });
+ new SelectionDialog({
+ body:{'a':'avalue','b':'bvalue','c':'cvalue'},
+ caption:"Snippet Dialog",
+ onClick:function(v){ alert('clicked '+v) }
+ });
+ (end code)
+*/
+var SelectionDialog = Dialog.extend({
+
+ options: {
+ //onSelect: function(value){},
+ //autoClose: false
+ },
+
+ initialize:function( options ){
+
+ this.parent(options);
+ this.element.addClass('selectionDialog');
+ this.setBody(options.body)
+ .resetPosition();
+ },
+
+ setBody: function(content){
+
+ //turn 'multi|value|string' into [array]
+ if( $type(content) == 'string' ) content = content.split('|');
+
+ //turn [array] into {object} with name:value pairs
+ if( $type(content) == 'array' ) content =
content.associate(content);
+
+ //turn {object} in DOM ul/li clickable selection
+ if( $type(content) == 'object' ){
+
+ var els = [], onselect = this.onSelect.bind(this), i;
+ for( i in content ){
+ els.push( new Element('li',{
+ 'title': content[i],
+ 'events': {
+ 'click': onselect,
+ 'mouseout': function(){
this.removeClass('hover') },
+ 'mouseover': function(){
this.addClass('hover') }
+ }
+ }).setHTML( i/*.trunc(36)*/ ) );
+ };
+
+ this.parent( new Element('ul').adopt(els) );
+ //this.body.empty().adopt( new Element('ul').adopt(els)
);
+ }
+
+ return this;
+ },
+ /*
+ Function: onSelect
+ Click event handler for selectable items.
+ When the autoClose option is set, the dialog will be hidden.
+ Fires the 'onSelect' event.
+ */
+ onSelect: function(event){
+
+ if( event ){ event = new Event(event).stop() };
+ if( this.options.autoClose ) this.hide();
+
+ this.fireEvent('onSelect', event.target.getProperty('title'));
+ }
+
+});
+
+/*
+Class: FontDialog
+ The FontDialog is a SelectionDialog object, to selecting a font.
+ Each selectable item is redered in its proper font.
+
+Arguments:
+ options - optional, see options below
+
+Options:
+ fonts - (object) set of font definitions with name/value
+ others - see SelectionDialog options
+
+Inherits from:
+ [SelectionDialog]
+
+Example
+ (start code)
+ dialog= new FontDialog({
+ fonts:{'Font name1':'font1', 'Font name2':'font2'},
+ caption:"Select a Font",
+ onSelect:function(value){ alert( value ); }
+ });
+ (end)
+*/
+var FontDialog = SelectionDialog.extend({
+
+ options: {
+ fonts: {
+ 'Arial':'arial',
+ 'Comic Sans':'comic sans ms',
+ 'Courier New':'courier new',
+ 'Georgia':'georgia',
+ 'Helvetica':'helvetica',
+ 'Impact':'impact',
+ 'Times':'times new roman',
+ 'Trebuchet':'trebuchet ms',
+ 'Verdana':'verdana'
+ }
+ },
+
+ initialize:function(options){
+
+ options.body = options.fonts ? options.fonts :
this.options.fonts;
+ this.parent(options);
+ this.element.addClass('fontDialog');
+ $ES('li',this.body).each(function(li){
+ li.setStyle('font-family', li.getProperty('title') );
+ });
+ }
+
+});
+
+/*
+Class: CharsDialog
+ The CharsDialog is a Dialog object, to support selection of special
+ character.
+
+Arguments:
+ options - optional, see options below
+
+Options:
+ others - see Dialog options
+
+Inherits from:
+ [Dialog]
+*/
+var CharsDialog = Dialog.extend({
+
+ options: {
+ //onChange: Class.empty,
+ //autoClose: false,
+ chars: [
+
' ','¡','¢','£','¥','§','¨','©','«','¬','®',
+
'°','±','´','µ','¶','·','¸','»','¿','À','Á',
+
'Â','Ã','Ä','Å','Æ','Ç','È','É','Ê','Ë','Ì',
+
'Í','Î','Ï','Ñ','Ò','Ó','Ô','Õ','Ö','Ø','Ù',
+
'Ú','Û','Ü','ß','à','á','â','ã','ä','å','æ',
+
'ç','è','é','ê','ë','ì','í','î','ï','ñ','ò',
+
'ó','ô','õ','ö','÷','ø','ù','ú','û','ü','ÿ',
+
'‚','ƒ','„','…','†','‡','ˆ','‰','‹','Œ','‘',
+
'’','“','”','•','–','—','˜','™','›','œ','Ÿ'
+ ]
+ },
+
+ initialize:function(options){
+ this.parent(options);
+ this.element.addClass('charsDialog');
+
+ /* inspired by smarkup */
+ var arr = [],
+ chars = this.options.chars,
+ rowCount = chars.length / 11, //fixme: fixed width of
table !!
+ onselect = this.onSelect.bind(this);
+
+ for (var i = 0; i < rowCount; i++) {
+ arr.push( '<tr>' );
+ for (var j = i * 11; j < (i * 11 + 11); j++) {
+ arr.extend( ['<td title="',
chars[j].replace('&','&'), '" >', chars[j], '</td>' ] );
+ }
+ arr.push( '</tr>' );
+ }
+
+ this.body.adopt( new Element('table',{
+ 'class':'charsDialog',
+ 'events':{ 'click': onselect }
+ }).setHTML( '<tbody>', arr.join(''), '</tbody>' )
+ );
+
+ this.resetPosition();
+
+ },
+
+ onSelect: function(e){
+ if( this.options.autoClose ) this.hide();
+ this.fireEvent('onSelect', e.target.getProperty('title'));
+ }
+
+});
+
+
+/*
+Class: ColorDialog
+ The ColorDialog is a [Dialog] which allow visual entry of hexadecimal
color
+ values.
+
+Inspiration:
+ - http://www.colorjack.com/software/dhtml+color+sphere.html
+ - Chris Esler, http://www.chrisesler.com/mootools
+
+Inherits from:
+ [Dialog]
+
+Example:
+ ColorDialog with toggle button
+ (start code)
+ <script>
+ var cd = new ColorDialog( {
+ relativeTo: $('colorButton'),
+ wheelImage:'circle.png',
+ onChange:function(color){
$('mytarget').setStyle('background',color); }
+ });
+ $('colorButton').addEvent('click', cd.toggle.bind(cd));
+ </script>
+ (end code)
+*/
+var ColorDialog = Dialog.extend({
+
+ options: {
+ //onChange: function(color){},
+ colorImage: 'images/circle-256.png',
+ resize:{x:[96,400],y:[96,400]} //min/max limits for the resizer
+ },
+
+ initialize: function(options){
+
+ var self = this;
+ self.parent(options);
+ self.element.addClass('colorDialog');
+ self.hsv = [0,0,100];//starting color.
+ self.color = new
Element('span').setHTML('#ffffff').injectTop(self.caption);
+ self.cursor = new Element('div',{
+ 'class':'cursor',
+ 'styles':{'top':86,'left':68}
+ //funny calc -- checkout the dialog css defs
+ // 86=64+32-8 (-8=offset circle)
+ // 68=64+10-5-1 (5=half cursor size, -1=offset circle)
+ });
+ self.body.adopt(
+ self.cursor,
+ new Element('img',{'src':self.options.colorImage})
+ );
+
+ self.resize( 128 ); //default size of the body/wheel
+
+ new Drag.Base(self.cursor,{
+ handle:self.body,
+ snap:0,
+ //also update the wheel on mouse-down
+ onStart:function(){ self.setHSV( this.mouse.start ) },
+ onDrag:function(){ self.setHSV( this.mouse.now ) }
+ });
+
+ self.resetPosition();
+ },
+
+ /*
+ Function: resize
+ */
+ resize: function( bodywidth ){
+ this.moveCursor( bodywidth );
+ this.parent( bodywidth );
+ },
+
+ /*
+ Function: setHSV
+ Recalculate the HSV-color based on x/y mouse coordinates.
+ After recalculation, the color-wheel cursor is repositioned
+ and the 'onChange' event is fired.
+
+ Arguments:
+ page - object with {{ {x:.., y:.. } }} coordinates
+ */
+ setHSV: function( page ){
+
+ var body = this.body.getCoordinates(),
+ v = [page.x - body.left + 5, page.y - body.top +28 ],
+ W = body.width,
+ W2 = W/2,
+ W3 = W2/2,
+
+ x = v[0]-W2-3,
+ y = W-v[1]-W2+21,
+ SV = Math.sqrt(Math.pow(x,2)+Math.pow(y,2)),
+ hue = Math.atan2(x,y)/(Math.PI*2);
+
+ this.hsv = [
+ hue>0?(hue*360):((hue*360)+360),
+ SV<W3?(SV/W3)*100:100,
+ SV>=W3?Math.max(0,1-((SV-W3)/(W3)))*100:100
+ ];
+
+ var hexVal = this.hsv.hsv2rgb().rgbToHex();
+ this.color.setHTML( hexVal ).setStyles({
+ 'color': new Color(hexVal).invert().hex,
+ 'background-color': hexVal
+ });
+ this.moveCursor( W );
+ this.fireEvent('onChange', hexVal);
+
+ },
+
+ /*
+ Function: moveCursor
+ Reposition the cursor based on the width argument
+
+ Argument
+ width - in px
+ */
+ moveCursor: function( width ){
+
+ var hsv = this.hsv,
+ W2 = width/2, //half of the width
+ rad = (hsv[0]/360) * (Math.PI*2), //radius
+ hyp = (hsv[1] + (100-hsv[2])) / 100*(W2/2);
//hypothenuse
+
+ this.cursor.setStyles({
+ left: Math.round(Math.abs(Math.round(Math.sin(rad)*hyp)
+ W2 + 3)), //+1
+ top: Math.round(Math.abs(Math.round(Math.cos(rad)*hyp)
- W2 - 21)) //-18
+ });
+
+ }
+
+});
+ColorDialog.implement(new Options); //mootools v1.1
+
+/*
+Function: hsv2rgb
+ Convert HSV values into RGB values
+*/
+Array.extend({
+ hsv2rgb: function(){
+ // easyrgb.com/math.php?MATH=M21#text21
+ var R,G,A,B,C,F,
+ S=this[1]/100,
+ V=this[2]/100,
+ H=this[0]/360;
+
+ if( S>0 ){
+
+ if(H>=1) H=0;
+ H=6*H;
+ F=H-Math.floor(H);
+ A=Math.round(255*V*(1-S));
+ B=Math.round(255*V*(1-(S*F)));
+ C=Math.round(255*V*(1-(S*(1-F))));
+ V=Math.round(255*V);
+
+ switch(Math.floor(H)) {
+ case 0: R=V; G=C; B=A; break;
+ case 1: R=B; G=V; B=A; break;
+ case 2: R=A; G=V; B=C; break;
+ case 3: R=A; G=B; B=V; break;
+ case 4: R=C; G=A; B=V; break;
+ case 5: R=V; G=A; B=B; break;
+ }
+ return([R?R:0,G?G:0,B?B:0]);
+ }
+ else return([(V=Math.round(V*255)),V,V]);
+ }
+})
+
+
+/*
+Class: FormDialog
+ The FormDialog is a dialog
+
+Example:
+ (start code)
+ FormDialog({
+ body: dom-element,
+ buttons: { ok:'OK-label', cancel:'Cancel-label' }
+ options:{
+ onSubmit:function( queryString ){ //process-results
+ }
+ (end)
+*/
+var FormDialog = Dialog.extend({
+ //todo
+});
+
+
+/*
+Class: TableDialog
+ The TableDialog is a simple wiki table editor based on the Dialog class.
+
+ - click cell and get small input-textarea to enter markup
+ - allow to toggle header/normal-cell flag per cell
+ - hover column header (A,B,C...) and click to insert/delete
+ - hover row header (1,2,3,...) and click to insert/delete
+ - allow to extend colums
+ - allow to extend rows
+ - automatically converts wiki to table and vice-versa
+ - FFS: support [{Table plugin syntax to merge cells
+ This requires to select multiple cells: join/unjoin cells
+
+Example:
+ (start code)
+ WikiTableDialog( wiki-markup ?? textarea,{
+ buttons: { ok:'OK-label', cancel:'Cancel-label' }
+ onChange:function()
+ }
+ })
+ (end)
+*/
+var TableDialog = Dialog.extend({
+ //todo
+});
