fix carousel editor panel
This commit is contained in:
Doug Bell
parent
55e6284dd1
commit
bd0911ac97
4 changed files with 293 additions and 249 deletions
|
|
@ -405,7 +405,124 @@ sub getEditForm {
|
||||||
return $tabform;
|
return $tabform;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
# Get a list of all the buttons in this MCE
|
||||||
|
sub getAllButtons {
|
||||||
|
my ( $self ) = @_;
|
||||||
|
my @toolbarRows = map{[split "\n", $self->getValue("toolbarRow$_")]} (1..3);
|
||||||
|
my @toolbarButtons = map{ @{$_} } @toolbarRows;
|
||||||
|
return @toolbarButtons;
|
||||||
|
}
|
||||||
|
|
||||||
|
# Get a hashref of configuration to create this MCE. You must run the code
|
||||||
|
# from getLoadPlugins before you can successfully initialize an MCE. You
|
||||||
|
# must also specify the "elements" key so TinyMCE knows what textarea to
|
||||||
|
# replace.
|
||||||
|
sub getConfig {
|
||||||
|
my ($self) = @_;
|
||||||
|
my $i18n = WebGUI::International->new($self->session, 'Asset_RichEdit');
|
||||||
|
my @plugins;
|
||||||
|
push @plugins, "safari";
|
||||||
|
push @plugins, "contextmenu"
|
||||||
|
if $self->getValue("enableContextMenu");
|
||||||
|
push @plugins, "inlinepopups"
|
||||||
|
if $self->getValue("inlinePopups");
|
||||||
|
push @plugins, "media"
|
||||||
|
if $self->getValue( 'allowMedia' );
|
||||||
|
|
||||||
|
my @toolbarRows = map{[split "\n", $self->getValue("toolbarRow$_")]} (1..3);
|
||||||
|
my @toolbarButtons = map{ @{$_} } @toolbarRows;
|
||||||
|
my %config = (
|
||||||
|
mode => 'exact',
|
||||||
|
theme => "advanced",
|
||||||
|
relative_urls => JSON::false(),
|
||||||
|
remove_script_host => JSON::true(),
|
||||||
|
auto_reset_designmode => JSON::true(),
|
||||||
|
cleanup_callback => "tinyMCE_WebGUI_Cleanup",
|
||||||
|
urlconverter_callback => "tinyMCE_WebGUI_URLConvertor",
|
||||||
|
theme_advanced_resizing => JSON::true(),
|
||||||
|
( map { "theme_advanced_buttons" . ( $_ + 1 ) => ( join ',', @{ $toolbarRows[$_] } ) } ( 0 .. $#toolbarRows ) ),
|
||||||
|
|
||||||
|
ask => JSON::false(),
|
||||||
|
preformatted => $self->getValue("preformatted") ? JSON::true() : JSON::false(),
|
||||||
|
force_br_newlines => $self->getValue("useBr") ? JSON::true() : JSON::false(),
|
||||||
|
force_p_newlines => $self->getValue("useBr") ? JSON::false() : JSON::true(),
|
||||||
|
$self->getValue("useBr") ? ( forced_root_block => JSON::false() ) : (),
|
||||||
|
remove_linebreaks => $self->getValue("removeLineBreaks") ? JSON::true() : JSON::false(),
|
||||||
|
nowrap => $self->getValue("nowrap") ? JSON::true() : JSON::false(),
|
||||||
|
directionality => $self->getValue("directionality"),
|
||||||
|
theme_advanced_toolbar_location => $self->getValue("toolbarLocation"),
|
||||||
|
theme_advanced_statusbar_location => "bottom",
|
||||||
|
valid_elements => $self->getValue("validElements"),
|
||||||
|
wg_userIsVisitor => $self->session->user->isVisitor ? JSON::true() : JSON::false(),
|
||||||
|
);
|
||||||
|
foreach my $button (@toolbarButtons) {
|
||||||
|
if ( $button eq "spellchecker" && $self->session->config->get('availableDictionaries') ) {
|
||||||
|
push( @plugins, "-wgspellchecker" );
|
||||||
|
$config{spellchecker_rpc_url} = $self->session->url->gateway( '', "op=spellCheck" );
|
||||||
|
$config{spellchecker_languages} = join( ',',
|
||||||
|
map { ( $_->{default} ? '+' : '' ) . $_->{name} . '=' . $_->{id} }
|
||||||
|
@{ $self->session->config->get('availableDictionaries') } );
|
||||||
|
}
|
||||||
|
push( @plugins, "table" ) if ( $button eq "tablecontrols" );
|
||||||
|
push( @plugins, "save" ) if ( $button eq "save" );
|
||||||
|
push( @plugins, "advhr" ) if ( $button eq "advhr" );
|
||||||
|
push( @plugins, "fullscreen" ) if ( $button eq "fullscreen" );
|
||||||
|
if ( $button eq "advimage" ) {
|
||||||
|
push( @plugins, "advimage" );
|
||||||
|
$config{external_link_list_url} = "";
|
||||||
|
}
|
||||||
|
if ( $button eq "advlink" ) {
|
||||||
|
$config{external_image_list_url} = "";
|
||||||
|
$config{file_browser_callback} = "mcFileManager.filebrowserCallBack";
|
||||||
|
push( @plugins, "advlink" );
|
||||||
|
}
|
||||||
|
push( @plugins, "emotions" ) if ( $button eq "emotions" );
|
||||||
|
push( @plugins, "iespell" ) if ( $button eq "iespell" );
|
||||||
|
$config{gecko_spellcheck} = 'true' if ( $button eq "iespell" );
|
||||||
|
if ( $button eq "paste" || $button eq "pastetext" || $button eq "pasteword" ) {
|
||||||
|
push( @plugins, "paste" );
|
||||||
|
}
|
||||||
|
if ( $button eq "insertdate" || $button eq "inserttime" || $button eq "insertdatetime" ) {
|
||||||
|
$config{plugin_insertdate_dateFormat} = "%Y-%m-%d";
|
||||||
|
$config{plugin_insertdate_timeFormat} = "%H:%M:%S";
|
||||||
|
push( @plugins, "insertdatetime" );
|
||||||
|
}
|
||||||
|
push( @plugins, "preview" ) if ( $button eq "preview" );
|
||||||
|
if ( $button eq "media" ) {
|
||||||
|
push( @plugins, "media" );
|
||||||
|
}
|
||||||
|
push( @plugins, "searchreplace" )
|
||||||
|
if ( $button eq "search" || $button eq "replace" || $button eq "searchreplace" );
|
||||||
|
push( @plugins, "print" ) if ( $button eq "print" );
|
||||||
|
if ( $button eq "wginsertimage" ) {
|
||||||
|
push @plugins, "-wginsertimage";
|
||||||
|
}
|
||||||
|
if ( $button eq "wgpagetree" ) {
|
||||||
|
push @plugins, "-wgpagetree";
|
||||||
|
}
|
||||||
|
if ( $button eq "wgmacro" ) {
|
||||||
|
push @plugins, "-wgmacro";
|
||||||
|
}
|
||||||
|
if ( $button eq "code" ) {
|
||||||
|
$config{theme_advanced_source_editor_width} = $self->getValue("sourceEditorWidth")
|
||||||
|
if ( $self->getValue("sourceEditorWidth") > 0 );
|
||||||
|
$config{theme_advanced_source_editor_height} = $self->getValue("sourceEditorHeight")
|
||||||
|
if ( $self->getValue("sourceEditorHeight") > 0 );
|
||||||
|
}
|
||||||
|
} ## end foreach my $button (@toolbarButtons)
|
||||||
|
my $language = $i18n->getLanguage( '', "languageAbbreviation" );
|
||||||
|
unless ($language) {
|
||||||
|
$language = $i18n->getLanguage( "English", "languageAbbreviation" );
|
||||||
|
}
|
||||||
|
$config{language} = $language;
|
||||||
|
$config{content_css} = $self->getValue("cssFile")
|
||||||
|
|| $self->session->url->extras('tinymce-webgui/defaultcontent.css');
|
||||||
|
$config{width} = $self->getValue("editorWidth") if ( $self->getValue("editorWidth") > 0 );
|
||||||
|
$config{height} = $self->getValue("editorHeight") if ( $self->getValue("editorHeight") > 0 );
|
||||||
|
$config{plugins} = join( ",", @plugins );
|
||||||
|
|
||||||
|
return \%config;
|
||||||
|
} ## end sub getConfig
|
||||||
|
|
||||||
#-------------------------------------------------------------------
|
#-------------------------------------------------------------------
|
||||||
|
|
||||||
|
|
@ -431,6 +548,33 @@ my $sql = "select asset.assetId, assetData.revisionDate from RichEdit left join
|
||||||
return \%richEditors;
|
return \%richEditors;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
# Get the JS code to load the plugins for this MCE. Needs to be called once
|
||||||
|
# on the page this MCE will be on
|
||||||
|
sub getLoadPlugins {
|
||||||
|
my ( $self ) = @_;
|
||||||
|
my %loadPlugins;
|
||||||
|
for my $button ( $self->getAllButtons ) {
|
||||||
|
if ( $button eq 'spellchecker' ) {
|
||||||
|
$loadPlugins{wgspellchecker} = $self->session->url->extras("tinymce-webgui/plugins/wgspellchecker/editor_plugin.js");
|
||||||
|
}
|
||||||
|
if ( $button eq 'wginsertimage' ) {
|
||||||
|
$loadPlugins{wginsertimage} = $self->session->url->extras("tinymce-webgui/plugins/wginsertimage/editor_plugin.js");
|
||||||
|
}
|
||||||
|
if ( $button eq 'wgpagetree' ) {
|
||||||
|
$loadPlugins{wgpagetree} = $self->session->url->extras("tinymce-webgui/plugins/wgpagetree/editor_plugin.js");
|
||||||
|
}
|
||||||
|
if ( $button eq 'wgmacro' ) {
|
||||||
|
$loadPlugins{wgmacro} = $self->session->url->extras("tinymce-webgui/plugins/wgmacro/editor_plugin.js");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
my $out = '';
|
||||||
|
while (my ($plugin, $path) = each %loadPlugins) {
|
||||||
|
$out .= "tinymce.PluginManager.load('$plugin', '$path');\n";
|
||||||
|
}
|
||||||
|
return $out;
|
||||||
|
}
|
||||||
|
|
||||||
#-------------------------------------------------------------------
|
#-------------------------------------------------------------------
|
||||||
|
|
||||||
=head2 getToolbar ( )
|
=head2 getToolbar ( )
|
||||||
|
|
@ -464,114 +608,11 @@ sub getRichEditor {
|
||||||
my $self = shift;
|
my $self = shift;
|
||||||
return '' if ($self->getValue('disableRichEditor'));
|
return '' if ($self->getValue('disableRichEditor'));
|
||||||
my $nameId = shift;
|
my $nameId = shift;
|
||||||
my @plugins;
|
|
||||||
my %loadPlugins;
|
|
||||||
push @plugins, "safari";
|
|
||||||
push @plugins, "contextmenu"
|
|
||||||
if $self->getValue("enableContextMenu");
|
|
||||||
push @plugins, "inlinepopups"
|
|
||||||
if $self->getValue("inlinePopups");
|
|
||||||
push @plugins, "media"
|
|
||||||
if $self->getValue( 'allowMedia' );
|
|
||||||
|
|
||||||
my @toolbarRows = map{[split "\n", $self->getValue("toolbarRow$_")]} (1..3);
|
|
||||||
my @toolbarButtons = map{ @{$_} } @toolbarRows;
|
|
||||||
my $i18n = WebGUI::International->new($self->session, 'Asset_RichEdit');
|
my $i18n = WebGUI::International->new($self->session, 'Asset_RichEdit');
|
||||||
my $ask = $self->getValue("askAboutRichEdit");
|
my $ask = $self->getValue("askAboutRichEdit");
|
||||||
my %config = (
|
|
||||||
mode => $ask ? "none" : "exact",
|
|
||||||
elements => $nameId,
|
|
||||||
theme => "advanced",
|
|
||||||
relative_urls => JSON::false(),
|
|
||||||
remove_script_host => JSON::true(),
|
|
||||||
auto_reset_designmode => JSON::true(),
|
|
||||||
cleanup_callback => "tinyMCE_WebGUI_Cleanup",
|
|
||||||
urlconverter_callback => "tinyMCE_WebGUI_URLConvertor",
|
|
||||||
theme_advanced_resizing => JSON::true(),
|
|
||||||
(map { "theme_advanced_buttons".($_+1) => (join ',', @{$toolbarRows[$_]}) }
|
|
||||||
(0..$#toolbarRows)),
|
|
||||||
#ask => $self->getValue("askAboutRichEdit") ? JSON::true() : JSON::false(),
|
|
||||||
ask => JSON::false(),
|
|
||||||
preformatted => $self->getValue("preformatted") ? JSON::true() : JSON::false(),
|
|
||||||
force_br_newlines => $self->getValue("useBr") ? JSON::true() : JSON::false(),
|
|
||||||
force_p_newlines => $self->getValue("useBr") ? JSON::false() : JSON::true(),
|
|
||||||
$self->getValue("useBr") ? ( forced_root_block => JSON::false() ) : (),
|
|
||||||
remove_linebreaks => $self->getValue("removeLineBreaks") ? JSON::true() : JSON::false(),
|
|
||||||
nowrap => $self->getValue("nowrap") ? JSON::true() : JSON::false(),
|
|
||||||
directionality => $self->getValue("directionality"),
|
|
||||||
theme_advanced_toolbar_location => $self->getValue("toolbarLocation"),
|
|
||||||
theme_advanced_statusbar_location => "bottom",
|
|
||||||
valid_elements => $self->getValue("validElements"),
|
|
||||||
wg_userIsVisitor => $self->session->user->isVisitor ? JSON::true() : JSON::false(),
|
|
||||||
);
|
|
||||||
# if ($ask) {
|
# if ($ask) {
|
||||||
# $config{oninit} = 'turnOffTinyMCE_'.$nameId;
|
# $config{oninit} = 'turnOffTinyMCE_'.$nameId;
|
||||||
# }
|
# }
|
||||||
foreach my $button (@toolbarButtons) {
|
|
||||||
if ($button eq "spellchecker" && $self->session->config->get('availableDictionaries')) {
|
|
||||||
push(@plugins,"-wgspellchecker");
|
|
||||||
$loadPlugins{wgspellchecker} = $self->session->url->extras("tinymce-webgui/plugins/wgspellchecker/editor_plugin.js");
|
|
||||||
$config{spellchecker_rpc_url} = $self->session->url->gateway('', "op=spellCheck");
|
|
||||||
$config{spellchecker_languages} =
|
|
||||||
join(',', map { ($_->{default} ? '+' : '').$_->{name}.'='.$_->{id} } @{$self->session->config->get('availableDictionaries')});
|
|
||||||
}
|
|
||||||
push(@plugins,"table") if ($button eq "tablecontrols");
|
|
||||||
push(@plugins,"save") if ($button eq "save");
|
|
||||||
push(@plugins,"advhr") if ($button eq "advhr");
|
|
||||||
push(@plugins,"fullscreen") if ($button eq "fullscreen");
|
|
||||||
if ($button eq "advimage") {
|
|
||||||
push(@plugins,"advimage");
|
|
||||||
$config{external_link_list_url} = "";
|
|
||||||
}
|
|
||||||
if ($button eq "advlink") {
|
|
||||||
$config{external_image_list_url} = "";
|
|
||||||
$config{file_browser_callback} = "mcFileManager.filebrowserCallBack";
|
|
||||||
push(@plugins,"advlink");
|
|
||||||
}
|
|
||||||
push(@plugins,"emotions") if ($button eq "emotions");
|
|
||||||
push(@plugins,"iespell") if ($button eq "iespell");
|
|
||||||
$config{gecko_spellcheck} = 'true' if ($button eq "iespell");
|
|
||||||
if ($button eq "paste" || $button eq "pastetext" || $button eq "pasteword") {
|
|
||||||
push(@plugins,"paste");
|
|
||||||
}
|
|
||||||
if ($button eq "insertdate" || $button eq "inserttime" || $button eq "insertdatetime") {
|
|
||||||
$config{plugin_insertdate_dateFormat} = "%Y-%m-%d";
|
|
||||||
$config{plugin_insertdate_timeFormat} = "%H:%M:%S";
|
|
||||||
push(@plugins,"insertdatetime");
|
|
||||||
}
|
|
||||||
push(@plugins,"preview") if ($button eq "preview");
|
|
||||||
if ($button eq "media") {
|
|
||||||
push(@plugins,"media");
|
|
||||||
}
|
|
||||||
push(@plugins,"searchreplace") if ($button eq "search" || $button eq "replace" || $button eq "searchreplace");
|
|
||||||
push(@plugins,"print") if ($button eq "print");
|
|
||||||
if ($button eq "wginsertimage") {
|
|
||||||
push @plugins, "-wginsertimage";
|
|
||||||
$loadPlugins{wginsertimage} = $self->session->url->extras("tinymce-webgui/plugins/wginsertimage/editor_plugin.js");
|
|
||||||
}
|
|
||||||
if ($button eq "wgpagetree") {
|
|
||||||
push @plugins, "-wgpagetree";
|
|
||||||
$loadPlugins{wgpagetree} = $self->session->url->extras("tinymce-webgui/plugins/wgpagetree/editor_plugin.js");
|
|
||||||
}
|
|
||||||
if ($button eq "wgmacro") {
|
|
||||||
push @plugins, "-wgmacro";
|
|
||||||
$loadPlugins{wgmacro} = $self->session->url->extras("tinymce-webgui/plugins/wgmacro/editor_plugin.js");
|
|
||||||
}
|
|
||||||
if ($button eq "code") {
|
|
||||||
$config{theme_advanced_source_editor_width} = $self->getValue("sourceEditorWidth") if ($self->getValue("sourceEditorWidth") > 0);
|
|
||||||
$config{theme_advanced_source_editor_height} = $self->getValue("sourceEditorHeight") if ($self->getValue("sourceEditorHeight") > 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
my $language = $i18n->getLanguage('' ,"languageAbbreviation");
|
|
||||||
unless ($language) {
|
|
||||||
$language = $i18n->getLanguage("English","languageAbbreviation");
|
|
||||||
}
|
|
||||||
$config{language} = $language;
|
|
||||||
$config{content_css} = $self->getValue("cssFile") || $self->session->url->extras('tinymce-webgui/defaultcontent.css');
|
|
||||||
$config{width} = $self->getValue("editorWidth") if ($self->getValue("editorWidth") > 0);
|
|
||||||
$config{height} = $self->getValue("editorHeight") if ($self->getValue("editorHeight") > 0);
|
|
||||||
$config{plugins} = join(",",@plugins);
|
|
||||||
|
|
||||||
$self->session->style->setScript($self->session->url->extras('yui/build/yahoo/yahoo-min.js'),{type=>"text/javascript"});
|
$self->session->style->setScript($self->session->url->extras('yui/build/yahoo/yahoo-min.js'),{type=>"text/javascript"});
|
||||||
$self->session->style->setScript($self->session->url->extras('yui/build/event/event-min.js'),{type=>"text/javascript"});
|
$self->session->style->setScript($self->session->url->extras('yui/build/event/event-min.js'),{type=>"text/javascript"});
|
||||||
$self->session->style->setScript($self->session->url->extras('tinymce/jscripts/tiny_mce/tiny_mce_src.js'),{type=>"text/javascript"});
|
$self->session->style->setScript($self->session->url->extras('tinymce/jscripts/tiny_mce/tiny_mce_src.js'),{type=>"text/javascript"});
|
||||||
|
|
@ -597,10 +638,15 @@ EOHTML1
|
||||||
#}
|
#}
|
||||||
#YAHOO.util.Event.onDOMReady(turnOffTinyMCE_$nameId);
|
#YAHOO.util.Event.onDOMReady(turnOffTinyMCE_$nameId);
|
||||||
}
|
}
|
||||||
while (my ($plugin, $path) = each %loadPlugins) {
|
|
||||||
$out .= "tinymce.PluginManager.load('$plugin', '$path');\n";
|
my $config = $self->getConfig;
|
||||||
|
$config->{ elements } = $nameId;
|
||||||
|
if ( $ask ) {
|
||||||
|
$config->{mode} = "none";
|
||||||
}
|
}
|
||||||
$out .= "\ttinyMCE.init(" . JSON->new->pretty->encode(\%config) . " );\n";
|
|
||||||
|
$out .= $self->getLoadPlugins;
|
||||||
|
$out .= "\ttinyMCE.init(" . JSON->new->pretty->encode( $config ) . " );\n";
|
||||||
$out .= "</script>";
|
$out .= "</script>";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -108,10 +108,20 @@ sub getEditForm {
|
||||||
my $tabform = $self->SUPER::getEditForm();
|
my $tabform = $self->SUPER::getEditForm();
|
||||||
my $i18n = WebGUI::International->new($self->session, "Asset_Carousel");
|
my $i18n = WebGUI::International->new($self->session, "Asset_Carousel");
|
||||||
|
|
||||||
|
$self->session->style->setScript($self->session->url->extras('yui/build/yahoo-dom-event/yahoo-dom-event.js'), {type =>
|
||||||
|
'text/javascript'});
|
||||||
|
$self->session->style->setScript($self->session->url->extras('yui/build/element/element-min.js'), {type =>
|
||||||
|
'text/javascript'});
|
||||||
|
$self->session->style->setScript($self->session->url->extras('yui/build/tabview/tabview-min.js'), {type =>
|
||||||
|
'text/javascript'});
|
||||||
$self->session->style->setScript($self->session->url->extras('yui/build/editor/editor-min.js'), {type =>
|
$self->session->style->setScript($self->session->url->extras('yui/build/editor/editor-min.js'), {type =>
|
||||||
'text/javascript'});
|
'text/javascript'});
|
||||||
|
$self->session->style->setScript($self->session->url->extras('yui/build/json/json-min.js'), {type =>
|
||||||
|
'text/javascript'});
|
||||||
$self->session->style->setLink($self->session->url->extras('yui/build/editor/assets/skins/sam/editor.css'), {type
|
$self->session->style->setLink($self->session->url->extras('yui/build/editor/assets/skins/sam/editor.css'), {type
|
||||||
=>'text/css', rel=>'stylesheet'});
|
=>'text/css', rel=>'stylesheet'});
|
||||||
|
$self->session->style->setLink($self->session->url->extras('yui/build/tabview/assets/skins/sam/tabview.css'), {type
|
||||||
|
=>'text/css', rel=>'stylesheet'});
|
||||||
$self->session->style->setScript($self->session->url->extras('wobject/Carousel/carousel.js'), {type =>
|
$self->session->style->setScript($self->session->url->extras('wobject/Carousel/carousel.js'), {type =>
|
||||||
'text/javascript'});
|
'text/javascript'});
|
||||||
|
|
||||||
|
|
@ -120,56 +130,30 @@ sub getEditForm {
|
||||||
.' <td class="formDescription" valign="top" style="width: 180px;"><label for="item1">'
|
.' <td class="formDescription" valign="top" style="width: 180px;"><label for="item1">'
|
||||||
.$i18n->get("items label").'</label><div class="wg-hoverhelp">'.$i18n->get("items description").'</div></td>'
|
.$i18n->get("items label").'</label><div class="wg-hoverhelp">'.$i18n->get("items description").'</div></td>'
|
||||||
.' <td id="items_td" valign="top" class="tableData">'
|
.' <td id="items_td" valign="top" class="tableData">'
|
||||||
.' <input type="button" value="Add item" onClick="javascript:addItem()"></input><br />'
|
.' <input type="hidden" id="items_formId" name="items" />'
|
||||||
|
.' <input type="button" value="Add item" onclick="window.carouselEditor.addTab()"></input><br />'
|
||||||
." <br />\n";
|
." <br />\n";
|
||||||
|
|
||||||
$tabform->getTab("properties")->raw($tableRowStart);
|
$tabform->getTab("properties")->raw($tableRowStart);
|
||||||
|
|
||||||
if($self->getValue('items')){
|
|
||||||
my @items = @{JSON->new->decode($self->getValue('items'))->{items}};
|
|
||||||
|
|
||||||
foreach my $item (@items){
|
my $richedit = WebGUI::Asset->newByDynamicClass( $self->session, $self->session->setting->get('richEditor') );
|
||||||
my $itemNr = $item->{sequenceNumber};
|
my $config = JSON->new->encode( $richedit->getConfig );
|
||||||
my $itemHTML = "<div id='item_div".$itemNr."' name='item_div_".$itemNr."'>\n"
|
my $loadMcePlugins = $richedit->getLoadPlugins;
|
||||||
."<span>\n"
|
my $items = $self->get('items') ? JSON->new->decode($self->get('items'))->{items} : [];
|
||||||
.$i18n->get("id label").'<div class="wg-hoverhelp">'.$i18n->get("id description").'</div>: '
|
$items = JSON->new->encode( $items );
|
||||||
.'<input type="text" id="itemId'.$itemNr.'" '
|
my $i18n = JSON->new->encode( { "delete" => $i18n->get("delete") } );
|
||||||
.'name="itemId_'.$itemNr.'" value="'.$item->{itemId}.'">'
|
|
||||||
."</span>\n"
|
|
||||||
."<input type='button' id='deleteItem".$itemNr."' value='Delete this item'
|
|
||||||
onClick='javascript:deleteItem(this.id)'></input>\n"
|
|
||||||
.'<textarea id="item'.$itemNr.'" name="item_'.$itemNr.'" '
|
|
||||||
.'class="carouselItemText" rows="#" cols="#" '
|
|
||||||
.'style="width: 500px; height: 80px;">'.$item->{text}."</textarea><br />\n";
|
|
||||||
|
|
||||||
$itemHTML .=
|
$tabform->getTab('properties')->raw(<<"ENDHTML");
|
||||||
" <script type='text/javascript'>\n"
|
<div id="carouselEditor"></div>
|
||||||
.'var myEditor'.$itemNr.' '
|
<script type="text/javascript">
|
||||||
.'= new YAHOO.widget.SimpleEditor("item'.$itemNr.'", '
|
$loadMcePlugins
|
||||||
."{height: '80px', width: '500px', handleSubmit: true});\n"
|
YAHOO.util.Event.onDOMReady( function() {
|
||||||
.'myEditor'.$itemNr.".render()\n"
|
window.carouselEditor = new WebGUI.Carousel.Editor( "carouselEditor", $config, $items, $i18n );
|
||||||
."</script>\n"
|
} );
|
||||||
."</div>\n";
|
</script>
|
||||||
$tabform->getTab("properties")->raw($itemHTML);
|
ENDHTML
|
||||||
}
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
my $itemHTML = "<div id='item_div1' name='item_div_1'>\n"
|
|
||||||
."<span>\n"
|
|
||||||
.$i18n->get("id label").'<div class="wg-hoverhelp">'.$i18n->get("id description").'</div>: '
|
|
||||||
.' <input type="text" id="itemId1" name="itemId_1" value="carousel_item_1">'
|
|
||||||
."</span>\n"
|
|
||||||
."<input type='button' id='deleteItem1' value='Delete this item' onClick='javascript:deleteItem(this.id)'></input>\n"
|
|
||||||
.'<textarea id="item1" name="item_1" class="carouselItemText" rows="#" cols="#" '
|
|
||||||
."style='width: 500px; height: 80px;'></textarea><br />\n";
|
|
||||||
|
|
||||||
$itemHTML .=
|
|
||||||
"<script type='text/javascript'>\n"
|
|
||||||
."var myEditor1 = new YAHOO.widget.SimpleEditor('item1', {height: '80px', width: '500px', handleSubmit: true});\n"
|
|
||||||
."myEditor1.render()\n"
|
|
||||||
."</script>\n";
|
|
||||||
$tabform->getTab("properties")->raw($itemHTML);
|
|
||||||
}
|
|
||||||
my $tableRowEnd = qq|
|
my $tableRowEnd = qq|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
@ -213,32 +197,10 @@ Used to process properties from the form posted.
|
||||||
sub processPropertiesFromFormPost {
|
sub processPropertiesFromFormPost {
|
||||||
my $self = shift;
|
my $self = shift;
|
||||||
my $form = $self->session->form;
|
my $form = $self->session->form;
|
||||||
my (@items,$items);
|
|
||||||
$self->SUPER::processPropertiesFromFormPost(@_);
|
$self->SUPER::processPropertiesFromFormPost(@_);
|
||||||
|
|
||||||
foreach my $param ($form->param) {
|
my $items = JSON->new->decode( $form->get("items") );
|
||||||
if ($param =~ m/^item_/){
|
$self->update({ items => JSON->new->encode({ items => $items }) });
|
||||||
my $sequenceNumber = $param;
|
|
||||||
$sequenceNumber =~ s/^item_//;
|
|
||||||
if($form->process('itemId_'.$sequenceNumber)){
|
|
||||||
push(@items,{
|
|
||||||
sequenceNumber => $sequenceNumber,
|
|
||||||
text => $form->process($param),
|
|
||||||
itemId => $form->process('itemId_'.$sequenceNumber),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
my @sortedItems = sort { $a->{sequenceNumber} cmp $b->{sequenceNumber} } @items;
|
|
||||||
@items = ();
|
|
||||||
for (my $i=0; $i<scalar @sortedItems; $i++) {
|
|
||||||
$sortedItems[$i]->{sequenceNumber} = $i + 1;
|
|
||||||
push(@items,$sortedItems[$i]);
|
|
||||||
}
|
|
||||||
|
|
||||||
$items = JSON->new->encode({items => \@items});
|
|
||||||
$self->update({items => $items});
|
|
||||||
return undef;
|
return undef;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -51,6 +51,12 @@ our $I18N = {
|
||||||
context => q|Description of the carousel template field, used as hover help.|
|
context => q|Description of the carousel template field, used as hover help.|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
'delete' => {
|
||||||
|
message => q{Delete},
|
||||||
|
lastUpdated => 0,
|
||||||
|
context => q{Label for button to delete an item from the carousel},
|
||||||
|
},
|
||||||
|
|
||||||
'slideHeight' => {
|
'slideHeight' => {
|
||||||
message => q|The height set for each slide in the Carousel|,
|
message => q|The height set for each slide in the Carousel|,
|
||||||
lastUpdated => 0,
|
lastUpdated => 0,
|
||||||
|
|
|
||||||
|
|
@ -1,77 +1,107 @@
|
||||||
function addItem () {
|
|
||||||
var items_td = document.getElementById('items_td');
|
|
||||||
var textAreas = items_td.getElementsByClassName('carouselItemText');
|
|
||||||
var textAreaCount = textAreas.length;
|
|
||||||
var newItemNumber = textAreaCount + 1;
|
|
||||||
|
|
||||||
var Dom = YAHOO.util.Dom;
|
if ( typeof WebGUI == 'undefined' ) {
|
||||||
var myConfig = {
|
WebGUI = {};
|
||||||
height: '80px',
|
}
|
||||||
width: '500px',
|
if ( typeof WebGUI.Carousel == 'undefined' ) {
|
||||||
handleSubmit: true
|
WebGUI.Carousel = {};
|
||||||
};
|
|
||||||
|
|
||||||
var newItem_div = document.createElement('div');
|
|
||||||
newItem_div.id = 'item_div'+newItemNumber;
|
|
||||||
newItem_div.name = 'item_div_'+newItemNumber;
|
|
||||||
items_td.appendChild(newItem_div);
|
|
||||||
|
|
||||||
var newItem_textarea = document.createElement('textarea');
|
|
||||||
newItem_textarea.id = 'item'+newItemNumber;
|
|
||||||
newItem_textarea.name = 'item_'+newItemNumber;
|
|
||||||
newItem_textarea.className = 'carouselItemText';
|
|
||||||
|
|
||||||
var newItem_id_span = document.createElement('span');
|
|
||||||
newItem_id_span.innerHTML = 'ID: <input type="text" id="newItem_id" name="itemId" value="">';
|
|
||||||
newItem_div.appendChild(newItem_id_span);
|
|
||||||
|
|
||||||
var newItem_id = document.getElementById('newItem_id');
|
|
||||||
newItem_id.type = 'text';
|
|
||||||
newItem_id.id = 'itemId'+newItemNumber;
|
|
||||||
newItem_id.name = 'itemId_'+newItemNumber;
|
|
||||||
newItem_id.value = 'carousel_item_'+newItemNumber;
|
|
||||||
|
|
||||||
var newItem_deleteButton = document.createElement('input');
|
|
||||||
newItem_deleteButton.type = 'button';
|
|
||||||
newItem_deleteButton.id = 'deleteItem'+newItemNumber;
|
|
||||||
newItem_deleteButton.value = 'Delete this item';
|
|
||||||
newItem_deleteButton.onclick = function(){deleteItem(this.id)};
|
|
||||||
newItem_div.appendChild(newItem_deleteButton);
|
|
||||||
|
|
||||||
newItem_div.appendChild(newItem_textarea);
|
|
||||||
|
|
||||||
var newItem_break = document.createElement('br');
|
|
||||||
newItem_div.appendChild(newItem_break);
|
|
||||||
|
|
||||||
var myEditor = new YAHOO.widget.SimpleEditor('item'+newItemNumber, myConfig);
|
|
||||||
myEditor.render();
|
|
||||||
}
|
}
|
||||||
function resetItemIds() {
|
|
||||||
var items_td = document.getElementById('items_td');
|
|
||||||
var textAreas = items_td.getElementsByClassName('carouselItemText');
|
|
||||||
for (i=0;i<textAreas.length;i=i+1) {
|
|
||||||
var oldId = textAreas[i].id.substring(4);
|
|
||||||
var newId = i + 1;
|
|
||||||
if(newId != oldId){
|
|
||||||
var newTextareaId = 'item' + newId;
|
|
||||||
var newTextareaName = 'item_' + newId;
|
|
||||||
document.getElementById('item'+oldId).name = newTextareaName;
|
|
||||||
document.getElementById('item'+oldId).id = newTextareaId;
|
|
||||||
|
|
||||||
var newIdInputId = 'itemId' + newId;
|
WebGUI.Carousel.Editor
|
||||||
var newIdInputName = 'itemId_' + newId;
|
= function ( id, mceConfig, items, i18n ) {
|
||||||
document.getElementById('itemId'+oldId).name = newIdInputName;
|
this.id = id;
|
||||||
document.getElementById('itemId'+oldId).id = newIdInputId;
|
this.mceConfig = mceConfig;
|
||||||
|
this.items = items;
|
||||||
|
this.i18n = i18n;
|
||||||
|
|
||||||
var newDivId = 'item_div' + newId;
|
// Initialize a tabview
|
||||||
document.getElementById('item_div'+oldId).id = newDivId;
|
this.tabView = new YAHOO.widget.TabView( this.id, {
|
||||||
textAreas[i].id = newId;
|
orientation : "left"
|
||||||
}
|
} );
|
||||||
|
|
||||||
|
// Add a tab for each item
|
||||||
|
for ( var i = 0; i < this.items.length; i++ ) {
|
||||||
|
this.addTab( this.items[i] );
|
||||||
}
|
}
|
||||||
}
|
|
||||||
function deleteItem(deleteId){
|
// We're new!
|
||||||
var itemDiv = document.getElementById(deleteId).parentNode;
|
if ( this.items.length == 0 ) {
|
||||||
itemDiv.parentNode.removeChild(itemDiv);
|
this.addTab( );
|
||||||
resetItemIds();
|
}
|
||||||
}
|
|
||||||
|
// Find the form and eventize it!
|
||||||
|
var form = document.getElementById( this.id );
|
||||||
|
while ( form.tagName != "FORM" ) {
|
||||||
|
form = form.parentNode;
|
||||||
|
}
|
||||||
|
YAHOO.util.Event.on( form, 'submit', this.handleSubmit, this, true );
|
||||||
|
};
|
||||||
|
|
||||||
|
WebGUI.Carousel.Editor.prototype.addTab
|
||||||
|
= function ( data ) {
|
||||||
|
var num = this.tabView.get('tabs').length + 1;
|
||||||
|
if ( !data ) {
|
||||||
|
data = { text : "", itemId : 'carousel_item_' + num };
|
||||||
|
}
|
||||||
|
|
||||||
|
var tab = new YAHOO.widget.Tab( {
|
||||||
|
label : num,
|
||||||
|
content : ''
|
||||||
|
} );
|
||||||
|
this.tabView.addTab( tab );
|
||||||
|
this.tabView.selectTab( num - 1 );
|
||||||
|
|
||||||
|
var el = tab.get('contentEl');
|
||||||
|
|
||||||
|
var delBtn = document.createElement( 'input' );
|
||||||
|
delBtn.type = "button";
|
||||||
|
delBtn.style.cssFloat = "right";
|
||||||
|
delBtn.value = this.i18n['delete'];
|
||||||
|
YAHOO.util.Event.on( delBtn, "click", function(){
|
||||||
|
this.tabView.removeTab( tab );
|
||||||
|
}, this, true );
|
||||||
|
el.appendChild( delBtn );
|
||||||
|
|
||||||
|
var input = document.createElement( 'input' );
|
||||||
|
input.type = "text";
|
||||||
|
input.value = data.itemId;
|
||||||
|
el.appendChild( document.createTextNode( "ID: " ) );
|
||||||
|
el.appendChild( input );
|
||||||
|
|
||||||
|
var ta = document.createElement( 'textarea' );
|
||||||
|
ta.className = "carouselInput";
|
||||||
|
ta.name = "carouselInput" + num;
|
||||||
|
ta.id = ta.name;
|
||||||
|
ta.style.height = "300px";
|
||||||
|
ta.appendChild( document.createTextNode( data.text ) );
|
||||||
|
el.appendChild( ta );
|
||||||
|
|
||||||
|
var conf = this.mceConfig;
|
||||||
|
conf.mode = "exact";
|
||||||
|
conf.elements = ta.name;
|
||||||
|
|
||||||
|
tinyMCE.init( conf );
|
||||||
|
};
|
||||||
|
|
||||||
|
WebGUI.Carousel.Editor.prototype.handleSubmit
|
||||||
|
= function ( ) {
|
||||||
|
var tabs = this.tabView.get('tabs');
|
||||||
|
var items = [];
|
||||||
|
for ( var i = 0; i < tabs.length; i++ ) {
|
||||||
|
var item = { };
|
||||||
|
var tab = tabs[i];
|
||||||
|
var elem = tab.get('contentEl');
|
||||||
|
|
||||||
|
var id = elem.getElementsByTagName( 'input' )[1];
|
||||||
|
item.itemId = id.value;
|
||||||
|
|
||||||
|
var text = elem.getElementsByTagName( 'textarea' )[0];
|
||||||
|
item.text = text.value;
|
||||||
|
|
||||||
|
item.sequenceNumber = i;
|
||||||
|
|
||||||
|
items.push( item );
|
||||||
|
}
|
||||||
|
var json = YAHOO.lang.JSON.stringify( items );
|
||||||
|
document.getElementById( 'items_formId' ).value = json;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue