developers
/
Orbit
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

commit for survey questions

This commit is contained in:
Harry Bomrah 2013-09-17 11:30:30 +08:00 committed by saurabhbhatia
parent e45b7e09a0
commit e4a16eab3a
6 changed files with 458 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/assets/javascripts/lib/member/textarea-lang-btn.js
View File

@ -1,4 +1,4 @@
$(function() {
function textareaResizable() {
var $btnW = null,
$textareaLangBtnGroup = $('.textarea-lang > .btn-group'),
$textareaLang = $('.textarea-lang'),
@ -8,12 +8,12 @@ $(function() {
$btnW = 4
$(this).find('.btn').each(function() {
$btnW += $(this).outerWidth(true);
$(this).on('click', function() {
$(this).on(clickEvent, function() {
var $id = $($(this).attr('href'));
if($id.find('.ui-wrapper').height() < 96) {
$id.find('.ui-wrapper').height(96)
}
})
};
});
});
});
$textarea.each(function() {
@ -26,4 +26,7 @@ $(function() {
minWidth: $btnW+114,
handles: "se",
});
};
$(function() {
textareaResizable();
});

11
app/assets/stylesheets/lib/main-forms.css
View File

@ -280,6 +280,17 @@
line-height: 26px;
margin: 0;
}
.main-forms .attributes-header h4 b {
padding: 0 1px;
border-style: dotted;
border-width: 0 2px;
border-color: #AAA;
margin-right: 5px;
cursor: move;
}
.main-forms .attributes-header h4 i {
cursor: pointer;
}
.main-forms .field-type {
background-color: #f5f5f5;
border-radius: 5px;

6
vendor/built_in_modules/survey/app/assets/javascripts/jquery-ui-custom.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

143
vendor/built_in_modules/survey/app/assets/javascripts/survey.js vendored Normal file
View File

@ -0,0 +1,143 @@
// Check Questions Length
function checkQuestionsLength() {
var questionsLength = $('.questions > .attributes').length;
if(questionsLength == 1) {
$('.questions .delete').addClass('hide');
} else {
$('.questions .delete').removeClass('hide');
};
};
// Role Attribute Template Data
function setData(l, length, optionsI, className) {
if(!optionsI) {
optionsI = 0;
}
var id = "survey_survey_questions_attributes_",
name = "survey[survey_questions_attributes][",
optionID = l+"_survey_question_options_attributes_"+optionsI+"_name_translations_",
optionName = l+"][survey_question_options_attributes]["+optionsI+"][name_translations]",
radiogroupsID = l+"_survey_question_radiogroups_attributes_"+optionsI+"_name_translations_",
radiogroupsName = l+"][survey_question_radiogroups_attributes]["+optionsI+"][name_translations]";
data = {
_l: l,
_length: length,
_className: className,
_destroy: [id+l+"_destroy", name+l+"][_destroy]"],
_sequence : [id+l+"_sequence",name+l+"][sequence]"],
_title_translations: [id+l+"_title_translations", name+l+"][title_translations]", "questions_title_"+l],
_description_translations: [id+l+"_description_translations", name+l+"][description_translations]", "questions_depiction_"+l],
_type: [id+l+"_type", name+l+"][type]"],
_is_required: [id+l+"_is_required", name+l+"][is_required]"],
_option: [id+optionID, name+optionName, "attributes_"+l+"_options_"+optionsI+"_"],
_radiogroups: [id+radiogroupsID, name+radiogroupsName, "attributes_"+l+"_radiogroups_"+optionsI+"_"],
_custom_option: [id+l+"_custom_option", name+l+"][custom_option]"]
};
return data;
};
function inputAppendLength(element, length) {
if(length == 2) {
element.closest('.add-target').find('.remove-input').addClass('hide').prev().addClass('last');
}
element.closest('.input-append').remove();
}
$(function() {
var l = $('.questions > .attributes').length || 0;
if($('#survey_redirect_mode').prop('checked')) {
$('.questions').fadeOut(300);
$('.redirect-url').fadeIn(300);
} else {
$('.questions').fadeIn(300);
$('.redirect-url').fadeOut(300);
};
$('#survey_redirect_mode').change(function(event) {
if($(this).prop('checked')) {
$('.questions').fadeOut(300);
$('.redirect-url').fadeIn(300);
} else {
$('.questions').fadeIn(300);
$('.redirect-url').fadeOut(300);
}
});
$('.field-type').each(function() {
$(this).children('.control-group').each(function() {
$(this).data().index = $(this).find('.input-append').length
});
});
$('.add-target').each(function() {
if($(this).children('.input-append').length == 1) {
$(this).find('.remove-input').addClass('hide').prev().addClass('last');
};
});
$('.add-question').on(clickEvent, function(event) {
$('#template-survery').tmpl(setData(l, $('.questions > .attributes').length + 1)).appendTo($('.questions'));
checkQuestionsLength();
textareaResizable(); // from textarea-lang-btn.js
l += 1;
});
$('.questions').on('change', '.type-selector', function(event) {
$(this).children("option:selected").each(function () {
var $fieldType = $(this).closest('.control-group').siblings('.field-type'),
_val = $(this).val(),
_index = $(this).closest('.attributes').data().index;
if(_val < 2) {
$fieldType.fadeOut(300);
} else {
$fieldType.fadeIn(300);
if(_val < 5) {
$fieldType.find('.rgl, hr').addClass('hide').siblings('.allow').removeClass('hide');
} else {
$fieldType.find('.rgl, hr').removeClass('hide').siblings('.allow').addClass('hide');
}
};
});
});
$('.questions').on('keyup', '.q-title', function(event) {
var $questionsTitle = $(this).closest('.attributes-body').siblings('.attributes-header').find('.questions-title'),
$tabPane = $(this).closest('.tab-content');
$questionsTitle.text($tabPane.find('.active input[type="text"]').val())
event.preventDefault();
/* Act on the event */
});
$('.questions').on(clickEvent, '.add-btn a, .remove-input, .delete, .attributes-header h4 i, .btn-group .btn', function(event) {
if($(this).hasClass('remove-input')){
inputAppendLength($(this), $(this).closest('.add-target').children('.input-append').length);
} else if($(this).hasClass('delete')) {
$(this).closest('.attributes').fadeOut(300, function() {
$(this).remove();
checkQuestionsLength();
$('.questions > .attributes').each(function(index, el) {
$(this).find('h4').find('span').text(index + 1);
});
});
} else if($(this).hasClass('icon-caret-up') || $(this).hasClass('icon-caret-down')) {
if($(this).hasClass('icon-caret-up')) {
$(this).closest('.attributes-header').siblings('.attributes-body').slideUp(300)
$(this).addClass('icon-caret-down').removeClass('icon-caret-up');
} else {
$(this).closest('.attributes-header').siblings('.attributes-body').slideDown(300)
$(this).addClass('icon-caret-up').removeClass('icon-caret-down');
}
} else if($(this).parent().hasClass('btn-group')){
var $questionsTitle = $(this).closest('.attributes-body').siblings('.attributes-header').find('.questions-title'),
$tabPane = $(this).closest('.btn-group').siblings('.tab-content');
$questionsTitle.text($tabPane.find('div').not('.active').children('input[type="text"]').val())
} else {
var _i = $('.questions .attributes').length,
_className = $(this).closest('.control-group').attr('class').match(/options|rgl/g)[0],
_index = $(this).closest('.attributes').data().index,
_length = $(this).closest('.add-btn').siblings('.input-append').length;
console.log(_i)
$('#template-survery-option').tmpl(setData(_index, "", _i, _className)).insertBefore($(this).closest('.add-btn'));
$(this).closest('.add-target').find('.input-append').find('.remove-input').removeClass('hide').prev().removeClass('last');
}
event.preventDefault();
});
checkQuestionsLength();
});

192
vendor/built_in_modules/survey/app/views/panel/survey/back_end/surveys/_form.html.erb vendored
View File

@ -1,102 +1,121 @@
<% content_for :page_specific_css do %>
<%= stylesheet_link_tag "lib/main-forms" %>
<%= stylesheet_link_tag "lib/fileupload" %>
<%= stylesheet_link_tag "lib/wrap-nav" %>
<%= stylesheet_link_tag "lib/main-list" %>
<% end %>
<% content_for :page_specific_javascript do %>
<%= javascript_include_tag "lib/bootstrap-fileupload" %>
<%= javascript_include_tag "jquery-ui-custom.js" %>
<%= javascript_include_tag "lib/bootstrap-datetimepicker" %>
<%= javascript_include_tag "lib/datetimepicker/datetimepicker.js" %>
<%= javascript_include_tag "lib/modal-preview" %>
<%= javascript_include_tag "lib/file-type" %>
<%= javascript_include_tag "lib/member/textarea-lang-btn.js" %>
<%= javascript_include_tag "lib/jquery.tmpl.min.js" %>
<%= javascript_include_tag "survey.js" %>
<% end %>
<%= f.error_messages %>
<fieldset>
<div class="input-area">
<div class="nav-name"><strong><%= t(:module) %></strong></div>
<ul class="nav nav-pills module-nav">
<li class="active">
<a href="#basic" data-toggle="tab"><%= t(:basic) %></a>
</li>
<li>
<a href="#redirect" data-toggle="tab"><%= t('survey.redirect') %></a>
</li>
</ul>
<div class="attributes">
<div class="attributes-header clearfix">
<h4>Basic</h4>
</div>
<div class="attributes-body">
</div>
<div class="tab-content module-area">
<!-- Basic Module -->
<div class="tab-pane fade in active" id="basic">
<div class="input-area">
<!-- Tiltle -->
<div class="control-group">
<label class="control-label muted"><%= t(:start) %></label>
<label class="control-label muted" for="">Title</label>
<div class="controls">
<div class="input-append">
<div class="tab-content">
<% @site_valid_locales.each_with_index do |locale, i| %>
<div class="tab-pane fade in <%= ( i == 0 ) ? "active" : '' %>" id="title_<%= locale %>">
<%= f.fields_for :title_translations do |f| %>
<%= f.text_field locale, :class=>'span4', :value => (@survey.title_translations[locale] rescue nil), :placeholder => I18nVariable.from_locale(locale) %>
<% end %>
</div>
<% end %>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<% @site_valid_locales.each_with_index do |locale, i| %>
<a class="btn <%= ( i == 0 ) ? "active" : '' %>" href="#title_<%= locale %>" data-toggle="tab"><%= I18nVariable.from_locale(locale) %></a>
<% end %>
</div>
</div>
</div>
</div>
<!-- Description -->
<div class="control-group">
<label class="control-label muted">Description</label>
<div class="controls">
<div class="tab-content textarea-lang">
<div class="btn-group" data-toggle="buttons-radio">
<% @site_valid_locales.each_with_index do |locale, i| %>
<a class="btn <%= ( i == 0 ) ? "active" : '' %>" href="#textarea_<%= locale %>_0" data-toggle="tab"><%= I18nVariable.from_locale(locale) %></a>
<% end %>
</div>
<% @site_valid_locales.each_with_index do |locale, i| %>
<div class="tab-pane fade in <%= ( i == 0 ) ? "active" : '' %>" id="textarea_<%= locale %>_0">
<%= f.fields_for :description_translations do |f| %>
<%= f.text_area locale, :class=>'resizable', :value => (@survey.description_translations[locale] rescue nil), :placeholder => I18nVariable.from_locale(locale), :rows=>"3" %>
<% end %>
</div>
<% end %>
</div>
</div>
</div>
<!-- start date -->
<div class="control-group">
<label class="control-label muted" for="account">Start Date</label>
<div class="controls">
<%= f.datetime_picker :postdate, :no_label => true %>
</div>
</div>
<!-- end date -->
<div class="control-group">
<label class="control-label muted"><%= t(:end) %></label>
<label class="control-label muted" for="account">End Date</label>
<div class="controls">
<%= f.datetime_picker :deadline, :no_label => true %>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="redirect">
<div class="input-area">
<!-- redirect mode -->
<div class="control-group">
<label class="control-label muted"><%= t('survey.redirect_mode') %></label>
<label class="control-label muted" for="redirectMode">Redirect Mode</label>
<div class="controls">
<label class="checkbox">
<!-- <input name="survey[redirect_mode]" type="hidden" value="0" />
<input id="survey_redirect_mode" name="survey[redirect_mode]" type="checkbox" value="1" /> -->
<%= f.check_box :redirect_mode %>
The surveys is an external link
</label>
</div>
</div>
<div class="control-group">
<label class="control-label muted"><%= t('survey.redirect_url') %></label>
<!-- redirect url -->
<div class="control-group redirect-url hide">
<label class="control-label muted" for="survey_redirect_url">Redirect URL</label>
<div class="controls">
<%= f.text_field :redirect_url %>
</div>
</div>
<%= f.text_field :redirect_url, :class=>"input-xlarge", :placeholder=>"Redirect URL" %>
</div>
</div>
</div>
<div class="nav-name"><strong>Language</strong></div>
<ul class="nav nav-pills language-nav">
<% @site_valid_locales.each_with_index do |locale, i| %>
<li <%= ( i == 0 ) ? "class=active" : '' %>><a data-toggle="tab" href=".<%= locale %>"><%= I18nVariable.from_locale(locale) %></a></li>
<% end %>
</ul>
<!-- questions -->
<div class="questions">
<!-- Language -->
<div class="tab-content language-area">
<% @site_valid_locales.each_with_index do |locale, i| %>
<div class="<%= locale %> fade tab-pane <%= ( i == 0 ) ? "in active" : '' %>">
<div class="control-group input-title">
<%= f.label :title , t('survey.question'), :class=>"control-label muted" %>
<div class="controls">
<%= f.fields_for :title_translations do |f| %>
<%= f.text_field locale, :class=>'post-title', :value => (@survey.title_translations[locale] rescue nil) %>
<% end %>
</div>
</div>
<div class="control-group input-content">
<%= f.label :description ,t('survey.description'), :class => "control-label muted" %>
<%= f.fields_for :description_translations do |f| %>
<div class="controls">
<div class="textarea">
<%= f.text_area locale, :style=>"width:100%", :class => 'ckeditor input-block-level', :value => (@survey.description_translations[locale] rescue nil) %>
</div>
</div>
<% end %>
</div>
</div>
<% end %>
</div>
<div class="form-actions">
<button type="button" class="btn btn-success add-question">Add Question</button>
<%= f.submit t('save'), :class=>'btn btn-primary' %>
<%= link_to t('cancel'), get_go_back, :class=>"btn" %>
</div>
</fieldset>
<%= render :partial => "questions" %>
<div id= "poststuff">
@ -116,7 +135,6 @@
</div>
<div id='add_survey_question' class="info_input survey_questions_block">
<%= hidden_field_tag 'survey_question_field_count', @survey.survey_questions.count %>
<a class="add"><span class="btn btn-primary btn-small"><i class="icon-plus icon-white"></i> <%= t(:add) %> <%= t('survey.question') %></span></a>
</div>
</div>
@ -124,57 +142,5 @@
</div>
<div class="form-actions">
<%= hidden_field_tag 'page', params[:page] if !params[:page].blank? %>
<%= f.submit t('submit'), :class=>'btn btn-primary' %>
<%= link_to t('cancel'), get_go_back, :class=>"btn" %>
</div>
</div>
</div>
<% content_for :page_specific_javascript do %>
<%= javascript_include_tag "survey_form" %>
<script>
var refresh_sequence_input = function() {
var sequence = 0;
$('.sequence input').each(function(){
sequence += 1;
$(this).val(sequence);
});
}
$(document).ready(function() {
$('.sequence .move-up').bind('click', function(){
$survey_question_item = $(this).parents('.survey_question_item')
$prev = $survey_question_item.prev();
$survey_question_item.insertBefore($prev);
refresh_sequence_input();
return false;
});
$('.sequence .move-down').bind('click', function(){
$survey_question_item = $(this).parents('.survey_question_item')
$next = $survey_question_item.next();
$survey_question_item.insertAfter($next);
refresh_sequence_input();
return false;
});
refresh_sequence_input();
$('#add_survey_question a.add').live('click', function(){
var new_id = $(this).prev().attr('value');
var old_id = new RegExp("new_survey_questions", "g");
$(this).prev().attr('value', parseInt(new_id) + 1);
$_new = $(("<%= escape_javascript(add_attribute 'form_survey_question', f, :survey_questions) %>").replace(old_id, new_id));
$('#survey_questions').append($_new);
$_new.find('a.delete_question').on('click', function(){
$(this).parents('.survey_question_item').remove();
});
});
});
</script>
<% end %>

192
vendor/built_in_modules/survey/app/views/panel/survey/back_end/surveys/_questions.html.erb vendored Normal file
View File

@ -0,0 +1,192 @@
<script id="template-survery" type="text/x-tmpl">
<div class="attributes" data-index="${_l}">
<div class="attributes-header clearfix">
<a class="btn btn-mini pull-right btn-danger delete" href="#"><i class="icon-trash"></i> Delete</a>
<input class="should_destroy" id="${_destroy[0]}" name="${_destroy[1]}" type="hidden">
<input id="${_sequence[0]}" name="${_sequence[1]}" type="hidden" value="${_length - 1}">
<h4><b></b> Q<span>${_length}</span> <i class="icon-caret-up"></i> <span class="questions-title"></span></h4>
</div>
<div class="attributes-body">
<div class="control-group">
<label class="control-label muted" for="">Question Title</label>
<div class="controls">
<div class="input-append">
<div class="tab-content">
<div class="tab-pane fade active in" id="${_title_translations[2]+'_en'}">
<input class="span4 q-title" id="${_title_translations[0]+'_en'}" name="${_title_translations[1]+'[en]'}" type="text" value="" />
</div>
<div class="tab-pane fade" id="${_title_translations[2]+'_zh_tw'}">
<input class="span4 q-title" id="${_title_translations[0]+'_zh_tw'}" name="${_title_translations[1]+'[zh_tw]'}" type="text" value="" />
</div>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_title_translations[2]+'_en'}" data-toggle="tab">English</a>
<a class="btn" href="${'#'+_title_translations[2]+'_zh_tw'}" data-toggle="tab">Chinese</a>
</div>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label muted">Description </label>
<div class="controls">
<div class="tab-content textarea-lang">
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_description_translations[2]+'_en'}" data-toggle="tab">English</a>
<a class="btn" href="${'#'+_description_translations[2]+'_zh_tw'}" data-toggle="tab">Chinese</a>
</div>
<div class="tab-pane fade active in" id="${_description_translations[2]+'_en'}">
<textarea class="resizable" id="${_description_translations[0]+'_en'}" name="${_description_translations[1]+'[en]'}" rows="3"></textarea>
</div>
<div class="tab-pane fade" id="${_description_translations[2]+'_zh_tw'}">
<textarea class="resizable" id="${_description_translations[0]+'_zh_tw'}" name="${_description_translations[1]+'[zh_tw]'}" rows="3"></textarea>
</div>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label muted" for="">Type </label>
<div class="controls">
<select class="type-selector" id="${_type[0]}" name="${_type[1]}">
<option value="0">Oneline</option>
<option value="1">Multi-line</option>
<option value="2">Radio</option>
<option value="3">Check</option>
<option value="4">Select</option>
<option value="5">Radio Group</option>
</select>
</div>
</div>
<div class="field-type" style="display: none">
<div class="control-group rgl">
<label for="" class="control-label muted">Radio Group Label</label>
<div class="controls add-input">
<div class="add-target">
<div class="input-append">
<div class="tab-content">
<div class="tab-pane fade active in" id="${_radiogroups[2]+'en'}">
<input type="text" class="span4" id="${_radiogroups[0]+'en'}" name="${_radiogroups[1]+'[en]'}" />
</div>
<div class="tab-pane fade" id="${_radiogroups[2]+'zh_tw'}">
<input type="text" class="span4" id="${_radiogroups[0]+'zh_tw'}" name="${_radiogroups[1]+'[zh_tw]'}" />
</div>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_radiogroups[2]+'en'}" data-toggle="tab">English</a>
<a class="btn last" href="${'#'+_radiogroups[2]+'zh_tw'}" data-toggle="tab">Chinese</a>
<a href="#" class="btn remove-input hide">
<i class="icon-trash"></i>
</a>
</div>
</div>
<p class="add-btn">
<a href="#" class="btn btn-mini btn-primary"><i class="icons-plus"></i> Add</a>
</p>
</div>
</div>
</div>
<hr />
<div class="control-group options">
<label for="" class="control-label muted">Options List</label>
<div class="controls add-input">
<div class="add-target">
<div class="input-append">
<div class="tab-content">
<div class="tab-pane fade active in" id="${_option[2]+'en'}">
<input type="text" class="span4" id="${_option[0]+'en'}" name="${_option[1]+'[en]'}" />
</div>
<div class="tab-pane fade" id="${_option[2]+'zh_tw'}">
<input type="text" class="span4" id="${_option[0]+'zh_tw'}" name="${_option[1]+'[zh_tw]'}" />
</div>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_option[2]+'en'}" data-toggle="tab">English</a>
<a class="btn last" href="${'#'+_option[2]+'zh_tw'}" data-toggle="tab">Chinese</a>
<a href="#" class="btn remove-input hide">
<i class="icon-trash"></i>
</a>
</div>
</div>
<p class="add-btn">
<a href="#" class="btn btn-mini btn-primary"><i class="icons-plus"></i> Add</a>
</p>
</div>
</div>
</div>
<div class="control-group allow">
<div class="controls">
<label class="checkbox">
<input name="${_custom_option[1]}" type="hidden" value="0" />
<input id="${_custom_option[0]}" name="${_custom_option[1]}" type="checkbox" value="1">
Allow Custom Option
</label>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label muted" for="redirectMode"></label>
<div class="controls">
<label class="checkbox">
<input name="${_is_required[1]}" type="hidden" value="0" />
<input id="${_is_required[0]}" name="${_is_required[1]}" type="checkbox" value="1">
Is Required
</label>
</div>
</div>
</div>
</div>
</script>
<script id="template-survery-option" type="text/x-tmpl">
{{if _className == 'rgl'}}
<div class="input-append">
<div class="tab-content">
<div class="tab-pane fade active in" id="${_radiogroups[2]+'en'}">
<input type="text" class="span4" id="${_radiogroups[0]+'en'}" name="${_radiogroups[1]+'[en]'}" />
</div>
<div class="tab-pane fade" id="${_radiogroups[2]+'zh_tw'}">
<input type="text" class="span4" id="${_radiogroups[0]+'zh_tw'}" name="${_radiogroups[1]+'[zh_tw]'}" />
</div>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_radiogroups[2]+'en'}" data-toggle="tab">English</a>
<a class="btn" href="${'#'+_radiogroups[2]+'zh_tw'}" data-toggle="tab">Chinese</a>
<a href="#" class="btn remove-input">
<i class="icon-trash"></i>
</a>
</div>
</div>
{{else}}
<div class="input-append">
<div class="tab-content">
<div class="tab-pane fade active in" id="${_option[2]+'en'}">
<input type="text" class="span4" id="${_option[0]+'en'}" name="${_option[1]+'[en]'}" />
</div>
<div class="tab-pane fade" id="${_option[2]+'zh_tw'}">
<input type="text" class="span4" id="${_option[0]+'zh_tw'}" name="${_option[1]+'[zh_tw]'}" />
</div>
</div>
<div class="btn-group" data-toggle="buttons-radio">
<a class="btn active" href="${'#'+_option[2]+'en'}" data-toggle="tab">English</a>
<a class="btn" href="${'#'+_option[2]+'zh_tw'}" data-toggle="tab">Chinese</a>
<a href="#" class="btn remove-input">
<i class="icon-trash"></i>
</a>
</div>
</div>
{{/if}}
</script>