Skip to content

Commit

Permalink
Merge pull request #4614 from luisramos0/base_admin_js
Browse files Browse the repository at this point in the history
Bring some basic js functions and dependencies from spree_backend
  • Loading branch information
luisramos0 authored Feb 4, 2020
2 parents 2b87922 + 0648f23 commit d8374e9
Show file tree
Hide file tree
Showing 13 changed files with 1,038 additions and 17 deletions.
7 changes: 7 additions & 0 deletions app/assets/javascripts/admin/all.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@
//= require jquery.powertip
//= require jquery.cookie
//= require jquery.jstree/jquery.jstree
//= require jquery.vAlign
//= require jquery.horizontalNav
//= require angular
//= require angular-resource
//= require angular-animate
Expand All @@ -25,8 +27,13 @@
//= require lodash.underscore.js

// spree
//= require spree
//= require admin/spree-select2
//= require admin/spree_backend
//= require modernizr
//= require spin
//= require jquery.adaptivemenu
//= require equalize
//= require css_browser_selector_dev
//= require responsive-tables
//= require admin/spree_paypal_express
Expand Down
228 changes: 228 additions & 0 deletions app/assets/javascripts/admin/spree/base.js.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,228 @@
//= require_self
//= require admin/handlebar_extensions
//= require admin/variant_autocomplete

/**
This is a collection of javascript functions and whatnot
under the spree namespace that do stuff we find helpful.
Hopefully, this will evolve into a propper class.
**/

jQuery(function($) {
// Make main menu use full width
mainMenu = $('.fullwidth-menu')
if (typeof mainMenu.horizontalNav === 'function' )
mainMenu.horizontalNav({
tableDisplay: false,
responsiveDelay: 0
});

// Vertical align of checkbox fields
if (typeof $('.field.checkbox label').vAlign === 'function' )
$('.field.checkbox label').vAlign()

// if (typeof Spree !== 'undefined') {
// $('.main-menu-wrapper ul').AdaptiveMenu({
// text: "<a href='#'><i class='icon-chevron-down'></i> " + Spree.translations.more + "</a>",
// klass: "dropdown"
// });
// }

// Add some tips
if (typeof $('.with-tip').powerTip === 'function' ) {
$('.with-tip').powerTip({
smartPlacement: true,
fadeInTime: 50,
fadeOutTime: 50,
intentPollInterval: 300
});

$('.with-tip').on({
powerTipPreRender: function(){
$('#powerTip').addClass($(this).attr("data-action"));
$('#powerTip').addClass($(this).attr("data-tip-color"));
},
powerTipClose: function(){
$('#powerTip').removeClass($(this).attr("data-action"))
}
});
}

// Make flash messages dissapear
setTimeout('$(".flash").fadeOut()', 5000);

// Highlight hovered table column
$('table tbody tr td.actions a').hover(function(){
var tr = $(this).closest('tr');
var klass = 'highlight action-' + $(this).attr('data-action')
tr.addClass(klass)
tr.prev().addClass('before-' + klass);
}, function(){
var tr = $(this).closest('tr');
var klass = 'highlight action-' + $(this).attr('data-action')
tr.removeClass(klass)
tr.prev().removeClass('before-' + klass);
});

// Trunkate text in page_title that didn't fit
var truncate_elements = $('.truncate');

truncate_elements.each(function(){
$(this).trunk8();
});
$(window).resize(function (event) {
truncate_elements.each(function(){
$(this).trunk8();
})
});

// Make height of dt/dd elements the same
if (typeof $("dl").equalize === 'function' )
$("dl").equalize('outerHeight');
});


$.fn.visible = function(cond) { this[cond ? 'show' : 'hide' ]() };

// Overriding a broken function in Spree. Bug report at
// https://github.com/spree/spree/issues/4032
show_flash_error = function(message) {
error_div = $('.flash.error');
if (error_div.length > 0) {
error_div.html(message);
error_div.show();
} else {
if ($("#content .toolbar").length > 0) {
$("#content .toolbar").before('<div class="flash error">' + message + '</div>');
} else {
$("#progress").before('<div class="flash error">' + message + '</div>');
}
}
}

