I want to make so that an object with the name of mainImage would work as a background image and no other object could pass it when the user would try to use "sendBackwards" method.
So, in my thinking I need to know that
1.If the mainImage is at index 0
2.If active selected object is at index 1 when I should not allow to use sendBackwards
This is what I tried so far, but I guess you will be able to see where this is failing:
$scope.getActiveIndex = function() {
for (var i = 0; i < canvas.fabric._objects.length; i++) {
console.log("not active");
if (canvas.fabric._objects[i].status === "active") {
console.log("active");
return i;
}
}
}
$scope.sendBackwards = function() {
var currentObject = canvas.fabric.getActiveObject();
for (var i = 0; i < canvas.fabric._objects.length; i++) {
console.log($scope.getActiveIndex());
if (canvas.fabric._objects[i].name === "mainImage" && $scope.getActiveIndex() == 1) {
console.log("Can not pass the background");
return;
} else {
canvas.fabric.sendBackwards(currentObject);
}
}
canvas.fabric.renderAll();
};
Thanks.
Solved this quite easily:
$scope.sendBackwards = function() {
var currentObject = canvas.fabric.getActiveObject();
var zIndex = canvas.fabric.getObjects().indexOf(currentObject);
if (zIndex == 1) {
return false;
} else {
canvas.fabric.sendBackwards(currentObject);
}
canvas.fabric.renderAll();
};
Related
I have given a call for the below javascript function on drop down selection.
Basically what my requirement is that ,there can be a lot of vndrCd .
But,When ever the first time vndrCd is "SFGL", alert should not open .
If "SFGL is coming second time then an alert should come . I am not able to put this condition as the call to the method is at every click . Is there a way I can achive this .
function GetOptions(var1) {
varId = var1.id;
var vndrNbrCdList = document.getElementById('TouchCellDetailForm:vendorNbrCodeList').value;
var splitVndrList = vndrNbrCdList.split(',');
if (var1.value == '0') {
varhiddBox.value = '0';
return;
}
for (var j = 0; j < splitVndrList.length; j++) {
if (splitVndrList[j].split('-')[0] == (var1.value)) {
var vndrCd = splitVndrList[j].split('-')[1];
break;
}
}
localStorage.setItem("vendorName", vndrCd);
var vendorName1 = localStorage.getItem("vendorName");
if (vendorName1 == 'SFGL') {
alert("Salesforce vendor has already been selected.Please select some other vendor");
}
}
You can use closure to hold a private variable to indicate whether 'SFGL' has been encountered or not:
function GetOptionsHelp() {
'use strict';
let called = false;
return function GetOptions(var1) {
// ... your code block
if (vendorName1 == 'SFGL') {
if (called) {
alert("Salesforce vendor has already been selected.Please select some other vendor");
} else {
called = true;
}
}
}
And you can call the function like this GetOptionsHelp()(var1)
Try doing something like this as an easy solution:
(function () {
var firstTimeFlag = true;
function GetOptions(var1) {
varId = var1.id;
var vndrNbrCdList = document.getElementById('TouchCellDetailForm:vendorNbrCodeList').value;
var splitVndrList = vndrNbrCdList.split(',');
if (var1.value == '0') {
varhiddBox.value = '0';
return;
}
for (var j = 0; j < splitVndrList.length; j++) {
if (splitVndrList[j].split('-')[0] == (var1.value)) {
var vndrCd = splitVndrList[j].split('-')[1];
break;
}
}
localStorage.setItem("vendorName", vndrCd);
var vendorName1 = localStorage.getItem("vendorName");
if (vendorName1 == 'SFGL') {
if(!firstTimeFlag) {
alert("Salesforce vendor has already been selected.Please select some other vendor");
}
firstTimeFlag = false;
}
}
}());
I have a function which gets values from elements:
function getTransactionValues() {
var o = {};
o.reservations = [];
$('#custom-headers option:selected').each(function (i, selected) {
o.reservations[i] = $(selected).val();
});
o.amount = $('input[name=amount-price]').val();
o.currency_value = $('input[name=currency-value]').val();
o.currency_name = $('.currency_appendto option:selected').html();
o.actual_amount = $('input[name=actual-amount]').val();
o.actual_remaining = $('input[name=actual-remaining]').val();
o.funds_arrival_date = $('input[name=funds-arrival]').val();
o.paid_to = $('.paidto option:selected').html();
o.checkbox = $('.multi-transaction:checked').map(function () {
return this.value
}).get();
return o;
}
Now i want to check whether amount, actual_amount and funds_arrival_date are filled. if they are i will release the disabled class from a button. i've tried
var check_review = function () {
var a = getTransactionValues();
var options = [a.amount, a.actual_amount, a.funds_arrival_date];
for(i = 0; i < options.length; i++) {
if(options[i].length > 0) {
$('a[name=review_button]').removeClass('disabled');
}
else{
//this array is empty
alert('There is a problem!');
}
}
}
$('.test').click(function() {
check_review();
});
But it doesn't seems to be working..
Remove disabled attribute using JQuery?
Can you please look at above link, I think we should use $('.inputDisabled').prop("disabled", false);
Even if a single array element will be non empty then your code will remove the class disabled from the a. To make sure that all the elements of array are non empty and then only you want to remove the class then the way is:
for(i = 0; i < options.length; i++) {
if(options[i].length > 0) {
$('a[name=review_button]').removeClass('disabled');
}
else{
$('a[name=review_button]').addClass('disabled');
}
}
Or the other way is
var check = true;
for(i = 0; i < options.length; i++) {
if(options[i].length == 0) {
check = false;
}
}
if(check ) $('a[name=review_button]').removeClass('disabled');
Try using Array.prototype.every()
if (options.every(Boolean)) {
$("a[name=review_button]").removeClass("disabled");
} else {
// do other stuff
}
When the user clicks on one of the blocks in the table ( see screenshot ) I want to find all neighbouring blocks with the same color. I am trying to do this recursively, but if I try it with more than three blocks it sometimes goes crazy and calls itself over and over until the program crashes.
As far as I can see, the objects are added to the array, but somehow my tests fails and the same object is added over and over and over.
Any insight on what the problem might be and how to solve it would be much appriciated!
Here's a screenshot
This is the function that is called when the user clicks on a block:
var $matchArray;
$('.block').click(function () {
$matchArray = [$(this)];
var $colorClass;
if ($(this).hasClass('red')) {
$colorClass = 'red';
} else if ($(this).hasClass('green')) {
$colorClass = 'green';
} else if ($(this).hasClass('blue')) {
$colorClass = 'blue';
} else {
$colorClass = 'error';
}
findAllSameColorNeighbours($(this), $colorClass);
});
And this is the recursive method:
findAllSameColorNeighbours = function ($this, $colorClass) {
$this.css('border-style', 'solid');
//LEFT
var $leftBlock = isLeftBlockSameColor($this, $colorClass);
if ($leftBlock != null) {
if (!(arrayContains($matchArray, $leftBlock))) {
$matchArray.push($leftBlock);
findAllSameColorNeighbours($leftBlock, $colorClass);
}
}
//ABOVE
//same as for LEFT
//RIGHT
//same as for LEFT
//BELOW
//same as for LEFT
}
This is how I find the neighboring cells, as far as I can see these work just fine. I have one for each direction:
isLeftBlockSameColor = function ($block, $color) {
var $this = $block;
var $tr = $this.parent().parent();
var col = $tr.children().index($this.parent().prev());
var $leftBlock = $this.parent().siblings().eq(col).children();
var $blockClassMatch = $leftBlock.hasClass($color);
if ($blockClassMatch) {
return $leftBlock;
}
else {
return null;
}
};
Here are some help methods to find out if the object is already in the array or not. I use the index of the row and cell to create a sort of latitude and longditude thing.
arrayContains = function ($array, $object) {
for (i = 0; i < Array.length; i++) {
if (compareIndex($array[i], $object)) {
say('true');
return true;
}
};
return false;
};
compareIndex = function ($obj1, $obj2) {
if ((getRowIndex($obj1)) === (getRowIndex($obj2)) {
if ((getCellIndex($obj1)) === (getCellIndex($obj2)) {
return true;
} else {
return false;
}
} else {
return false;
}
};
getCellIndex = function ($this) {
var $tr = $this.parent().parent();
var index = $tr.children().index($this.parent());
return index;
};
getRowIndex = function ($this) {
var $tr = $this.parent().parent();
var index = $tr.index();
return index;
};
There is a bug in the arrayContains function. The loop will iterates only once, because Array.length is equals to 1(As I tested with chrome browser, but I don't know why). You should use $array.length instead.
arrayContains = function ($array, $object) {
//for (i = 0; i < Array.length; i++) {
for (i = 0; i < $array.length; i++) {
if (compareIndex($array[i], $object)) {
say('true');
return true;
}
};
return false;
};
I'm working on a form that will have a "Validate" button. The purpose of this button is to check and make sure all the fields are completed (this is what the project demands). Below is the code that checks to see if the field is null and then changes the border color and displays a text box.
if (form1.Main.sfRequestor.requestNameFirst.rawValue == null){
form1.Main.sfRequest.txtValidate.presence = "visible";
form1.Main.sfRequestor.requestNameFirst.border.edge.color.value = "255,0,0"
} else {
form1.Main.sfRequest.txtValidate.presence = "hidden";
form1.Main.sfRequestor.requestNameFirst.border.edge.color.value = "255,255,255"
};
if (form1.Main.sfRequestor.requestNameLast.rawValue == null){
form1.Main.sfRequest.txtValidate.presence = "visible";
form1.Main.sfRequestor.requestNameLast.border.edge.color.value = "255,0,0"
} else {
form1.Main.sfRequest.txtValidate.presence = "hidden";
form1.Main.sfRequestor.requestNameLast.border.edge.color.value = "255,255,255"
};
There are 20+ fields in several subforms that need to be checked. I'm trying to consolidate the code but am at a loss on how to do so. Can variables handle field names in Javascript?
You can make this into a loop pretty easily, and could write it as an IIFE to keep your namespace clean
(function (arr) {
var txtValidate = form1.Main.sfRequest.txtValidate,
i, e;
for (i = 0; i < arr.length; ++i) {
e = form1.Main.sfRequestor[arr[i]]; // cache me
if (e.rawValue == null){
txtValidate.presence = "visible";
e.border.edge.color.value = "255,0,0"
} else {
txtValidate.presence = "hidden";
e.border.edge.color.value = "255,255,255"
}
}
}(['requestNameFirst', 'requestNameLast']));
However, it looks like txtValidate.presence only ever gets set to whatever the last item's conditions were, are you sure you don't want to use a flag and set this last instead? e.g.
(function (arr) {
var txtValidateState = 'hidden',
i, e;
for (i = 0; i < arr.length; ++i) {
e = form1.Main.sfRequestor[arr[i]];
if (e.rawValue == null){
txtValidateState = "visible"; // any null makes txtValidate visible
e.border.edge.color.value = "255,0,0"
} else {
e.border.edge.color.value = "255,255,255"
}
}
form1.Main.sfRequest.txtValidate.presence = txtValidateState; // set last
}(['requestNameFirst', 'requestNameLast']));
Update for generic forms, assuming sfRequestor and sfRequest
(function (form, arr) {
var txtValidateState = 'hidden',
i, e;
for (i = 0; i < arr.length; ++i) {
e = form.sfRequestor[arr[i]];
if (e.rawValue == null){
txtValidateState = "visible";
e.border.edge.color.value = "255,0,0";
} else {
e.border.edge.color.value = "255,255,255";
}
}
form.sfRequest.txtValidate.presence = txtValidateState;
}(form1.Main, ['requestNameFirst', 'requestNameLast']));
Update Assuming sfRequest is a constant but sfRequestor could be something different
(function () { // moved IIFE to protect namespace
function validate(form, subform, arr) { // now named, new param subform
var txtValidateState = 'hidden',
i, e;
for (i = 0; i < arr.length; ++i) {
e = form[subform][arr[i]]; // select from subform
if (e.rawValue == null){
txtValidateState = "visible";
e.border.edge.color.value = "255,0,0";
} else {
e.border.edge.color.value = "255,255,255";
}
}
form.sfRequest.txtValidate.presence = txtValidateState; // assuming stays same
}
validate(form1.Main, 'sfRequestor', ['requestNameFirst', 'requestNameLast']);
validate(form1.Main, 'sfClientInfo', ['firstname']);
// if you have many here you can re-write as a loop again
}());
You could easily make this into a simple function:
function validateField(element) {
if (element.rawValue == null) {
form1.Main.sfRequest.txtValidate.presence = "visible";
element.border.edge.color.calue = "255,0,0";
}
else {
form1.Main.sfRequest.txtValidate.presence = "hidden";
element.border.edge.color.calue = "255,255,255";
}
}
And then just call it like so:
validateField(form1.Main.sfRequestor.requestNameFirst);
validateField(form1.Main.sfRequestor.requestNameLast);
To simplify even further, put all 20 elements in an array and loop
var elements = [form1.Main.sfRequestor.requestNameFirst, form1.Main.sfRequestor.requestNameLast, ...];
elements.forEach(function(element) {
validateField(element);
});
I have a javascript variable that is an array of arrays. Then I have a variable below it. Like this:
var cars = [
["ford mustang",1955,"red"],
["dodge dart",1963,"green"],
["pontiac",2002,"green"],
]
var colour = "blue";
Now I need to check for if either the third values of each array are all the same as the variable, colour, or they are all different. If one of those conditions are true, I want to execute some other code. So in the above example, the condition would be true because none of the values are "blue". It would also be true if they were all "blue".
Hopefully I've made myself clear.
There are two functions in JavaScript just for that:
allCarsAreRed = cars.every(function(car) { return car[2] == 'red' })
atLeastOneCarIsRed = cars.some(function(car) { return car[2] == 'red' })
noRedCars = cars.every(function(car) { return car[2] != 'red' })
some
every
var colour = 'blue'
var all = true;
var none = true;
for (var i = 0; i < cars.length; i++) {
if (cars[i][2] !== colour) {
all = false;
} else {
none = false;
}
}
Do you need something like this?
var cars_length = cars.length;
var all_same = true;
var all_different = true;
for(var i=0; i<cars_length; i++)
{
if(cars[i].[2] == colour)
{
all_same = false;
}
else
{
all_different = false;
}
}
if(all_same)
{
console.log('all same');
}
else
{
if(all_different)
{
console.log('all different');
}
else
{
console.log('nor all same, nor all different');
}
}
Look at bellow Solution
var arr = ["a", "b", "c", "d"]
var allZero = true;
for (var i = 0; i < arr.length; i++)
{
if (arr[i][2] != 0)
{
allZero = false;
break;
}
}
if (allZero)
{
console.log("ALL are Zero");
}