1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813 |
-
- 'use strict';
- ( function() {
- var template = '<img alt="" src="" />',
- templateBlock = new CKEDITOR.template(
- '<figure class="{captionedClass}">' +
- template +
- '<figcaption>{captionPlaceholder}</figcaption>' +
- '</figure>' ),
- alignmentsObj = {
- 'left': 0,
- 'center': 1,
- 'right': 2,
- 'baseline': 3,
- 'top': 4,
- 'bottom': 5,
- 'middle': 6,
- 'super': 7,
- 'sub': 8,
- 'text-top': 9,
- 'text-bottom': 10
- },
- regexPercent = /^\s*(\d+\%)\s*$/i;
- CKEDITOR.plugins.add( 'image2_chamilo', {
-
- lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn',
-
- requires: 'widget,dialog',
- icons: 'image',
- hidpi: true,
- onLoad: function() {
- CKEDITOR.addCss(
- '.cke_image_nocaption{' +
-
-
- 'line-height:0' +
- '}' +
- '.cke_editable.cke_image_sw, .cke_editable.cke_image_sw *{cursor:sw-resize !important}' +
- '.cke_editable.cke_image_se, .cke_editable.cke_image_se *{cursor:se-resize !important}' +
- '.cke_image_resizer{' +
- 'display:none;' +
- 'position:absolute;' +
- 'width:10px;' +
- 'height:10px;' +
- 'bottom:-5px;' +
- 'right:-5px;' +
- 'background:#000;' +
- 'outline:1px solid #fff;' +
-
- 'line-height:0;' +
- 'cursor:se-resize;' +
- '}' +
- '.cke_image_resizer_wrapper{' +
- 'position:relative;' +
- 'display:inline-block;' +
- 'line-height:0;' +
- '}' +
-
- '.cke_image_resizer.cke_image_resizer_left{' +
- 'right:auto;' +
- 'left:-5px;' +
- 'cursor:sw-resize;' +
- '}' +
- '.cke_widget_wrapper:hover .cke_image_resizer,' +
- '.cke_image_resizer.cke_image_resizing{' +
- 'display:block' +
- '}' +
-
- '.cke_widget_wrapper>a{' +
- 'display:inline-block' +
- '}' );
- },
- init: function( editor ) {
-
-
- var config = editor.config,
- lang = editor.lang.image2_chamilo,
- image = widgetDef( editor );
-
-
-
-
- config.filebrowserImage2ChamiloBrowseUrl = config.filebrowserImageBrowseUrl;
- config.filebrowserImage2ChamiloUploadUrl = config.filebrowserImageUploadUrl;
-
- image.pathName = lang.pathName;
- image.editables.caption.pathName = lang.pathNameCaption;
-
- editor.widgets.add( 'image', image );
-
- editor.ui.addButton && editor.ui.addButton( 'Image', {
- label: editor.lang.common.image,
- command: 'image',
- toolbar: 'insert,10'
- } );
-
- if ( editor.contextMenu ) {
- editor.addMenuGroup( 'image', 10 );
- editor.addMenuItem( 'image', {
- label: lang.menu,
- command: 'image',
- group: 'image'
- } );
- }
- CKEDITOR.dialog.add( 'image2_chamilo', this.path + 'dialogs/image2_chamilo.js' );
- },
- afterInit: function( editor ) {
-
- var align = { left: 1, right: 1, center: 1, block: 1 },
- integrate = alignCommandIntegrator( editor );
- for ( var value in align )
- integrate( value );
-
- linkCommandIntegrator( editor );
- }
- } );
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- function widgetDef( editor ) {
- var alignClasses = editor.config.image2_chamilo_alignClasses,
- captionedClass = editor.config.image2_chamilo_captionedClass;
- function deflate() {
- if ( this.deflated )
- return;
-
- if ( editor.widgets.focused == this.widget )
- this.focused = true;
- editor.widgets.destroy( this.widget );
-
- this.deflated = true;
- }
- function inflate() {
- var editable = editor.editable(),
- doc = editor.document;
-
-
-
- if ( this.deflated ) {
- this.widget = editor.widgets.initOn( this.element, 'image', this.widget.data );
-
-
-
- if ( this.widget.inline && !( new CKEDITOR.dom.elementPath( this.widget.wrapper, editable ).block ) ) {
- var block = doc.createElement( editor.activeEnterMode == CKEDITOR.ENTER_P ? 'p' : 'div' );
- block.replace( this.widget.wrapper );
- this.widget.wrapper.move( block );
- }
-
-
- if ( this.focused ) {
- this.widget.focus();
- delete this.focused;
- }
- delete this.deflated;
- }
-
-
- else {
- setWrapperAlign( this.widget, alignClasses );
- }
- }
- return {
- allowedContent: getWidgetAllowedContent( editor ),
- requiredContent: 'img[src,alt]',
- features: getWidgetFeatures( editor ),
- styleableElements: 'img figure',
-
- contentTransformations: [
- [ 'img[width]: sizeToAttribute' ]
- ],
-
- editables: {
- caption: {
- selector: 'figcaption',
- allowedContent: 'br em strong sub sup u s; a[!href,target]'
- }
- },
- parts: {
- image: 'img',
- caption: 'figcaption'
-
- },
-
- dialog: 'image2_chamilo',
-
- template: template,
- data: function() {
- var features = this.features;
-
- if ( this.data.hasCaption && !editor.filter.checkFeature( features.caption ) )
- this.data.hasCaption = false;
-
- if ( this.data.align != 'none' && !editor.filter.checkFeature( features.align ) )
- this.data.align = 'none';
-
- this.shiftState( {
- widget: this,
- element: this.element,
- oldData: this.oldData,
- newData: this.data,
- deflate: deflate,
- inflate: inflate
- } );
-
-
- if ( !this.data.link ) {
- if ( this.parts.link )
- delete this.parts.link;
- } else {
- if ( !this.parts.link )
- this.parts.link = this.parts.image.getParent();
- }
- this.parts.image.setAttributes( {
- src: this.data.src,
- class: this.data.isResponsive ? 'img-responsive' : '',
-
- 'data-cke-saved-src': this.data.src,
- alt: this.data.alt
- } );
- if (this.data.hasCaption) {
- this.parts.image.setStyle('border-width', null);
- this.parts.image.setStyle('border-style', null);
- this.parts.image.setStyle('border-color', null);
- this.parts.image.setStyle('border-radius', null);
- this.parts.image.setStyle('background-color', null);
- } else {
- this.parts.image.setStyle('border-width', this.data.borderWidth);
- this.parts.image.setStyle('border-style', this.data.borderStyle);
- this.parts.image.setStyle('border-color', this.data.borderColor);
- this.parts.image.setStyle('border-radius', this.data.borderRadius);
- this.parts.image.setStyle('background-color', this.data.backgroundColor);
- }
-
-
- if ( this.oldData && !this.oldData.hasCaption && this.data.hasCaption ) {
- for ( var c in this.data.classes )
- this.parts.image.removeClass( c );
- }
-
-
- if ( editor.filter.checkFeature( features.dimension ) )
- setDimensions( this );
-
- this.oldData = CKEDITOR.tools.extend( {}, this.data );
- },
- init: function() {
- var helpers = CKEDITOR.plugins.image2_chamilo,
- image = this.parts.image,
- data = {
- hasCaption: !!this.parts.caption,
- src: image.getAttribute( 'src' ),
- alt: image.getAttribute( 'alt' ) || '',
- width: image.getAttribute( 'width' ) || '',
- height: image.getAttribute( 'height' ) || '',
- isResponsive: !!image.$.className.match(/img-responsive/i),
-
- lock: this.ready ? helpers.checkHasNaturalRatio( image ) : true,
- borderWidth: !this.parts.caption ? image.getStyle('border-width') : '',
- borderStyle: !this.parts.caption ? image.getStyle('border-style') : 'solid',
- borderColor: !this.parts.caption ? image.getStyle('border-color') : '',
- borderRadius: !this.parts.caption ? image.getStyle('border-radius') : '',
- backgroundColor: !this.parts.caption ? image.getStyle('background-color') : '',
- };
-
-
-
- var link = image.getAscendant( 'a' );
- if ( link && this.wrapper.contains( link ) )
- this.parts.link = link;
-
-
-
-
- if ( !data.align ) {
- var alignElement = data.hasCaption ? this.element : image;
-
- if ( alignClasses ) {
- if ( alignElement.hasClass( alignClasses[ 0 ] ) ) {
- data.align = 'left';
- } else if ( alignElement.hasClass( alignClasses[ 2 ] ) ) {
- data.align = 'right';
- } else if ( alignElement.hasClass( alignClasses[ 3 ] ) ) {
- data.align = 'baseline';
- } else if ( alignElement.hasClass( alignClasses[ 4 ] ) ) {
- data.align = 'top';
- } else if ( alignElement.hasClass( alignClasses[ 5 ] ) ) {
- data.align = 'bottom';
- } else if ( alignElement.hasClass( alignClasses[ 6 ] ) ) {
- data.align = 'middle';
- } else if ( alignElement.hasClass( alignClasses[ 7 ] ) ) {
- data.align = 'super';
- } else if ( alignElement.hasClass( alignClasses[ 8 ] ) ) {
- data.align = 'sub';
- } else if ( alignElement.hasClass( alignClasses[ 9 ] ) ) {
- data.align = 'text-top';
- } else if ( alignElement.hasClass( alignClasses[ 10 ] ) ) {
- data.align = 'text-bottom';
- }
- if ( data.align ) {
- alignElement.removeClass( alignClasses[ alignmentsObj[ data.align ] ] );
- } else {
- data.align = 'none';
- }
- }
-
- else {
- data.align = alignElement.getStyle( 'float' );
- if ( data.align !== 'left' && data.align !== 'right' ) {
- data.align = alignElement.getStyle('vertical-align');
- } else {
- data.align = 'none';
- }
- alignElement.removeStyle( 'float' );
- alignElement.removeStyle( 'vertical-align' );
- }
- }
-
- if ( editor.plugins.link && this.parts.link ) {
- data.link = helpers.getLinkAttributesParser()( editor, this.parts.link );
-
-
- var advanced = data.link.advanced;
- if ( advanced && advanced.advCSSClasses ) {
- advanced.advCSSClasses = CKEDITOR.tools.trim( advanced.advCSSClasses.replace( /cke_\S+/, '' ) );
- }
- }
-
-
- this.wrapper[ ( data.hasCaption ? 'remove' : 'add' ) + 'Class' ]( 'cke_image_nocaption' );
- this.setData( data );
-
-
- if ( editor.filter.checkFeature( this.features.dimension ) && editor.config.image2_chamilo_disableResizer !== true )
- setupResizer( this );
- this.shiftState = helpers.stateShifter( this.editor );
-
- this.on( 'contextMenu', function( evt ) {
- evt.data.image = CKEDITOR.TRISTATE_OFF;
-
-
-
- if ( this.parts.link || this.wrapper.getAscendant( 'a' ) )
- evt.data.link = evt.data.unlink = CKEDITOR.TRISTATE_OFF;
- } );
-
- this.on( 'dialog', function( evt ) {
- evt.data.widget = this;
- }, this );
- },
-
-
- addClass: function( className ) {
- getStyleableElement( this ).addClass( className );
- },
-
-
- hasClass: function( className ) {
- return getStyleableElement( this ).hasClass( className );
- },
-
-
- removeClass: function( className ) {
- getStyleableElement( this ).removeClass( className );
- },
-
-
- getClasses: ( function() {
- var classRegex = new RegExp( '^(' + [].concat( captionedClass, alignClasses ).join( '|' ) + ')$' );
- return function() {
- var classes = this.repository.parseElementClasses( getStyleableElement( this ).getAttribute( 'class' ) );
-
-
- for ( var c in classes ) {
- if ( classRegex.test( c ) )
- delete classes[ c ];
- }
- return classes;
- };
- } )(),
- upcast: upcastWidgetElement( editor ),
- downcast: downcastWidgetElement( editor ),
- getLabel: function() {
- var label = ( this.data.alt || '' ) + ' ' + this.pathName;
- return this.editor.lang.widget.label.replace( /%1/, label );
- }
- };
- }
-
- CKEDITOR.plugins.image2_chamilo = {
- stateShifter: function( editor ) {
-
- var doc = editor.document,
- alignClasses = editor.config.image2_chamilo_alignClasses,
- captionedClass = editor.config.image2_chamilo_captionedClass,
- editable = editor.editable(),
-
- shiftables = [ 'hasCaption', 'align', 'link' ];
-
- var stateActions = {
- align: function( shift, oldValue, newValue ) {
- var el = shift.element;
-
- if ( shift.changed.align ) {
-
- if ( !shift.newData.hasCaption ) {
-
- if ( newValue == 'center' ) {
- shift.deflate();
- shift.element = wrapInCentering( editor, el );
- }
-
- if ( !shift.changed.hasCaption && oldValue == 'center' && newValue != 'center' ) {
- shift.deflate();
- shift.element = unwrapFromCentering( el );
- }
- }
- }
-
- else if ( newValue == 'center' && shift.changed.hasCaption && !shift.newData.hasCaption ) {
- shift.deflate();
- shift.element = wrapInCentering( editor, el );
- }
-
-
- if ( el.is( 'figure' ) ) {
- if ( newValue == 'center' )
- el.setStyle( 'display', 'inline-block' );
- else
- el.removeStyle( 'display' );
- }
- },
- hasCaption: function( shift, oldValue, newValue ) {
-
- if ( !shift.changed.hasCaption )
- return;
-
-
- var imageOrLink;
- if ( shift.element.is( { img: 1, a: 1 } ) )
- imageOrLink = shift.element;
- else
- imageOrLink = shift.element.findOne( 'a,img' );
-
- shift.deflate();
-
- if ( newValue ) {
-
- var figure = CKEDITOR.dom.element.createFromHtml( templateBlock.output( {
- captionedClass: captionedClass,
- captionPlaceholder: editor.lang.image2_chamilo.captionPlaceholder
- } ), doc );
-
- replaceSafely( figure, shift.element );
-
-
- imageOrLink.replace( figure.findOne( 'img' ) );
-
- shift.element = figure;
- }
-
- else {
-
- imageOrLink.replace( shift.element );
-
- shift.element = imageOrLink;
- }
- },
- link: function( shift, oldValue, newValue ) {
- if ( shift.changed.link ) {
- var img = shift.element.is( 'img' ) ?
- shift.element : shift.element.findOne( 'img' ),
- link = shift.element.is( 'a' ) ?
- shift.element : shift.element.findOne( 'a' ),
-
-
-
-
-
- needsDeflate = ( shift.element.is( 'a' ) && !newValue ) || ( shift.element.is( 'img' ) && newValue ),
- newEl;
- if ( needsDeflate )
- shift.deflate();
-
- if ( !newValue )
- newEl = unwrapFromLink( link );
- else {
-
- if ( !oldValue )
- newEl = wrapInLink( img, shift.newData.link );
-
- var attributes = CKEDITOR.plugins.image2_chamilo.getLinkAttributesGetter()( editor, newValue );
- if ( !CKEDITOR.tools.isEmpty( attributes.set ) )
- ( newEl || link ).setAttributes( attributes.set );
- if ( attributes.removed.length )
- ( newEl || link ).removeAttributes( attributes.removed );
- }
- if ( needsDeflate )
- shift.element = newEl;
- }
- },
- isResponsive: function (shift, oldValue, newValue) {
- if (!shift.changed.isResponsive) {
- return;
- }
- var image = shift.element.find('img');
- }
- };
- function wrapInCentering( editor, element ) {
- var attribsAndStyles = {};
- if ( alignClasses )
- attribsAndStyles.attributes = { 'class': alignClasses[ 1 ] };
- else
- attribsAndStyles.styles = { 'text-align': 'center' };
-
-
- var center = doc.createElement(
- editor.activeEnterMode == CKEDITOR.ENTER_P ? 'p' : 'div', attribsAndStyles );
-
- replaceSafely( center, element );
- element.move( center );
- return center;
- }
- function unwrapFromCentering( element ) {
- var imageOrLink = element.findOne( 'a,img' );
- imageOrLink.replace( element );
- return imageOrLink;
- }
-
-
-
-
-
-
- function wrapInLink( img, linkData ) {
- var link = doc.createElement( 'a', {
- attributes: {
- href: linkData.url
- }
- } );
- link.replace( img );
- img.move( link );
- return link;
- }
-
-
-
-
-
- function unwrapFromLink( link ) {
- var img = link.findOne( 'img' );
- img.replace( link );
- return img;
- }
- function replaceSafely( replacing, replaced ) {
- if ( replaced.getParent() ) {
- var range = editor.createRange();
- range.moveToPosition( replaced, CKEDITOR.POSITION_BEFORE_START );
-
-
-
- replaced.remove();
- editable.insertElementIntoRange( replacing, range );
- }
- else {
- replacing.replace( replaced );
- }
- }
- return function( shift ) {
- var name, i;
- shift.changed = {};
- for ( i = 0; i < shiftables.length; i++ ) {
- name = shiftables[ i ];
- shift.changed[ name ] = shift.oldData ?
- shift.oldData[ name ] !== shift.newData[ name ] : false;
- }
-
- for ( i = 0; i < shiftables.length; i++ ) {
- name = shiftables[ i ];
- stateActions[ name ]( shift,
- shift.oldData ? shift.oldData[ name ] : null,
- shift.newData[ name ] );
- }
- shift.inflate();
- };
- },
-
- checkHasNaturalRatio: function( image ) {
- var $ = image.$,
- natural = this.getNatural( image );
-
-
-
-
- return Math.round( $.clientWidth / natural.width * natural.height ) == $.clientHeight ||
- Math.round( $.clientHeight / natural.height * natural.width ) == $.clientWidth;
- },
-
- getNatural: function( image ) {
- var dimensions;
- if ( image.$.naturalWidth ) {
- dimensions = {
- width: image.$.naturalWidth,
- height: image.$.naturalHeight
- };
- } else {
- var img = new Image();
- img.src = image.getAttribute( 'src' );
- dimensions = {
- width: img.width,
- height: img.height
- };
- }
- return dimensions;
- },
-
- getLinkAttributesGetter: function() {
-
- return CKEDITOR.plugins.link.getLinkAttributes;
- },
-
- getLinkAttributesParser: function() {
-
- return CKEDITOR.plugins.link.parseLinkAttributes;
- }
- };
- function setWrapperAlign( widget, alignClasses ) {
- var wrapper = widget.wrapper,
- align = widget.data.align,
- hasCaption = widget.data.hasCaption;
- if ( alignClasses ) {
-
- for ( var i = 11; i--; )
- wrapper.removeClass( alignClasses[ i ] );
- if ( align == 'center' ) {
-
-
-
-
-
-
-
-
- if ( hasCaption ) {
- wrapper.addClass( alignClasses[ 1 ] );
- }
- } else if ( align != 'none' ) {
- wrapper.addClass( alignClasses[ alignmentsObj[ align ] ] );
- }
- } else {
- if ( align == 'center' ) {
- if ( hasCaption )
- wrapper.setStyle( 'text-align', 'center' );
- else
- wrapper.removeStyle( 'text-align' );
- wrapper.removeStyle( 'float' );
- }
- else {
- if ( align == 'none' )
- wrapper.removeStyle( 'float' );
- else if (align == 'left' || align == 'right')
- wrapper.setStyle( 'float', align );
- else
- wrapper.setStyle( 'vertical-align', align );
- wrapper.removeStyle( 'text-align' );
- }
- }
- }
-
-
-
-
-
- function upcastWidgetElement( editor ) {
- var isCenterWrapper = centerWrapperChecker( editor ),
- captionedClass = editor.config.image2_chamilo_captionedClass;
-
-
- return function( el, data ) {
- var dimensions = { width: 1, height: 1 },
- name = el.name,
- image;
-
- if ( el.attributes[ 'data-cke-realelement' ] )
- return;
-
-
-
-
-
-
-
-
-
-
-
-
- if ( isCenterWrapper( el ) ) {
- if ( name == 'div' ) {
- var figure = el.getFirst( 'figure' );
-
- if ( figure ) {
- el.replaceWith( figure );
- el = figure;
- }
- }
-
-
- data.align = 'center';
-
- image = el.getFirst( 'img' ) || el.getFirst( 'a' ).getFirst( 'img' );
- }
-
- else if ( name == 'figure' && el.hasClass( captionedClass ) ) {
- image = el.getFirst( 'img' ) || el.getFirst( 'a' ).getFirst( 'img' );
-
- } else if ( isLinkedOrStandaloneImage( el ) ) {
- image = el.name == 'a' ? el.children[ 0 ] : el;
- }
- if ( !image )
- return;
-
-
- for ( var d in dimensions ) {
- var dimension = image.attributes[ d ];
- if ( dimension && dimension.match( regexPercent ) )
- delete image.attributes[ d ];
- }
- return el;
- };
- }
-
-
-
-
- function downcastWidgetElement( editor ) {
- var alignClasses = editor.config.image2_chamilo_alignClasses;
-
- return function( el ) {
-
-
- var attrsHolder = el.name == 'a' ? el.getFirst() : el,
- attrs = attrsHolder.attributes,
- align = this.data.align;
-
-
- if ( !this.inline ) {
- var resizeWrapper = el.getFirst( 'span' );
- if ( resizeWrapper )
- resizeWrapper.replaceWith( resizeWrapper.getFirst( { img: 1, a: 1 } ) );
- }
- if ( align && align != 'none' ) {
- var styles = CKEDITOR.tools.parseCssText( attrs.style || '' );
- var allowedAllignments = {
- 'left': 1,
- 'right': 1,
- 'baseline': 1,
- 'top': 1,
- 'bottom': 1,
- 'middle': 1,
- 'super': 1,
- 'sub': 1,
- 'text-top': 1,
- 'text-bottom': 1
- };
-
-
-
-
-
-
-
-
-
-
-
-
- if ( align == 'center' && el.name == 'figure' ) {
- el = el.wrapWith( new CKEDITOR.htmlParser.element( 'div',
- alignClasses ? { 'class': alignClasses[ 1 ] } : { style: 'text-align:center' } ) );
- }
-
- else if ( align in allowedAllignments ) {
- if ( alignClasses )
- attrsHolder.addClass( alignClasses[ alignmentsObj[ align ] ] );
- else if (align == 'left' || align == 'right')
- styles[ 'float' ] = align;
- else
- styles['vertical-align'] = align;
- }
-
- if ( !alignClasses && !CKEDITOR.tools.isEmpty( styles ) )
- attrs.style = CKEDITOR.tools.writeCssText( styles );
- }
- return el;
- };
- }
-
-
-
-
- function centerWrapperChecker( editor ) {
- var captionedClass = editor.config.image2_chamilo_captionedClass,
- alignClasses = editor.config.image2_chamilo_alignClasses,
- validChildren = { figure: 1, a: 1, img: 1 };
- return function( el ) {
-
- if ( !( el.name in { div: 1, p: 1 } ) )
- return false;
- var children = el.children;
-
- if ( children.length !== 1 )
- return false;
- var child = children[ 0 ];
-
-
- if ( !( child.name in validChildren ) )
- return false;
-
-
- if ( el.name == 'p' ) {
- if ( !isLinkedOrStandaloneImage( child ) )
- return false;
- }
-
- else {
-
-
- if ( child.name == 'figure' ) {
- if ( !child.hasClass( captionedClass ) )
- return false;
- } else {
-
-
-
-
- if ( editor.enterMode == CKEDITOR.ENTER_P )
- return false;
-
-
- if ( !isLinkedOrStandaloneImage( child ) )
- return false;
- }
- }
-
-
- if ( alignClasses ? el.hasClass( alignClasses[ 1 ] ) :
- CKEDITOR.tools.parseCssText( el.attributes.style || '', true )[ 'text-align' ] == 'center' )
- return true;
- return false;
- };
- }
-
-
-
- function isLinkedOrStandaloneImage( el ) {
- if ( el.name == 'img' )
- return true;
- else if ( el.name == 'a' )
- return el.children.length == 1 && el.getFirst( 'img' );
- return false;
- }
-
-
-
- function setDimensions( widget ) {
- var data = widget.data,
- dimensions = { width: data.width, height: data.height },
- image = widget.parts.image;
- for ( var d in dimensions ) {
- if ( dimensions[ d ] )
- image.setAttribute( d, dimensions[ d ] );
- else
- image.removeAttribute( d );
- }
- }
-
-
-
- function setupResizer( widget ) {
- var editor = widget.editor,
- editable = editor.editable(),
- doc = editor.document,
-
- resizer = widget.resizer = doc.createElement( 'span' );
- resizer.addClass( 'cke_image_resizer' );
- resizer.setAttribute( 'title', editor.lang.image2_chamilo.resizer );
- resizer.append( new CKEDITOR.dom.text( '\u200b', doc ) );
-
- if ( !widget.inline ) {
- var imageOrLink = widget.parts.link || widget.parts.image,
- oldResizeWrapper = imageOrLink.getParent(),
- resizeWrapper = doc.createElement( 'span' );
- resizeWrapper.addClass( 'cke_image_resizer_wrapper' );
- resizeWrapper.append( imageOrLink );
- resizeWrapper.append( resizer );
- widget.element.append( resizeWrapper, true );
-
-
- if ( oldResizeWrapper.is( 'span' ) )
- oldResizeWrapper.remove();
- } else {
- widget.wrapper.append( resizer );
- }
-
- resizer.on( 'mousedown', function( evt ) {
- var image = widget.parts.image,
-
-
-
- factor = widget.data.align == 'right' ? -1 : 1,
-
-
- startX = evt.data.$.screenX,
- startY = evt.data.$.screenY,
-
- startWidth = image.$.clientWidth,
- startHeight = image.$.clientHeight,
- ratio = startWidth / startHeight,
- listeners = [],
-
- cursorClass = 'cke_image_s' + ( !~factor ? 'w' : 'e' ),
- nativeEvt, newWidth, newHeight, updateData,
- moveDiffX, moveDiffY, moveRatio;
-
- editor.fire( 'saveSnapshot' );
-
- attachToDocuments( 'mousemove', onMouseMove, listeners );
-
- attachToDocuments( 'mouseup', onMouseUp, listeners );
-
- editable.addClass( cursorClass );
-
- resizer.addClass( 'cke_image_resizing' );
-
-
- function attachToDocuments( name, callback, collection ) {
- var globalDoc = CKEDITOR.document,
- listeners = [];
- if ( !doc.equals( globalDoc ) )
- listeners.push( globalDoc.on( name, callback ) );
- listeners.push( doc.on( name, callback ) );
- if ( collection ) {
- for ( var i = listeners.length; i--; )
- collection.push( listeners.pop() );
- }
- }
-
- function adjustToX() {
- newWidth = startWidth + factor * moveDiffX;
- newHeight = Math.round( newWidth / ratio );
- }
-
- function adjustToY() {
- newHeight = startHeight - moveDiffY;
- newWidth = Math.round( newHeight * ratio );
- }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- function onMouseMove( evt ) {
- nativeEvt = evt.data.$;
-
- moveDiffX = nativeEvt.screenX - startX;
- moveDiffY = startY - nativeEvt.screenY;
-
- moveRatio = Math.abs( moveDiffX / moveDiffY );
-
- if ( factor == 1 ) {
- if ( moveDiffX <= 0 ) {
-
- if ( moveDiffY <= 0 )
- adjustToX();
-
- else {
- if ( moveRatio >= ratio )
- adjustToX();
- else
- adjustToY();
- }
- } else {
-
- if ( moveDiffY <= 0 ) {
- if ( moveRatio >= ratio )
- adjustToY();
- else
- adjustToX();
- }
-
- else {
- adjustToY();
- }
- }
- }
-
-
- else {
- if ( moveDiffX <= 0 ) {
-
- if ( moveDiffY <= 0 ) {
- if ( moveRatio >= ratio )
- adjustToY();
- else
- adjustToX();
- }
-
- else {
- adjustToY();
- }
- } else {
-
- if ( moveDiffY <= 0 )
- adjustToX();
-
- else {
- if ( moveRatio >= ratio ) {
- adjustToX();
- } else {
- adjustToY();
- }
- }
- }
- }
-
-
- if ( newWidth >= 15 && newHeight >= 15 ) {
- image.setAttributes( { width: newWidth, height: newHeight } );
- updateData = true;
- } else {
- updateData = false;
- }
- }
- function onMouseUp() {
- var l;
- while ( ( l = listeners.pop() ) )
- l.removeListener();
-
- editable.removeClass( cursorClass );
-
- resizer.removeClass( 'cke_image_resizing' );
- if ( updateData ) {
- widget.setData( { width: newWidth, height: newHeight } );
-
- editor.fire( 'saveSnapshot' );
- }
-
- updateData = false;
- }
- } );
-
- widget.on( 'data', function() {
- resizer[ widget.data.align == 'right' ? 'addClass' : 'removeClass' ]( 'cke_image_resizer_left' );
- } );
- }
-
-
-
-
- function alignCommandIntegrator( editor ) {
- var execCallbacks = [],
- enabled;
- return function( value ) {
- var command = editor.getCommand( 'justify' + value );
-
- if ( !command )
- return;
-
-
- execCallbacks.push( function() {
- command.refresh( editor, editor.elementPath() );
- } );
- if ( value in { right: 1, left: 1, center: 1 } ) {
- command.on( 'exec', function( evt ) {
- var widget = getFocusedWidget( editor );
- if ( widget ) {
- widget.setData( 'align', value );
-
-
- for ( var i = execCallbacks.length; i--; )
- execCallbacks[ i ]();
- evt.cancel();
- }
- } );
- }
- command.on( 'refresh', function( evt ) {
- var widget = getFocusedWidget( editor ),
- allowed = { right: 1, left: 1, center: 1 };
- if ( !widget )
- return;
-
-
-
- if ( enabled === undefined )
- enabled = editor.filter.checkFeature( editor.widgets.registered.image.features.align );
-
- if ( !enabled )
- this.setState( CKEDITOR.TRISTATE_DISABLED );
- else {
- this.setState(
- ( widget.data.align == value ) ? (
- CKEDITOR.TRISTATE_ON
- ) : (
- ( value in allowed ) ? CKEDITOR.TRISTATE_OFF : CKEDITOR.TRISTATE_DISABLED
- )
- );
- }
- evt.cancel();
- } );
- };
- }
- function linkCommandIntegrator( editor ) {
-
- if ( !editor.plugins.link )
- return;
- CKEDITOR.on( 'dialogDefinition', function( evt ) {
- var dialog = evt.data;
- if ( dialog.name == 'link' ) {
- var def = dialog.definition;
- var onShow = def.onShow,
- onOk = def.onOk;
- def.onShow = function() {
- var widget = getFocusedWidget( editor ),
- displayTextField = this.getContentElement( 'info', 'linkDisplayText' ).getElement().getParent().getParent();
-
-
- if ( widget && ( widget.inline ? !widget.wrapper.getAscendant( 'a' ) : 1 ) ) {
- this.setupContent( widget.data.link || {} );
-
- displayTextField.hide();
- } else {
-
-
- displayTextField.show();
- onShow.apply( this, arguments );
- }
- };
-
-
-
-
- def.onOk = function() {
- var widget = getFocusedWidget( editor );
-
-
- if ( widget && ( widget.inline ? !widget.wrapper.getAscendant( 'a' ) : 1 ) ) {
- var data = {};
-
- this.commitContent( data );
-
- widget.setData( 'link', data );
- } else {
- onOk.apply( this, arguments );
- }
- };
- }
- } );
-
- editor.getCommand( 'unlink' ).on( 'exec', function( evt ) {
- var widget = getFocusedWidget( editor );
-
-
- if ( !widget || !widget.parts.link )
- return;
- widget.setData( 'link', null );
-
-
- this.refresh( editor, editor.elementPath() );
- evt.cancel();
- } );
-
- editor.getCommand( 'unlink' ).on( 'refresh', function( evt ) {
- var widget = getFocusedWidget( editor );
- if ( !widget )
- return;
-
-
- this.setState( widget.data.link || widget.wrapper.getAscendant( 'a' ) ?
- CKEDITOR.TRISTATE_OFF : CKEDITOR.TRISTATE_DISABLED );
- evt.cancel();
- } );
- }
-
-
-
-
-
- function getFocusedWidget( editor ) {
- var widget = editor.widgets.focused;
- if ( widget && widget.name == 'image' )
- return widget;
- return null;
- }
-
-
-
-
-
-
- function getWidgetAllowedContent( editor ) {
- var alignClasses = editor.config.image2_chamilo_alignClasses,
- rules = {
-
- div: {
- match: centerWrapperChecker( editor )
- },
- p: {
- match: centerWrapperChecker( editor )
- },
- img: {
- attributes: '!src,alt,width,height',
- styles: 'border-width,border-style,border-color,border-radius,background-color'
- },
- figure: {
- classes: '!' + editor.config.image2_chamilo_captionedClass
- },
- figcaption: true
- };
- if ( alignClasses ) {
-
- rules.div.classes = alignClasses[ 1 ];
- rules.p.classes = rules.div.classes;
-
- rules.img.classes = alignClasses[ 0 ];
- for (var classI = 2; classI <= 11; classI++) {
- rules.img.classes += ',' + alignClasses[ classI ];
- }
- rules.figure.classes += ',' + rules.img.classes;
- } else {
-
- rules.div.styles = 'text-align';
- rules.p.styles = 'text-align';
- rules.img.styles = 'float,vertical-align';
- rules.figure.styles = 'float,display';
- }
- return rules;
- }
-
-
-
-
-
-
-
- function getWidgetFeatures( editor ) {
- var alignClasses = editor.config.image2_chamilo_alignClasses,
- features = {
- dimension: {
- requiredContent: 'img[width,height]'
- },
- align: {
- requiredContent: 'img' +
- ( alignClasses ? '(' + alignClasses[ 0 ] + ')' : '{float,vertica-align}' )
- },
- caption: {
- requiredContent: 'figcaption'
- },
- responsive: {
- requiredContent: 'img'
- },
- borderWidth: {
- requiredContent: 'img{border-width}'
- },
- borderStyle: {
- requiredContent: 'img{border-style}'
- },
- borderColor: {
- requiredContent: 'img{border-color}'
- },
- borderRadius: {
- requiredContent: 'img{border-radius}'
- },
- backgroundColor: {
- requiredContent: 'img{background-color}'
- }
- };
- return features;
- }
-
-
-
-
-
-
- function getStyleableElement( widget ) {
- return widget.data.hasCaption ? widget.element : widget.parts.image;
- }
- } )();
- CKEDITOR.config.image2_chamilo_captionedClass = 'image';
|