// Apply to individual radio button that makes another element visible when checked
$.fn.radioControlsVisibilityOfElement = function(dependentElementSelector){
if(!this.get(0)){ return }
showValue = this.get(0).value;
radioGroup = $("input[name='" + this.get(0).name + "']");
radioGroup.each(function(){
$(this).click(function(){
$(dependentElementSelector).visible(this.checked && this.value == showValue)
});
if(this.checked){ this.click() }
});
}

$(document).ready(function() {
if (typeof Spree !== 'undefined') {
handle_date_picker_fields = function(){
$('.datepicker').datepicker({
dateFormat: Spree.translations.date_picker,
dayNames: Spree.translations.abbr_day_names,
dayNamesMin: Spree.translations.abbr_day_names,
monthNames: Spree.translations.month_names,
prevText: Spree.translations.previous,
nextText: Spree.translations.next,
showOn: "focus"
});

// Correctly display range dates
$('.date-range-filter .datepicker-from').datepicker('option', 'onSelect', function(selectedDate) {
$(".date-range-filter .datepicker-to" ).datepicker( "option", "minDate", selectedDate );
});
$('.date-range-filter .datepicker-to').datepicker('option', 'onSelect', function(selectedDate) {
$(".date-range-filter .datepicker-from" ).datepicker( "option", "maxDate", selectedDate );
});
}

handle_date_picker_fields();
}

$(".observe_field").on('change', function() {
target = $(this).attr("data-update");
ajax_indicator = $(this).attr("data-ajax-indicator") || '#busy_indicator';
$(target).hide();
$(ajax_indicator).show();
$.ajax({ dataType: 'html',
url: $(this).attr("data-base-url")+encodeURIComponent($(this).val()),
type: 'get',
success: function(data){
$(target).html(data);
$(ajax_indicator).hide();
$(target).show();
}
});
});

$('.spree_add_fields').click(function() {
var target = $(this).data("target");
var new_table_row = $(target + ' tr:visible:last').clone();
var new_id = new Date().getTime();
new_table_row.find("input, select").each(function () {
var el = $(this);
el.val("");
if (typeof el.attr("id") !== 'undefined') el.attr("id", el.attr("id").replace(/\d+/, new_id))
if (typeof el.attr("name") !== 'undefined') el.attr("name", el.attr("name").replace(/\d+/, new_id))
})
// When cloning a new row, set the href of all icons to be an empty "#"
// This is so that clicking on them does not perform the actions for the
// duplicated row
new_table_row.find("a").each(function () {
var el = $(this);
el.attr('href', '#');
})
$(target).prepend(new_table_row);
})

// Fix sortable helper
var fixHelper = function(e, ui) {
ui.children().each(function() {
$(this).width($(this).width());
});
return ui;
};

$('table.sortable').ready(function(){
var td_count = $(this).find('tbody tr:first-child td').length

if (typeof $('table.sortable tbody').sortable !== 'function' )
return

$('table.sortable tbody').sortable(
{
handle: '.handle',
helper: fixHelper,
placeholder: 'ui-sortable-placeholder',
update: function(event, ui) {
$("#progress").show();
positions = {};
$.each($('table.sortable tbody tr'), function(position, obj){
reg = /spree_(\w+_?)+_(\d+)/;
parts = reg.exec($(obj).attr('id'));
if (parts) {
positions['positions['+parts[2]+']'] = position;
}
});
$.ajax({
type: 'POST',
dataType: 'script',
url: $(ui.item).closest("table.sortable").data("sortable-link"),
data: positions,
success: function(data){ $("#progress").hide(); }
});
},
start: function (event, ui) {
// Set correct height for placehoder (from dragged tr)
ui.placeholder.height(ui.item.height())
// Fix placeholder content to make it correct width
ui.placeholder.html("<td colspan='"+(td_count-1)+"'></td><td class='actions'></td>")
},
stop: function (event, ui) {
// Fix odd/even classes after reorder
$("table.sortable tr:even").removeClass("odd even").addClass("even");
$("table.sortable tr:odd").removeClass("odd even").addClass("odd");
}

});
});
});
27 changes: 27 additions & 0 deletions app/assets/javascripts/admin/spree/progress.coffee
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
$(document).ready ->
opts =
lines: 11
length: 2
width: 3
radius: 9
corners: 1
rotate: 0
color: '#fff'
speed: 0.8
trail: 48
shadow: false
hwaccel: true
className: 'spinner'
zIndex: 2e9
top: 'auto'
left: 'auto'

