@ -1,993 +0,0 @@
/*
* name: MailPoet Form Editor
* author: Jonathan Labreuille
* company: Wysija
* framework: prototype 1.7.2
*/
'use strict' ;
Event . cacheDelegated = { } ;
Object . extend ( document , ( function ( ) {
var cache = Event . cacheDelegated ;
function getCacheForSelector ( selector ) {
return cache [ selector ] = cache [ selector ] || { } ;
}
function getWrappersForSelector ( selector , eventName ) {
var c = getCacheForSelector ( selector ) ;
return c [ eventName ] = c [ eventName ] || [ ] ;
}
function findWrapper ( selector , eventName , handler ) {
var c = getWrappersForSelector ( selector , eventName ) ;
return c . find ( function ( wrapper ) {
return wrapper . handler === handler
} ) ;
}
function destroyWrapper ( selector , eventName , handler ) {
var c = getCacheForSelector ( selector ) ;
if ( ! c [ eventName ] ) return false ;
var wrapper = findWrapper ( selector , eventName , handler )
c [ eventName ] = c [ eventName ] . without ( wrapper ) ;
return wrapper ;
}
function createWrapper ( selector , eventName , handler , context ) {
var wrapper , c = getWrappersForSelector ( selector , eventName ) ;
if ( c . pluck ( 'handler' ) . include ( handler ) ) return false ;
wrapper = function ( event ) {
var element = event . findElement ( selector ) ;
if ( element ) handler . call ( context || element , event , element ) ;
} ;
wrapper . handler = handler ;
c . push ( wrapper ) ;
return wrapper ;
}
return {
delegate : function ( selector , eventName , handler , context ) {
var wrapper = createWrapper . apply ( null , arguments ) ;
if ( wrapper ) document . observe ( eventName , wrapper ) ;
return document ;
} ,
stopDelegating : function ( selector , eventName , handler ) {
var length = arguments . length ;
switch ( length ) {
case 2 :
getWrappersForSelector ( selector , eventName ) . each ( function ( wrapper ) {
document . stopDelegating ( selector , eventName , wrapper . handler ) ;
} ) ;
break ;
case 1 :
Object . keys ( getCacheForSelector ( selector ) ) . each ( function ( eventName ) {
document . stopDelegating ( selector , eventName ) ;
} ) ;
break ;
case 0 :
Object . keys ( cache ) . each ( function ( selector ) {
document . stopDelegating ( selector ) ;
} ) ;
break ;
default :
var wrapper = destroyWrapper . apply ( null , arguments ) ;
if ( wrapper ) document . stopObserving ( eventName , wrapper ) ;
}
return document ;
}
}
} ) ( ) ) ;
var Observable = ( function ( ) {
function getEventName ( name , namespace ) {
name = name . substring ( 2 ) ;
if ( namespace ) name = namespace + ':' + name ;
return name . underscore ( ) . split ( '_' ) . join ( ':' ) ;
}
function getHandlers ( klass ) {
var proto = klass . prototype ,
namespace = proto . namespace ;
return Object . keys ( proto ) . grep ( /^on/ ) . inject ( $H ( ) , function ( handlers , name ) {
if ( name === 'onDomLoaded' ) return handlers ;
handlers . set ( getEventName ( name , namespace ) , getWrapper ( proto [ name ] , klass ) ) ;
return handlers ;
} ) ;
}
function getWrapper ( handler , klass ) {
return function ( event ) {
return handler . call ( new klass ( this ) , event , event . memo ) ;
}
}
function onDomLoad ( selector , klass ) {
$$ ( selector ) . each ( function ( element ) {
new klass ( element ) . onDomLoaded ( ) ;
} ) ;
}
return {
observe : function ( selector ) {
if ( ! this . handlers ) this . handlers = { } ;
if ( this . handlers [ selector ] ) return ;
var klass = this ;
if ( this . prototype . onDomLoaded ) document . loaded ? onDomLoad ( selector , klass ) : document . observe ( 'dom:loaded' , onDomLoad . curry ( selector , klass ) ) ;
this . handlers [ selector ] = getHandlers ( klass ) . each ( function ( handler ) {
document . delegate ( selector , handler . key , handler . value ) ;
} ) ;
} ,
stopObserving : function ( selector ) {
if ( ! this . handlers || ! this . handlers [ selector ] ) return ;
this . handlers [ selector ] . each ( function ( handler ) {
document . stopDelegating ( selector , handler . key , handler . value ) ;
} ) ;
delete this . handlers [ selector ] ;
}
}
} ) ( ) ;
// override droppables
Object . extend ( Droppables , {
deactivate : Droppables . deactivate . wrap ( function ( proceed , drop , draggable ) {
if ( drop . onLeave ) drop . onLeave ( draggable , drop . element ) ;
return proceed ( drop ) ;
} ) ,
activate : Droppables . activate . wrap ( function ( proceed , drop , draggable ) {
if ( drop . onEnter ) drop . onEnter ( draggable , drop . element ) ;
return proceed ( drop ) ;
} ) ,
show : function ( point , element ) {
if ( ! this . drops . length ) return ;
var drop , affected = [ ] ;
this . drops . each ( function ( drop ) {
if ( Droppables . isAffected ( point , element , drop ) ) affected . push ( drop ) ;
} ) ;
if ( affected . length > 0 ) drop = Droppables . findDeepestChild ( affected ) ;
if ( this . last _active && this . last _active !== drop ) this . deactivate ( this . last _active , element ) ;
if ( drop ) {
Position . within ( drop . element , point [ 0 ] , point [ 1 ] ) ;
if ( drop . onHover ) drop . onHover ( element , drop . element , Position . overlap ( drop . overlap , drop . element ) ) ;
if ( drop !== this . last _active ) Droppables . activate ( drop , element ) ;
}
} ,
displayArea : function ( draggable ) {
if ( ! this . drops . length ) return ;
// hide controls when displaying drop areas.
WysijaForm . hideBlockControls ( ) ;
this . drops . each ( function ( drop , iterator ) {
if ( drop . element . hasClassName ( 'block_placeholder' ) ) {
drop . element . addClassName ( 'active' ) ;
}
} ) ;
} ,
hideArea : function ( ) {
if ( ! this . drops . length ) return ;
this . drops . each ( function ( drop , iterator ) {
if ( drop . element . hasClassName ( 'block_placeholder' ) ) {
drop . element . removeClassName ( 'active' ) ;
} else if ( drop . element . hasClassName ( 'image_placeholder' ) ) {
drop . element . removeClassName ( 'active' ) ;
drop . element . up ( ) . removeClassName ( 'active' ) ;
} else if ( drop . element . hasClassName ( 'text_placeholder' ) ) {
drop . element . removeClassName ( 'active' ) ;
}
} ) ;
} ,
reset : function ( draggable ) {
if ( this . last _active ) this . deactivate ( this . last _active , draggable ) ;
}
} ) ;
/*
Wysija History handling
POTENTIAL FEATURES:
- set a maximum number of items to be stored
*/
var WysijaHistory = {
container : 'mailpoet_form_history' ,
size : 30 ,
enqueue : function ( element ) {
// create deep clone (includes child elements) of passed element
var clone = element . clone ( true ) ;
// check if the field is unique
if ( parseInt ( clone . readAttribute ( 'wysija_unique' ) , 10 ) === 1 ) {
// check if the field is already in the queue
$ ( WysijaHistory . container ) . select ( '[wysija_field="' + clone . readAttribute ( 'wysija_field' ) + '"]' ) . invoke ( 'remove' ) ;
}
// check history size
if ( $ ( WysijaHistory . container ) . select ( '> div' ) . length >= WysijaHistory . size ) {
// remove oldest element (last in the list)
$ ( WysijaHistory . container ) . select ( '> div' ) . last ( ) . remove ( ) ;
}
// store block in history
$ ( WysijaHistory . container ) . insert ( { top : clone } ) ;
} ,
dequeue : function ( ) {
// pop last block off the history
var block = $ ( WysijaHistory . container ) . select ( 'div' ) . first ( ) ;
if ( block !== undefined ) {
// insert block back into the editor
$ ( WysijaForm . options . body ) . insert ( { top : block } ) ;
}
} ,
clear : function ( ) {
$ ( WysijaHistory . container ) . innerHTML = '' ;
} ,
remove : function ( field ) {
$ ( WysijaHistory . container ) . select ( '[wysija_field="' + field + '"]' ) . invoke ( 'remove' ) ;
}
} ;
/* MailPoet Form */
var WysijaForm = {
version : '0.6' ,
options : {
container : 'mailpoet_form_container' ,
editor : 'mailpoet_form_editor' ,
body : 'mailpoet_form_body' ,
toolbar : 'mailpoet_form_toolbar' ,
templates : 'wysija_widget_templates' ,
debug : false
} ,
toolbar : {
effect : null ,
x : null ,
y : null ,
top : null ,
left : null
} ,
scroll : {
top : 0 ,
left : 0
} ,
flags : {
doSave : false
} ,
locks : {
dragging : false ,
selectingColor : false ,
showingTools : false
} ,
encodeHtmlValue : function ( str ) {
return str . replace ( /&/g , '&' ) . replace ( />/g , '>' ) . replace ( /</g , '<' ) . replace ( /"/g , '"' ) ;
// ": fix for FileMerge because the previous line fucks up its syntax coloring
} ,
decodeHtmlValue : function ( str ) {
return str . replace ( /&/g , '&' ) . replace ( />/g , '>' ) . replace ( /</g , '<' ) . replace ( /"/g , '"' ) ;
// ": fix for FileMerge because the previous line fucks up its syntax coloring
} ,
loading : function ( is _loading ) {
if ( is _loading ) {
$ ( WysijaForm . options . editor ) . addClassName ( 'loading' ) ;
$ ( WysijaForm . options . toolbar ) . addClassName ( 'loading' ) ;
} else {
$ ( WysijaForm . options . editor ) . removeClassName ( 'loading' ) ;
$ ( WysijaForm . options . toolbar ) . removeClassName ( 'loading' ) ;
}
} ,
loadStatic : function ( blocks ) {
$A ( blocks ) . each ( function ( block ) {
// create block
WysijaForm . Block . create ( block , $ ( 'block_placeholder' ) ) ;
} ) ;
} ,
load : function ( form ) {
if ( form . data === undefined ) return ;
// load body
if ( form . data . body !== undefined ) {
$A ( form . data . body ) . each ( function ( block ) {
// create block
WysijaForm . Block . create ( block , $ ( 'block_placeholder' ) ) ;
} ) ;
// load settings
var settings _elements = $ ( 'mailpoet_form_settings' ) . getElements ( ) ;
settings _elements . each ( function ( setting ) {
// skip lists
if ( setting . name === 'lists' ) {
return true ;
} else if ( setting . name === 'on_success' ) {
// if the input value is equal to the one stored in the settings
if ( setting . value === form . data . settings [ setting . name ] ) {
// check selected value
$ ( setting ) . checked = true ;
}
} else if ( form . data . settings [ setting . name ] !== undefined ) {
if ( typeof form . data . settings [ setting . name ] === 'string' ) {
setting . setValue ( WysijaForm . decodeHtmlValue ( form . data . settings [ setting . name ] ) ) ;
} else {
setting . setValue ( form . data . settings [ setting . name ] ) ;
}
}
} ) ;
}
} ,
save : function ( ) {
var position = 1 ,
data = {
'version' : WysijaForm . version ,
'settings' : $ ( 'mailpoet_form_settings' ) . serialize ( true ) ,
'body' : [ ] ,
'styles' : ( MailPoet . CodeEditor !== undefined ) ? MailPoet . CodeEditor . getValue ( ) : null
} ;
// body
WysijaForm . getBlocks ( ) . each ( function ( b ) {
var block _data = ( typeof ( b . block [ 'save' ] ) === 'function' ) ? b . block . save ( ) : null ;
if ( block _data !== null ) {
// set block position
block _data [ 'position' ] = position ;
// increment position
position ++ ;
// add block data to body
data [ 'body' ] . push ( block _data ) ;
}
} ) ;
return data ;
} ,
init : function ( ) {
// set document scroll
info ( 'init -> set scroll offsets' ) ;
WysijaForm . setScrollOffsets ( ) ;
// position toolbar
info ( 'init -> set toolbar position' ) ;
WysijaForm . setToolbarPosition ( ) ;
// enable droppable targets
info ( 'init -> make droppable' ) ;
WysijaForm . makeDroppable ( ) ;
// enable sortable
info ( 'init -> make sortable' ) ;
WysijaForm . makeSortable ( ) ;
// hide controls
info ( 'init -> hide controls' ) ;
WysijaForm . hideControls ( ) ;
// hide settings
info ( 'init -> hide settings' ) ;
WysijaForm . hideSettings ( ) ;
// set settings buttons position
info ( 'init -> init settings' ) ;
WysijaForm . setSettingsPosition ( ) ;
// toggle widgets
info ( 'init -> toggle widgets' ) ;
WysijaForm . toggleWidgets ( ) ;
} ,
getFieldData : function ( element ) {
// get basic field data
var data = {
type : element . readAttribute ( 'wysija_type' ) ,
field : element . readAttribute ( 'wysija_field' ) ,
name : element . readAttribute ( 'wysija_name' ) ,
unique : parseInt ( element . readAttribute ( 'wysija_unique' ) || 0 , 10 ) ,
static : parseInt ( element . readAttribute ( 'wysija_static' ) || 0 , 10 ) ,
element : element ,
params : ''
} ;
// get params (may be empty)
if ( element . readAttribute ( 'wysija_params' ) !== null && element . readAttribute ( 'wysija_params' ) . length > 0 ) {
data . params = JSON . parse ( element . readAttribute ( 'wysija_params' ) ) ;
}
return data ;
} ,
toggleWidgets : function ( ) {
$$ ( 'a[wysija_unique="1"]' ) . invoke ( 'removeClassName' , 'disabled' ) ;
// loop through each unique field already inserted in the editor and disable its toolbar equivalent
$$ ( '#' + WysijaForm . options . editor + ' [wysija_unique="1"]' ) . each ( function ( element ) {
var field = $$ ( '#' + WysijaForm . options . toolbar + ' [wysija_field="' + element . readAttribute ( 'wysija_field' ) + '"]' ) . first ( ) ;
if ( field !== undefined ) {
field . addClassName ( 'disabled' ) ;
}
} ) ;
// hide list selection if a list widget has been dragged into the editor
$ ( 'mailpoet_settings_list_selection' ) [ ( ( $$ ( '#' + WysijaForm . options . editor + ' [wysija_field="list"]' ) . length > 0 ) === true ) ? 'hide' : 'show' ] ( ) ;
} ,
setBlockPositions : function ( event , target ) {
// release dragging lock
WysijaForm . locks . dragging = false ;
var index = 1 ;
WysijaForm . getBlocks ( ) . each ( function ( container ) {
container . setPosition ( index ++ ) ;
// remove z-index value to avoid issues when resizing images
if ( container [ 'block' ] !== undefined ) {
container . block . element . setStyle ( { zIndex : '' } ) ;
}
} ) ;
if ( target !== undefined ) {
// get placeholders (previous placeholder matches the placeholder linked to the next block)
var block _placeholder = $ ( target . element . readAttribute ( 'wysija_placeholder' ) ) ,
previous _placeholder = target . element . previous ( '.block_placeholder' ) ;
if ( block _placeholder !== null ) {
// put block placeholder before the current block
target . element . insert ( { before : block _placeholder } ) ;
// if the next block is a wysija_block, insert previous placeholder
if ( target . element . next ( ) !== undefined && target . element . next ( ) . hasClassName ( 'mailpoet_form_block' ) && previous _placeholder !== undefined ) {
target . element . insert ( { after : previous _placeholder } ) ;
}
}
}
} ,
setScrollOffsets : function ( ) {
WysijaForm . scroll = document . viewport . getScrollOffsets ( ) ;
} ,
hideSettings : function ( ) {
$ ( WysijaForm . options . container ) . select ( '.wysija_settings' ) . invoke ( 'hide' ) ;
} ,
setSettingsPosition : function ( ) {
// get viewport offsets and dimensions
var viewportHeight = document . viewport . getHeight ( ) ,
blockPadding = 5 ;
$ ( WysijaForm . options . container ) . select ( '.wysija_settings' ) . each ( function ( element ) {
// get parent dimensions and position
var parentDim = element . up ( '.mailpoet_form_block' ) . getDimensions ( ) ,
parentPos = element . up ( '.mailpoet_form_block' ) . cumulativeOffset ( ) ,
is _visible = ( parentPos . top <= ( WysijaForm . scroll . top + viewportHeight ) ) ? true : false ,
buttonMargin = 5 ,
relativeTop = buttonMargin ;
if ( is _visible ) {
// desired position is set to center of viewport
var absoluteTop = parseInt ( WysijaForm . scroll . top + ( ( viewportHeight / 2 ) - ( element . getHeight ( ) / 2 ) ) , 10 ) ,
parentTop = parseInt ( parentPos . top - blockPadding , 10 ) ,
parentBottom = parseInt ( parentPos . top + parentDim . height - blockPadding , 10 ) ;
// always center
relativeTop = parseInt ( ( parentDim . height / 2 ) - ( element . getHeight ( ) / 2 ) , 10 ) ;
}
// set position for button
$ ( element ) . setStyle ( {
left : parseInt ( ( parentDim . width / 2 ) - ( element . getWidth ( ) / 2 ) ) + 'px' ,
top : relativeTop + 'px'
} ) ;
} ) ;
} ,
initToolbarPosition : function ( ) {
if ( WysijaForm . toolbar . top === null ) WysijaForm . toolbar . top = parseInt ( $ ( WysijaForm . options . container ) . positionedOffset ( ) . top ) ;
if ( WysijaForm . toolbar . y === null ) WysijaForm . toolbar . y = parseInt ( WysijaForm . toolbar . top ) ;
if ( isRtl ) {
if ( WysijaForm . toolbar . left === null ) WysijaForm . toolbar . left = 0 ;
} else {
if ( WysijaForm . toolbar . left === null ) WysijaForm . toolbar . left = parseInt ( $ ( WysijaForm . options . container ) . positionedOffset ( ) . left ) ;
}
if ( WysijaForm . toolbar . x === null ) WysijaForm . toolbar . x = parseInt ( WysijaForm . toolbar . left + $ ( WysijaForm . options . container ) . getDimensions ( ) . width + 15 ) ;
} ,
setToolbarPosition : function ( ) {
WysijaForm . initToolbarPosition ( ) ;
var position = { top : WysijaForm . toolbar . y + 'px' , visibility : 'visible' } ;
if ( isRtl ) {
position . right = WysijaForm . toolbar . x + 'px' ;
} else {
position . left = WysijaForm . toolbar . x + 'px' ;
}
$ ( WysijaForm . options . toolbar ) . setStyle ( position ) ;
} ,
updateToolbarPosition : function ( ) {
// init toolbar position (updates scroll and toolbar y)
WysijaForm . initToolbarPosition ( ) ;
// cancel previous effect
if ( WysijaForm . toolbar . effect !== null ) WysijaForm . toolbar . effect . cancel ( ) ;
if ( WysijaForm . scroll . top >= ( WysijaForm . toolbar . top - 20 ) ) {
WysijaForm . toolbar . y = parseInt ( 20 + WysijaForm . scroll . top ) ;
// start effect
WysijaForm . toolbar . effect = new Effect . Move ( WysijaForm . options . toolbar , {
x : WysijaForm . toolbar . x ,
y : WysijaForm . toolbar . y ,
mode : 'absolute' ,
duration : 0.2
} ) ;
} else {
$ ( WysijaForm . options . toolbar ) . setStyle ( {
left : WysijaForm . toolbar . x + 'px' ,
top : WysijaForm . toolbar . top + 'px'
} ) ;
}
} ,
blockDropOptions : {
accept : $w ( 'mailpoet_form_field' ) , // acceptable items (classes array)
onEnter : function ( draggable , droppable ) {
$ ( droppable ) . addClassName ( 'hover' ) ;
} ,
onLeave : function ( draggable , droppable ) {
$ ( droppable ) . removeClassName ( 'hover' ) ;
} ,
onDrop : function ( draggable , droppable ) {
// custom data for images
droppable . fire ( 'wjfe:item:drop' , WysijaForm . getFieldData ( draggable ) ) ;
$ ( droppable ) . removeClassName ( 'hover' ) ;
}
} ,
hideControls : function ( ) {
try {
return WysijaForm . getBlocks ( ) . invoke ( 'hideControls' ) ;
} catch ( e ) { return ; }
} ,
hideTools : function ( ) {
$$ ( '.wysija_tools' ) . invoke ( 'hide' ) ;
WysijaForm . locks . showingTools = false ;
} ,
instances : { } ,
get : function ( element , type ) {
if ( type === undefined ) type = 'block' ;
// identify element
var id = element . identify ( ) ;
var instance = WysijaForm . instances [ id ] || new WysijaForm [ type . capitalize ( ) . camelize ( ) ] ( id ) ;
WysijaForm . instances [ id ] = instance ;
return instance ;
} ,
makeDroppable : function ( ) {
Droppables . add ( 'block_placeholder' , WysijaForm . blockDropOptions ) ;
} ,
makeSortable : function ( ) {
var body = $ ( WysijaForm . options . body ) ;
Sortable . create ( body , {
tag : 'div' ,
only : 'mailpoet_form_block' ,
scroll : window ,
handle : 'handle' ,
constraint : 'vertical'
} ) ;
Draggables . removeObserver ( body ) ;
Draggables . addObserver ( {
element : body ,
onStart : WysijaForm . startBlockPositions ,
onEnd : WysijaForm . setBlockPositions
} ) ;
} ,
hideBlockControls : function ( ) {
$$ ( '.wysija_controls' ) . invoke ( 'hide' ) ;
this . getBlockElements ( ) . invoke ( 'removeClassName' , 'hover' ) ;
} ,
getBlocks : function ( ) {
return WysijaForm . getBlockElements ( ) . map ( function ( element ) {
return WysijaForm . get ( element ) ;
} ) ;
} ,
getBlockElements : function ( ) {
return $ ( WysijaForm . options . container ) . select ( '.mailpoet_form_block' ) ;
} ,
startBlockPositions : function ( event , target ) {
if ( target . element . hasClassName ( 'mailpoet_form_block' ) ) {
// store block placeholder id for the block that is being repositionned
if ( target . element . previous ( '.block_placeholder' ) !== undefined ) {
target . element . writeAttribute ( 'wysija_placeholder' , target . element . previous ( '.block_placeholder' ) . identify ( ) ) ;
}
}
WysijaForm . locks . dragging = true ;
} ,
encodeURIComponent : function ( str ) {
// check if it's a url and if so, prevent encoding of protocol
var regexp = new RegExp ( /^http[s]?:\/\// ) ,
protocol = regexp . exec ( str ) ;
if ( protocol === null ) {
// this is not a url so encode the whole thing
return encodeURIComponent ( str ) . replace ( /[!'()*]/g , escape ) ;
} else if ( protocol . length === 1 ) {
// this is a url, so do not encode the protocol
return encodeURI ( str ) . replace ( /[!'()*]/g , escape ) ;
}
}
} ;
WysijaForm . DraggableItem = Class . create ( {
initialize : function ( element ) {
this . elementType = $ ( element ) . readAttribute ( 'wysija_type' ) ;
this . element = $ ( element ) . down ( ) || $ ( element ) ;
this . clone = this . cloneElement ( ) ;
this . insert ( ) ;
} ,
STYLES : new Template ( 'position: absolute; top: #{top}px; left: #{left}px;' ) ,
cloneElement : function ( ) {
var clone = this . element . clone ( ) ,
offset = this . element . cumulativeOffset ( ) ,
list = this . getList ( ) ,
styles = this . STYLES . evaluate ( {
top : offset . top - list . scrollTop ,
left : offset . left - list . scrollLeft
} ) ;
clone . setStyle ( styles ) ;
clone . addClassName ( 'mailpoet_form_widget' ) ;
clone . addClassName ( this . elementType ) ;
clone . innerHTML = this . element . innerHTML ;
return clone ;
} ,
getOffset : function ( ) {
return this . element . offsetTop - this . getList ( ) . scrollTop ;
} ,
getList : function ( ) {
return this . element . up ( 'ul' ) ;
} ,
insert : function ( ) {
$$ ( "body" ) [ 0 ] . insert ( this . clone ) ;
} ,
onMousedown : function ( event ) {
var draggable = new Draggable ( this . clone , {
scroll : window ,
onStart : function ( ) {
Droppables . displayArea ( draggable ) ;
} ,
onEnd : function ( drag ) {
drag . destroy ( ) ;
drag . element . remove ( ) ;
Droppables . hideArea ( ) ;
} ,
starteffect : function ( element ) {
new Effect . Opacity ( element , {
duration : 0.2 ,
from : element . getOpacity ( ) ,
to : 0.7
} ) ;
} ,
endeffect : Prototype . emptyFunction
} ) ;
draggable . initDrag ( event ) ;
draggable . startDrag ( event ) ;
return draggable ;
}
} ) ;
Object . extend ( WysijaForm . DraggableItem , Observable ) . observe ( 'a[class="mailpoet_form_field"]' ) ;
WysijaForm . Block = Class . create ( {
/* Invoked on load */
initialize : function ( element ) {
info ( 'block -> init' ) ;
this . element = $ ( element ) ;
this . block = new WysijaForm . Widget ( this . element ) ;
// enable block placeholder
this . block . makeBlockDroppable ( ) ;
// setup events
if ( this . block [ 'setup' ] !== undefined ) {
this . block . setup ( ) ;
}
return this ;
} ,
setPosition : function ( position ) {
this . element . writeAttribute ( 'wysija_position' , position ) ;
} ,
hideControls : function ( ) {
if ( this [ 'getControls' ] ) {
this . element . removeClassName ( 'hover' ) ;
this . getControls ( ) . hide ( ) ;
}
} ,
showControls : function ( ) {
if ( this [ 'getControls' ] ) {
this . element . addClassName ( 'hover' ) ;
try {
this . getControls ( ) . show ( ) ;
} catch ( e ) {
;
}
}
} ,
makeBlockDroppable : function ( ) {
if ( this . isBlockDroppableEnabled ( ) === false ) {
var block _placeholder = this . getBlockDroppable ( ) ;
Droppables . add ( block _placeholder . identify ( ) , WysijaForm . blockDropOptions ) ;
block _placeholder . addClassName ( 'enabled' ) ;
}
} ,
removeBlockDroppable : function ( ) {
if ( this . isBlockDroppableEnabled ( ) ) {
var block _placeholder = this . getBlockDroppable ( ) ;
Droppables . remove ( block _placeholder . identify ( ) ) ;
block _placeholder . removeClassName ( 'enabled' ) ;
}
} ,
isBlockDroppableEnabled : function ( ) {
// if the block_placeholder does not exist, create it
var block _placeholder = this . getBlockDroppable ( ) ;
if ( block _placeholder === null ) {
return this . createBlockDroppable ( ) . hasClassName ( 'enabled' ) ;
} else {
return block _placeholder . hasClassName ( 'enabled' ) ;
}
} ,
createBlockDroppable : function ( ) {
info ( 'block -> createBlockDroppable' ) ;
this . element . insert ( { before : '<div class=\"block_placeholder\">' + $ ( 'block_placeholder' ) . innerHTML + '</div>' } ) ;
return this . element . previous ( '.block_placeholder' ) ;
} ,
getBlockDroppable : function ( ) {
if ( this . element . previous ( ) === undefined || this . element . previous ( ) . hasClassName ( 'block_placeholder' ) === false ) {
return null ;
} else {
return this . element . previous ( ) ;
}
} ,
getControls : function ( ) {
return this . element . down ( '.wysija_controls' ) ;
} ,
setupControls : function ( ) {
// enable controls
this . controls = this . getControls ( ) ;
if ( this . controls ) {
// setup events for block controls
this . element . observe ( 'mouseover' , function ( ) {
// special cases where controls shouldn't be displayed
if ( WysijaForm . locks . dragging === true || WysijaForm . locks . selectingColor === true || WysijaForm . locks . showingTools === true ) return ;
// set block flag
this . element . addClassName ( 'hover' ) ;
// show controls
this . showControls ( ) ;
// show settings if present
if ( this . element . down ( '.wysija_settings' ) !== undefined ) {
this . element . down ( '.wysija_settings' ) . show ( ) ;
}
} . bind ( this ) ) ;
this . element . observe ( 'mouseout' , function ( ) {
// special cases where controls shouldn't hide
if ( WysijaForm . locks . dragging === true || WysijaForm . locks . selectingColor === true ) return ;
// hide controls
this . hideControls ( ) ;
// hide settings if present
if ( this . element . down ( '.wysija_settings' ) !== undefined ) {
this . element . down ( '.wysija_settings' ) . hide ( ) ;
}
} . bind ( this ) ) ;
// setup click event for remove button
this . removeButton = this . controls . down ( '.remove' ) || null ;
if ( this . removeButton !== null ) {
this . removeButton . observe ( 'click' , function ( ) {
this . removeBlock ( ) ;
this . removeButton . stopObserving ( 'click' ) ;
} . bind ( this ) ) ;
}
// setup click event for settings button
this . settingsButton = this . element . down ( '.settings' ) || null ;
if ( this . settingsButton !== null ) {
this . settingsButton . observe ( 'click' , function ( event ) {
// TODO: refactor
var block = $ ( event . target ) . up ( '.mailpoet_form_block' ) || null ;
if ( block !== null ) {
var field = WysijaForm . getFieldData ( block ) ;
this . editSettings ( ) ;
}
} . bind ( this ) ) ;
}
}
return this ;
} ,
removeBlock : function ( callback ) {
info ( 'block -> removeBlock' ) ;
// save block in history
WysijaHistory . enqueue ( this . element ) ;
Effect . Fade ( this . element . identify ( ) , {
duration : 0.2 ,
afterFinish : function ( effect ) {
if ( effect . element . next ( '.mailpoet_form_block' ) !== undefined && callback !== false ) {
// show controls of next block to allow mass delete
WysijaForm . get ( effect . element . next ( '.mailpoet_form_block' ) ) . block . showControls ( ) ;
}
// remove placeholder
if ( effect . element . previous ( '.block_placeholder' ) !== undefined ) {
effect . element . previous ( '.block_placeholder' ) . remove ( ) ;
}
// remove element from the DOM
this . element . remove ( ) ;
// reset block positions
WysijaForm . setBlockPositions ( ) ;
// toggle widgets
WysijaForm . toggleWidgets ( ) ;
// optional callback execution after completely removing block
if ( callback !== undefined && typeof ( callback ) === 'function' ) {
callback ( ) ;
}
// remove block instance
delete WysijaForm . instances [ this . element . identify ( ) ] ;
} . bind ( this )
} ) ;
}
} ) ;
/* Invoked on item dropped */
WysijaForm . Block . create = function ( block , target ) {
if ( $ ( 'form_template_' + block . type ) === null ) {
return false ;
}
var body = $ ( WysijaForm . options . body ) ,
block _template = Handlebars . compile ( $ ( 'form_template_block' ) . innerHTML ) ,
template = Handlebars . compile ( $ ( 'form_template_' + block . type ) . innerHTML ) ,
output = '' ;
// set block template (depending on the block type)
block . template = template ( block ) ;
output = block _template ( block ) ;
// check if the new block is unique and if there's already an instance
// of it in the history. If so, remove its former instance from the history
if ( block . unique === 1 ) {
WysijaHistory . remove ( block . field ) ;
}
// if the drop target was the bottom placeholder
if ( target . identify ( ) === 'block_placeholder' ) {
// insert block at the bottom
body . insert ( output ) ;
//block = body.childElements().last();
} else {
// insert block before the drop target
target . insert ( { before : output } ) ;
//block = target.previous('.mailpoet_form_block');
}
// refresh sortable items
WysijaForm . makeSortable ( ) ;
// refresh block positions
WysijaForm . setBlockPositions ( ) ;
// position settings
WysijaForm . setSettingsPosition ( ) ;
} ;
document . observe ( 'wjfe:item:drop' , function ( event ) {
info ( 'create block' ) ;
WysijaForm . Block . create ( event . memo , event . target ) ;
// hide block controls
info ( 'hide controls' ) ;
WysijaForm . hideBlockControls ( ) ;
// toggle widgets
setTimeout ( function ( ) {
WysijaForm . toggleWidgets ( ) ;
} , 1 ) ;
} ) ;
/* Form Widget */
WysijaForm . Widget = Class . create ( WysijaForm . Block , {
initialize : function ( element ) {
info ( 'widget -> init' ) ;
this . element = $ ( element ) ;
return this ;
} ,
setup : function ( ) {
info ( 'widget -> setup' ) ;
this . setupControls ( ) ;
} ,
save : function ( ) {
info ( 'widget -> save' ) ;
var data = this . getData ( ) ;
if ( data . element !== undefined ) {
delete data . element ;
}
return data ;
} ,
setData : function ( data ) {
var current _data = this . getData ( ) ,
params = $H ( current _data . params ) . merge ( data . params ) . toObject ( ) ;
// update type if it changed
if ( data . type !== undefined && data . type !== current _data . type ) {
this . element . writeAttribute ( 'wysija_type' , data . type ) ;
}
// update params
this . element . writeAttribute ( 'wysija_params' , JSON . stringify ( params ) ) ;
} ,
getData : function ( ) {
var data = WysijaForm . getFieldData ( this . element ) ;
// decode params
if ( data . params . length > 0 ) {
data . params = JSON . parse ( data . params ) ;
}
return data ;
} ,
getControls : function ( ) {
return this . element . down ( '.wysija_controls' ) ;
} ,
remove : function ( ) {
this . removeBlock ( ) ;
} ,
redraw : function ( data ) {
// set parameters
this . setData ( data ) ;
var options = this . getData ( ) ;
// redraw block
var block _template = Handlebars . compile ( $ ( 'form_template_block' ) . innerHTML ) ,
template = Handlebars . compile ( $ ( 'form_template_' + options . type ) . innerHTML ) ,
data = $H ( options ) . merge ( { template : template ( options ) } ) . toObject ( ) ;
this . element . replace ( block _template ( data ) ) ;
WysijaForm . init ( ) ;
} ,
editSettings : function ( ) {
MailPoet . Modal . popup ( {
title : 'Edit field settings' , // TODO: translate!
template : jQuery ( '#form_template_field_settings' ) . html ( ) ,
data : this . getData ( ) ,
onSuccess : function ( ) {
var data = jQuery ( '#form_field_settings' ) . serializeObject ( ) ;
this . redraw ( data ) ;
} . bind ( this )
} ) ;
} ,
getSettings : function ( ) {
return this . element . down ( '.wysija_settings' ) ;
}
} ) ;
/* When dom is loaded, initialize WysijaForm */
document . observe ( 'dom:loaded' , WysijaForm . init ) ;
/* LOGGING */
function info ( value ) {
if ( WysijaForm . options . debug === false ) return ;
if ( ! ( window . console && console . log ) ) {
( function ( ) {
var noop = function ( ) { } ;
var methods = [ 'assert' , 'clear' , 'count' , 'debug' , 'dir' , 'dirxml' , 'error' , 'exception' , 'group' , 'groupCollapsed' , 'groupEnd' , 'info' , 'log' , 'markTimeline' , 'profile' , 'profileEnd' , 'markTimeline' , 'table' , 'time' , 'timeEnd' , 'timeStamp' , 'trace' , 'warn' ] ;
var length = methods . length ;
var console = window . console = { } ;
while ( length -- ) {
console [ methods [ length ] ] = noop ;
}
} ( ) ) ;
}
try {
console . log ( '[DEBUG] ' + value ) ;
} catch ( e ) { }
}
Jonathan Labreuille