diff --git a/README.txt b/README.txt index 401e50d..38a1133 100644 --- a/README.txt +++ b/README.txt @@ -1,12 +1,12 @@ -The Embedded Help module allows administrators to create help tags directly -above fields in the back-end. This is useful for sites where admins would -like to provide content writers and editors with on-page assistance -regarding how best to use specific fields, or what an option means. These -help tags can compliment and re-enforce existing consolidated documentation +The Embedded Help module allows administrators to create help tags directly +above fields in the back-end. This is useful for sites where admins would +like to provide content writers and editors with on-page assistance +regarding how best to use specific fields, or what an option means. These +help tags can compliment and re-enforce existing consolidated documentation (e.g. Advanced Help pages). -Embedded Help tags can be be several different types (help, info, or warning) +Embedded Help tags can be be several different types (help, info, or warning) and display styles (clickable icon, expandable teaser, or full text). Help tags can be created on the following pages: @@ -19,32 +19,32 @@ Help tags can be created on the following pages: Installation ------------ -Place this folder and all subfolders into your modules directory (e.g. +Place this folder and all subfolders into your modules directory (e.g. sites/all/modules/embedded_help) -Enable the Embedded Help module from Drupal's module list (admin/modules in +Enable the Embedded Help module from Drupal's module list (admin/modules in Drupal 7). -Set the appropriate permissions. Embedded Help creates two permissions: One for -viewing embedded help tags, and another for modifying them. Note that both +Set the appropriate permissions. Embedded Help creates two permissions: One for +viewing embedded help tags, and another for modifying them. Note that both must be checked for a user to be able to create/modify tags. How to use Embedded Fields -------------------------- -Once installed, users with permission to view & modify tags will see a small -"Edit Help Tags" link in the top right of each form. Clicking on that link will -reveal individual "Add Help Tag" or "Edit Help Tag" links above each field. +Once installed, users with permission to view & modify tags will see a small +"Edit Help Tags" link in the top right of each form. Clicking on that link will +reveal individual "Add Help Tag" or "Edit Help Tag" links above each field. Clicking on one of those links will bring up the "Modify Help Tag" dialog. -The title is optional, but recommended (it looks better, in the developer's +The title is optional, but recommended (it looks better, in the developer's humble opinion). -The message type (Help, Info, or Warning) determines the icon and background +The message type (Help, Info, or Warning) determines the icon and background color of the message. -The display style determines whether the user must click on a help icon -to view the message (Clickable Icon), click on a "...read more" link to expand -the message if it's longer than several lines (Expandable Teaser), or is -presented with the entire message regardless of length (Full Text). The "Full -Text" option is recommended for important tags, such as warnings. \ No newline at end of file +The display style determines whether the user must click on a help icon +to view the message (Clickable Icon), click on a "...read more" link to expand +the message if it's longer than several lines (Expandable Teaser), or is +presented with the entire message regardless of length (Full Text). The "Full +Text" option is recommended for important tags, such as warnings. diff --git a/css/embedded_help_forms.css b/css/embedded_help_forms.css new file mode 100644 index 0000000..2782eb7 --- /dev/null +++ b/css/embedded_help_forms.css @@ -0,0 +1,127 @@ +#embedded-help-add-tag-form { + display: none; +} + +form.embedded-help .form-item:before { + content: ''; +} + +#edit-help-tag-submit { + display: none; +} + +.embedded-help-insert, .embedded-help-show-links { + color: #ddd; + font-style: italic; + font-size: 9px; + display: none; +} + +.embedded-help-insert:hover, .embedded-help-show-links:hover { + cursor: pointer; + color: #aaa; +} + +.embedded-help-show-links { + display: block; + text-align: right; +} + +.embedded-help-tag { + background: #fafafa; + border: 1px solid #eee; + display: block; + padding: 5px; + background-repeat: no-repeat; + background-position: 5px 5px; + position: relative; +} + +.embedded-help-hidden { + display: none !important; +} + +.embedded-help-tag-title { + padding-left: 40px; + font-weight: bold; +} + +.embedded-help-tag-text { + padding-left: 40px; + color: #333; +} + +.embedded-help-message-type-help { + background-image: url(../images/message-16-help.png); +} + +.embedded-help-message-type-info { + background-image: url(../images/message-16-info.png); +} + +.embedded-help-message-type-warning { + background-color: #FFFCE5; + background-image: url(../images/message-16-warning.png); + border-color: #EEDD55; +} + +.embedded-help-display-style-icon { + padding: 5px; + width: 20px; + height: 20px; + background-color: transparent; + overflow: hidden; + border: none; + cursor: pointer; + float: right; + margin-top: -2px; +} + +.embedded-help-display-style-icon-open { + cursor: pointer; +} + +.embedded-help-display-style-teaser { + max-height: 60px; + overflow: hidden; +} + +.embedded-help-display-style-teaser-expanded { + max-height: none; +} + +.embedded-help-display-style-full { +} + +.embedded-help-more-button { + position: absolute; + bottom: 0; + right: 0; + font-size: 9px; + line-height: 11px; + background: #eaeaea; + border: 1px solid #eee; + border-radius: 5px 0 0; + -moz-border-radius: 5px 0 0; + -webkit-border-radius: 5px 0 0; + -o-border-radius: 5px 0 0; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -o-box-sizing: border-box; + padding: 3px; + z-index: 1; + cursor: pointer; +} + +div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] .ui-dialog-titlebar { + background: #000; + color: #fff; +} + +div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] input[type='text'], +div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] select, +div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] textarea, +div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] > div { + width: 98%; +} diff --git a/css/forms.css b/css/forms.css deleted file mode 100644 index 4bfcd90..0000000 --- a/css/forms.css +++ /dev/null @@ -1,129 +0,0 @@ -#embedded-help-add-tag-form{ - display:none; -} - -form.embedded-help .form-item:before{ - content:''; -} - -#edit-help-tag-submit{ - display:none; -} - -.embedded-help-insert, .embedded-help-show-links{ - color:#ddd; - font-style: italic; - font-size:9px; - display:none; -} - -.embedded-help-insert:hover, .embedded-help-show-links:hover{ - cursor:pointer; - color:#aaa; -} - -.embedded-help-show-links{ - display:block; - text-align:right; -} - -.embedded-help-tag{ - background:#fafafa; - border:1px solid #eee; - display: block; - padding:5px; - background-repeat: no-repeat; - background-position: 5px 5px; - position:relative; -} - -.embedded-help-hidden{ - display:none !important; -} - -.embedded-help-tag-title{ - padding-left:40px; - font-weight:bold; -} - -.embedded-help-tag-text{ - padding-left:40px; - color:#333; -} - -.embedded-help-message-type-help{ - background-image: url(../images/message-16-help.png); -} - -.embedded-help-message-type-info{ - background-image: url(../images/message-16-info.png); -} - -.embedded-help-message-type-warning{ - background-color:#FFFCE5; - background-image: url(../images/message-16-warning.png); - border-color:#EEDD55; -} - -.embedded-help-display-style-icon{ - padding:5px; - width:20px; - height:20px; - background-color:transparent; - overflow:hidden; - border:none; - cursor:pointer; - float:right; - margin-top:-2px; -} - -.embedded-help-display-style-icon-open{ - cursor:pointer; -} - -.embedded-help-display-style-teaser{ - max-height: 60px; - overflow: hidden; -} - -.embedded-help-display-style-teaser-expanded{ - max-height:none; -} - -.embedded-help-display-style-full{ -} - -.embedded-help-more-button{ - position:absolute; - bottom:0px; - right:0px; - font-size:9px; - line-height:11px; - background:#eaeaea; - border:1px solid #eee; - border-radius: 5px 0 0; - -moz-border-radius: 5px 0 0; - -webkit-border-radius: 5px 0 0; - -o-border-radius: 5px 0 0; - box-sizing:border-box; - -moz-box-sizing:border-box; - -webkit-box-sizing:border-box; - -o-box-sizing:border-box; - padding:3px; - z-index:1; - cursor:pointer; -} - - -div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] .ui-dialog-titlebar { - background:#000; - color:#fff; -} - -div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] input[type='text'], -div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] select, -div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] textarea, -div[aria-labelledby='ui-dialog-title-embedded-help-dialog'] > div -{ - width:98%; -} \ No newline at end of file diff --git a/embedded_help.info b/embedded_help.info index 81befd5..421f03e 100644 --- a/embedded_help.info +++ b/embedded_help.info @@ -1,7 +1,5 @@ name = Embedded Help description = Provides an interface for creating help tags that are embedded directly into forms and are attached to specific fields. core = 7.x -files[] = embedded_help.module -files[] = embedded_help.install -scripts[] = js/form_alter.js -stylesheets[all][] = css/forms.css +scripts[] = js/embedded_help_form_alter.js +stylesheets[all][] = css/embedded_help_forms.css diff --git a/embedded_help.install b/embedded_help.install index b21d5f6..1d79afa 100644 --- a/embedded_help.install +++ b/embedded_help.install @@ -1,22 +1,9 @@ array( - 'title' => t('Modify Embedded Help Tags'), + 'title' => t('Modify embedded help tags'), //'description' => t('Allow users to modify embedded help tags'), ), 'view embedded help tags' => array( - 'title' => t('View Embedded Help Tags'), + 'title' => t('View embedded help tags'), //'description' => t('Allow users to modify embedded help tags'), - ) + ), ); } /** * Implements hook_page_build(). - * - * Adds jQuery UI dialog library to the page, and adds the "Modify Help Tag" + * + * Adds jQuery UI dialog library to the page, and adds the 'Modify help tag' * form. */ function embedded_help_page_build(&$page) { - drupal_add_library('system', 'ui.dialog'); - if ( user_access('view embedded help tags') ) { + if (user_access('view embedded help tags')) { $page['content']['embedded_help']['form'] = drupal_get_form('embedded_help_add_tag_form'); } } /** - * Returns the "Modify Help Tag" form, called by embedded_help_page_build(). + * Returns the 'Modify help tag' form, called by embedded_help_page_build(). */ function embedded_help_add_tag_form($form, &$form_state) { $form = array(); $form['help_tag_title'] = array( '#type' => 'textfield', - '#title' => t("Title"), - '#description' => t("Optional"), + '#title' => t('Title'), + '#description' => t('Optional'), '#required' => FALSE, ); $form['help_tag_text'] = array( '#type' => 'textarea', - '#title' => t("Help Tag Text"), + '#title' => t('Help tag text'), '#required' => TRUE, ); $form['help_tag_message_type'] = array( '#type' => 'select', - '#title' => 'Message Type', + '#title' => 'Message type', '#options' => array( 'help' => 'Help', 'info' => 'Info', 'warning' => 'Warning' - ) + ), ); $form['help_tag_display_style'] = array( '#type' => 'select', - '#title' => 'Display Style', + '#title' => 'Display style', '#options' => array( - 'icon' => 'Clickable Icon', - 'teaser' => 'Expandable Teaser', - 'full' => 'Full Text' - ) + 'icon' => 'Clickable icon', + 'teaser' => 'Expandable teaser', + 'full' => 'Full text' + ), ); $form['help_tag_target_form'] = array( '#type' => 'hidden', @@ -84,43 +84,41 @@ function embedded_help_add_tag_form($form, &$form_state) { ); $form['help_tag_submit'] = array( '#type' => 'submit', - '#value' => t("Submit") + '#value' => t('Submit'), ); - + return $form; } /** - * Writes/updates the database when the user submits the "Modify Help Tag" - * form + * Writes/updates the database when the user submits the 'Modify help tag' form */ function embedded_help_add_tag_form_submit($form_data) { - if ( user_access('modify embedded help tags') ) { + if (user_access('modify embedded help tags')) { $title = $form_data['help_tag_title']['#value']; $text = $form_data['help_tag_text']['#value']; $message_type = $form_data['help_tag_message_type']['#value']; $display_style = $form_data['help_tag_display_style']['#value']; - $targetForm = $form_data['help_tag_target_form']['#value']; - $targetField = $form_data['help_tag_target_field']['#value']; - + $target_form = $form_data['help_tag_target_form']['#value']; + $target_field = $form_data['help_tag_target_field']['#value']; + // ACTION: Filter text into HTML - $text = htmlspecialchars($text); - $text = nl2br($text); + $text = nl2br(htmlspecialchars($text)); // ACTION: Check if a DB entry exists for this field: $db_name = 'embedded_help'; - $query = db_select($db_name, 'db'); - $query->addField('db', 'id'); - $query->condition('form_id', $targetForm); - $query->condition('field_name', $targetField); - $results = $query->execute(); - $dbEntry = $results->fetchObject(); - if ( empty($dbEntry) ) { + $query = db_select($db_name, 'db') + ->addField('db', 'id') + ->condition('form_id', $target_form) + ->condition('field_name', $target_field) + ->execute(); + $entry = $query->fetchObject(); + if (empty($entry)) { // ACTION: Insert new database entry: $query = db_insert($db_name); $query->fields(array( - 'form_id' => $targetForm, - 'field_name' => $targetField, + 'form_id' => $target_form, + 'field_name' => $target_field, 'title' => $title, 'text' => $text, 'message_type' => $message_type, @@ -128,71 +126,74 @@ function embedded_help_add_tag_form_submit($form_data) { )); $results = $query->execute(); if ($results == 1) { - drupal_set_message(t('Help Tag Added.')); + drupal_set_message(t('Help tag added.')); } - } + } else { /// ACTION: Update database entry: - $query = db_update($db_name); - $query->fields(array( - 'form_id' => $targetForm, - 'field_name' => $targetField, - 'title' => $title, - 'text' => $text, - 'message_type' => $message_type, - 'display_style' => $display_style - )); - $query->condition('form_id', $targetForm); - $query->condition('field_name', $targetField); + $query = db_update($db_name) + ->fields(array( + 'form_id' => $target_form, + 'field_name' => $target_field, + 'title' => $title, + 'text' => $text, + 'message_type' => $message_type, + 'display_style' => $display_style + )) + ->condition('form_id', $target_form) + ->condition('field_name', $target_field); $results = $query->execute(); if ($results === 1) { - drupal_set_message(t('Help Tag Updated.')); + drupal_set_message(t('Help tag updated.')); } - } // END: If statement for insert|update - } // END: If statement for user access check -} // END: embedded_help_add_tag_form_submit function + } + } +} /** * Implements hook_form_alter(). - * - * Retrieves help tag data for relevant forms and embeds it in a hidden form + * + * Retrieves help tag data for relevant forms and embeds it in a hidden form * field as JSON (for jQuery retrieval and manipulation). */ function embedded_help_form_alter(&$form, &$form_state, $form_id) { $eligible_page = FALSE; - if (arg(0) === 'admin') { + $arg = arg(); + if ($arg[0] === 'admin') { $eligible_page = TRUE; - } - elseif (arg(0) === 'node' && arg(1) === 'add') { + } + elseif ($arg[0] === 'node' && $arg[1] === 'add') { $eligible_page = TRUE; - } - elseif (arg(0) === 'node' && arg(2) === 'edit') { + } + elseif ($arg[0] === 'node' && $arg[2] === 'edit') { $eligible_page = TRUE; - } - elseif (arg(0) === 'user' && arg(2) === 'edit') { + } + elseif ($arg[0] === 'user' && $arg[2] === 'edit') { $eligible_page = TRUE; } - if ($eligible_page && $form_id !== 'embedded_help_add_tag_form' - && user_access('view embedded help tags') ) { - $classes = 'embedded-help'; - if ( user_access('modify embedded help tags') ) { - $classes .= ' embedded-help-modifiable'; + + if (!$eligible_page) { + return; + } + + if ($form_id !== 'embedded_help_add_tag_form' && user_access('view embedded help tags')) { + $form['#attributes']['class'][] = 'embedded-help'; + if (user_access('modify embedded help tags')) { + $form['#attributes']['class'][] = 'embedded-help-modifiable'; } - $form['#attributes']['class'][] = $classes; - $db_name = 'embedded_help'; - $css_form_id = str_replace('_', '-', $form_id); - $results = db_select($db_name, 'meh') + + $results = db_select('embedded_help', 'meh') ->fields('meh') - ->condition('form_id', $css_form_id) + ->condition('form_id', str_replace('_', '-', $form_id)) ->execute(); + $help_tags = array(); while ($record = $results->fetchAssoc()) { $help_tags[$record['field_name']] = $record; } - $help_tags_json = json_encode($help_tags); $form['embedded_help_data'] = array( '#type' => 'hidden', - '#value' => $help_tags_json + '#value' => json_encode($help_tags), ); } } diff --git a/js/embedded_help_form_alter.js b/js/embedded_help_form_alter.js new file mode 100644 index 0000000..3411fc7 --- /dev/null +++ b/js/embedded_help_form_alter.js @@ -0,0 +1,135 @@ +jQuery(document).ready(function($){ + // ACTION: Initialize dialog form as jQuery dialog box. + var addTagForm = $('#embedded-help-add-tag-form').dialog({ + title:'Modify Help Tag', + autoOpen: false, + resizable: false, + width: '400px', + buttons:{ + 'OK': function() { + $('#edit-help-tag-submit').trigger('click'); + }, + 'Cancel': function() { + $(this).dialog('close'); + } + } + }) + + + $('form').each(function(){ + if( $(this).hasClass('embedded-help-modifiable') ){ + // ACTION: Create form-level "Modify Help Tags" link: + var thisForm = $(this).attr('id'); + var formInsert = $('
', { + id: thisForm + '-modify-embedded-help', + //class: 'embedded-help-show-links', + targetform: thisForm, + html: 'Modify Help Tags' + }); + formInsert.addClass('embedded-help-show-links'); + $(this).prepend(formInsert); + // ACTION: Create field-level "Add Help Tag" links: + $('#' + thisForm + '.embedded-help .form-item').each(function(){ + var formField = $('input, select, textarea',this); + var formFieldId = formField.attr('id'); + var thisInsert = $('
', { + id: formFieldId + '-help-tag-insert', + //class: 'embedded-help-insert', + targetform: thisForm, + targetfield: formFieldId, + html: 'Add Help Tag' + }); + thisInsert.addClass('embedded-help-insert'); + var thisTag = $('
', { + id: formFieldId + '-help-tag', + //class: 'embedded-help-tag embedded-help-hidden', + targetform: thisForm, + targetfield: formFieldId, + html: '' + }); + thisTag.addClass('embedded-help-tag embedded-help-hidden'); + $(this).prepend(thisInsert); + $(this).prepend(thisTag); + }) // END: Each loop for form items + } // ENDIF + + // ACTION: Get this form's JSON data from page and use it to create + // existing help tags: + var helpTagJson = $('input[name="embedded_help_data"]', this).attr('value'); + var helpTagData = $.parseJSON(helpTagJson); + for(var helpTagKey in helpTagData){ + var helpTag = helpTagData[helpTagKey]; + var fieldName = '#' + helpTag.field_name + '-help-tag'; + var title = $('
', { + //class: 'embedded-help-tag-title', + html: helpTag.title + }).appendTo(fieldName); + title.addClass('embedded-help-tag-title'); + var text = $('
', { + //class: 'embedded-help-tag-text', + html: helpTag.text + }).appendTo(fieldName); + text.addClass('embedded-help-tag-text'); + $(fieldName).attr('message_type',helpTag.message_type); + $(fieldName).attr('display_style',helpTag.display_style); + $(fieldName).addClass('embedded-help-message-type-' + helpTag.message_type + + ' embedded-help-display-style-' + helpTag.display_style); + $(fieldName).removeClass('embedded-help-hidden'); + $(fieldName+'-insert').html('Edit Help Tag'); + + if(helpTag.display_style === 'icon'){ + $(fieldName).toggle( + function(){ + $(this).removeClass('embedded-help-display-style-icon'); + }, + function(){ + $(this).addClass('embedded-help-display-style-icon'); + } + ) + } + } + + }) // END: Each loop for each form + + $('.embedded-help-show-links').click(function(){ + var targetForm = $(this).attr('targetform'); + $('#' + targetForm + ' .embedded-help-insert').toggle(500); + }) + + // ACTION: Setup & Display dialog box: + $('.embedded-help-insert').click(function(){ + //var fieldId = $(this).attr('id'); + var targetField = $(this).attr('targetfield'); + var targetForm = $(this).attr('targetform'); + var currentTag = $('#' + targetForm + ' #' + targetField + '-help-tag'); + var currentTitle = $('.embedded-help-tag-title', currentTag).html(); + var currentText = $('.embedded-help-tag-text', currentTag).html(); + if ( currentText == null) { + currentText = ''; + } + currentText = currentText.replace(/&/g,'&'); + currentText = currentText.replace(/</g,'<').replace(/>/g,'>'); + currentText = currentText.replace(/
|
|/g, ''); + var currentMessageType = currentTag.attr('message_type'); + var currentDisplayStyle = currentTag.attr('display_style'); + //var currentMessageType = $('.embedded-help-message-type', currentTag); + //var currentDisplayStyle = $('.embedded-help-tag-title', currentTag); + $('#embedded-help-add-tag-form input[name="help_tag_title"]').val(currentTitle); + $('#embedded-help-add-tag-form textarea[name="help_tag_text"]').val(currentText); + $('#embedded-help-add-tag-form select[name="help_tag_message_type"]').val(currentMessageType); + $('#embedded-help-add-tag-form select[name="help_tag_display_style"]').val(currentDisplayStyle); + $('#embedded-help-add-tag-form input[name="help_tag_target_form"]').val(targetForm); + $('#embedded-help-add-tag-form input[name="help_tag_target_field"]').val(targetField); + addTagForm.dialog('open'); + }) // END: Click function + + // ACTION: Style "Expandable teaser" display + var teaserTags = $(".embedded-help-display-style-teaser"); + var moreButton = $('
', { + html: '... read more' + }).appendTo(teaserTags); + moreButton.addClass('embedded-help-more-button'); + moreButton.click(function(){ + $(this).parent().toggleClass('embedded-help-display-style-teaser-expanded'); + }) +}) diff --git a/js/form_alter.js b/js/form_alter.js deleted file mode 100644 index db8092d..0000000 --- a/js/form_alter.js +++ /dev/null @@ -1,135 +0,0 @@ -jQuery(document).ready(function($){ - // ACTION: Initialize dialog form as jQuery dialog box. - var addTagForm = $('#embedded-help-add-tag-form').dialog({ - title:'Modify Help Tag', - autoOpen: false, - resizable: false, - width: '400px', - buttons:{ - 'OK': function() { - $('#edit-help-tag-submit').trigger('click'); - }, - 'Cancel': function() { - $(this).dialog('close'); - } - } - }) - - - $('form').each(function(){ - if( $(this).hasClass('embedded-help-modifiable') ){ - // ACTION: Create form-level "Modify Help Tags" link: - var thisForm = $(this).attr('id'); - var formInsert = $('
', { - id: thisForm + '-modify-embedded-help', - //class: 'embedded-help-show-links', - targetform: thisForm, - html: 'Modify Help Tags' - }); - formInsert.addClass('embedded-help-show-links'); - $(this).prepend(formInsert); - // ACTION: Create field-level "Add Help Tag" links: - $('#' + thisForm + '.embedded-help .form-item').each(function(){ - var formField = $('input, select, textarea',this); - var formFieldId = formField.attr('id'); - var thisInsert = $('
', { - id: formFieldId + '-help-tag-insert', - //class: 'embedded-help-insert', - targetform: thisForm, - targetfield: formFieldId, - html: 'Add Help Tag' - }); - thisInsert.addClass('embedded-help-insert'); - var thisTag = $('
', { - id: formFieldId + '-help-tag', - //class: 'embedded-help-tag embedded-help-hidden', - targetform: thisForm, - targetfield: formFieldId, - html: '' - }); - thisTag.addClass('embedded-help-tag embedded-help-hidden'); - $(this).prepend(thisInsert); - $(this).prepend(thisTag); - }) // END: Each loop for form items - } // ENDIF - - // ACTION: Get this form's JSON data from page and use it to create - // existing help tags: - var helpTagJson = $('input[name="embedded_help_data"]', this).attr('value'); - var helpTagData = $.parseJSON(helpTagJson); - for(var helpTagKey in helpTagData){ - var helpTag = helpTagData[helpTagKey]; - var fieldName = '#' + helpTag.field_name + '-help-tag'; - var title = $('
', { - //class: 'embedded-help-tag-title', - html: helpTag.title - }).appendTo(fieldName); - title.addClass('embedded-help-tag-title'); - var text = $('
', { - //class: 'embedded-help-tag-text', - html: helpTag.text - }).appendTo(fieldName); - text.addClass('embedded-help-tag-text'); - $(fieldName).attr('message_type',helpTag.message_type); - $(fieldName).attr('display_style',helpTag.display_style); - $(fieldName).addClass('embedded-help-message-type-' + helpTag.message_type + - ' embedded-help-display-style-' + helpTag.display_style); - $(fieldName).removeClass('embedded-help-hidden'); - $(fieldName+'-insert').html('Edit Help Tag'); - - if(helpTag.display_style === 'icon'){ - $(fieldName).toggle( - function(){ - $(this).removeClass('embedded-help-display-style-icon'); - }, - function(){ - $(this).addClass('embedded-help-display-style-icon'); - } - ) - } - } - - }) // END: Each loop for each form - - $('.embedded-help-show-links').click(function(){ - var targetForm = $(this).attr('targetform'); - $('#' + targetForm + ' .embedded-help-insert').toggle(500); - }) - - // ACTION: Setup & Display dialog box: - $('.embedded-help-insert').click(function(){ - //var fieldId = $(this).attr('id'); - var targetField = $(this).attr('targetfield'); - var targetForm = $(this).attr('targetform'); - var currentTag = $('#' + targetForm + ' #' + targetField + '-help-tag'); - var currentTitle = $('.embedded-help-tag-title', currentTag).html(); - var currentText = $('.embedded-help-tag-text', currentTag).html(); - if ( currentText == null) { - currentText = ''; - } - currentText = currentText.replace(/&/g,'&'); - currentText = currentText.replace(/</g,'<').replace(/>/g,'>'); - currentText = currentText.replace(/
|
|/g, ''); - var currentMessageType = currentTag.attr('message_type'); - var currentDisplayStyle = currentTag.attr('display_style'); - //var currentMessageType = $('.embedded-help-message-type', currentTag); - //var currentDisplayStyle = $('.embedded-help-tag-title', currentTag); - $('#embedded-help-add-tag-form input[name="help_tag_title"]').val(currentTitle); - $('#embedded-help-add-tag-form textarea[name="help_tag_text"]').val(currentText); - $('#embedded-help-add-tag-form select[name="help_tag_message_type"]').val(currentMessageType); - $('#embedded-help-add-tag-form select[name="help_tag_display_style"]').val(currentDisplayStyle); - $('#embedded-help-add-tag-form input[name="help_tag_target_form"]').val(targetForm); - $('#embedded-help-add-tag-form input[name="help_tag_target_field"]').val(targetField); - addTagForm.dialog('open'); - }) // END: Click function - - // ACTION: Style "Expandable teaser" display - var teaserTags = $(".embedded-help-display-style-teaser"); - var moreButton = $('
', { - html: '... read more' - }).appendTo(teaserTags); - moreButton.addClass('embedded-help-more-button'); - moreButton.click(function(){ - $(this).parent().toggleClass('embedded-help-display-style-teaser-expanded'); - }) -}) \ No newline at end of file