target = document.getElementById("spinner")

$(document).ajaxStart ->
$("#progress").fadeIn()
spinner = new Spinner(opts).spin(target)

$(document).ajaxStop ->
$("#progress").fadeOut()

8 changes: 8 additions & 0 deletions app/assets/javascripts/admin/spree/spree-select2.js.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
//= require select2
jQuery(function($) {
// Make select beautiful
if (typeof $('select.select2').select2 === 'function' )
$('select.select2').select2({
allowClear: true
});
})
16 changes: 0 additions & 16 deletions app/assets/javascripts/admin/util.js.erb
Original file line number Diff line number Diff line change
Expand Up @@ -16,22 +16,6 @@ $(document).ready(function() {
});
});

// Overriding a broken function in Spree. Bug report at
// https://github.com/spree/spree/issues/4032
show_flash_error = function(message) {
error_div = $('.flash.error');
if (error_div.length > 0) {
error_div.html(message);
error_div.show();
} else {
if ($("#content .toolbar").length > 0) {
$("#content .toolbar").before('<div class="flash error">' + message + '</div>');
} else {
$("#progress").before('<div class="flash error">' + message + '</div>');
}
}
}

$(document).ready(function(){
$('a.close').click(function(event){
event.preventDefault();
Expand Down
1 change: 0 additions & 1 deletion app/assets/stylesheets/admin/all.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
*= require_self
*/


//************************************************************************//
//************************************************************************//
@import 'globals/variables';
Expand Down
38 changes: 38 additions & 0 deletions app/assets/stylesheets/admin/components/progress.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
@import 'admin/globals/variables';
@import 'admin/globals/mixins';

#progress {
display: none;
position: fixed;
top: 0;
z-index: 1000;
opacity: 0.8;
width: 100%;

.wrapper {
@include border-radius(10px);
top: -10px;
position: absolute;
left: 50%;
width: 200px;
margin-left: -100px;
padding: 11px 0;
background-color: $color-3;
color: $color-1;
text-align: center;
}

#spinner {
position: absolute;
top: 10px;
left: 50%;
margin-left: -5px;
}

.progress-message {
font-size: 120%;
font-weight: $font-weight-bold;
margin-top: 20px;
text-transform: uppercase;
}
}
25 changes: 25 additions & 0 deletions app/assets/stylesheets/admin/globals/functions.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
// Make color very close to white
@function very-light($color, $adjust: 3){
@if type-of($adjust) == 'number' and $adjust > 0 {
@for $i from 0 through 100 {
@if lighten($color, $i) == white and ($i - $adjust) > $adjust {
@return lighten($color, $i - $adjust);
}
}
}
@else {
@debug "Please correct $adjust value. It should be number and larger then 0. Currently it is '#{type-of($adjust)}' with value '#{$adjust}'"
}
};

// Quick fix for dynamic variables missing in SASS
@function get-value($prop, $val, $search) {
$n1: index($prop, $search);
$n2: index($val, $search);

@if($n1) {
@return nth($val, $n1);
} @else {
@return nth($prop, $n2);
}
}
Loading

0 comments on commit d8374e9

Please sign in to comment.