PETER BORREGGINE created NETBEANS-2498:
------------------------------------------
Summary: A red dot appears on a Typescript file when there's no
error in the file
Key: NETBEANS-2498
URL: https://issues.apache.org/jira/browse/NETBEANS-2498
Project: NetBeans
Issue Type: Bug
Components: editor - Other
Affects Versions: 8.2
Environment: Windows 10 PRO
Reporter: PETER BORREGGINE
I have an error in my code but there's not any errors, I don't think. I'm using
the following:
{{ Angular CLI: 1.7.4 Node: 8.11.1 OS: win32 x64 Angular: 5.2.11 ...
animations, common, compiler, compiler-cli, core, forms ... http,
platform-browser, platform-browser-dynamic ... platform-server, router
@angular/cdk: 5.2.4 @angular/cli: 1.7.4 @angular/language-service: 4.4.7
@angular/material: 7.3.7 @angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2 @angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0 @ngtools/webpack: 1.10.2 @schematics/angular: 0.3.2
@schematics/package-update: 0.3.2 typescript: 2.4.2 webpack: 3.11.0}}
{{I get a RED DOT on my Typescript file and when I run ng serve, there are no
errors and everything compiles fine.}}
{{Is there a plugin or something that reveals what actually is wrong or going
on or is this an anomaly that I shouldn't concern myself with?}}
{{Here's the code from my service that's showing a red dot.}}
{{Sorry about the formatting issues... your code placeholder changed all my <
and > signs to unicode.... the link to the JQUERY that I was trying to convert
to Typescript is located in the comments. But there are missing declarations
for bgColor and content and missing comma's in some places. It's badly written
code. What I am trying to do is replicate what he did here:
[http://www.thepetedesign.com/demos/adaptive-modal_demo.html]}}
{{Modal from Existing Container and Custom Styles is what I want to do in
Typescript and Angular.}}
{code:java}
// code placeholder
import {Injectable} from '@angular/core';
@Injectable()
export class ModalAdaptiveService {
constructor(
) {}
public bgColor: string;
public content: string;
/* ===========================================================
* jquery.adpative-modal.js v1.0
* ===========================================================
* Copyright 2014 Pete Rojwongsuriya.
* http://www.thepetedesign.com
*
* Adaptive Modal let you add a modal windows
* that can be morphed from anything
*
* https://github.com/peachananr/adaptive-modal
*
* License: GPL v3
*
* ========================================================== */
function($) {
let myThis = this;
let defaults = {
elementAnimateTime: 100,
customBgColor: "#333",
remoteUrl: false,
elementAnimateIn: "scaleShow",
elementAnimateOut: "scaleHide",
beforeAnimate: function (el, status) {},
afterAnimate: function (el, status) {},
/* Deafult Ajax Parameters */
type: "GET",
async: true,
complete: function (xhr, text) {},
cache: true,
error: function (xhr, text, e) {},
global: true,
headers: {},
statusCode: {},
success: function (data, text, xhr) {},
dataType: "html"
};
// a function to replicate all styles from the original button
$.fn.getStyleObject = function () {
let dom = this.get(0);
let style;
let returns = {};
if (window.getComputedStyle) {
let camelize = function (a, b) {
return b.toUpperCase();
};
style = window.getComputedStyle(dom, null);
for (let i = 0, l = style.length; i < l; i++) {
let prop = style[i];
let camel = prop.replace(/\-([a-z])/g, camelize);
let val = style.getPropertyValue(prop);
returns[camel] = val;
};
return returns;
};
if (style = dom.currentStyle) {
for (let prop in style) {
returns[prop] = style[prop];
};
return returns;
};
return this.css();
}
// Function to detect remote URL
function urlCheck(url) {
if
(/^([a-z]([a-z]|\d|\+|-|\.)*):(\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?((\[(|(v[\da-f]{1,}\.(([a-z]|\d|-|\.|_|~)|[!\$&'\(\)\*\+,;=]|:)+))\])|((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=])*)(:\d*)?)(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*|(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)){0})(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url))
{
return true;
} else {
return false;
}
}
// Function to run animation in sequence
function runAnimation(i, timeline, animations) {
setTimeout(function () {
if (typeof animations[i].beforeAnimate == 'function')
animations[i].beforeAnimate();
if (animations[i].remove) {
if (animations[i].hide == true) {
$(animations[i].selector).removeClass(animations[i].remove).addClass(animations[i].step).one("animationend
webkitAnimationEnd oAnimationEnd MSAnimationEnd", function () {
$(this).hide();
if (typeof animations[i].afterAnimate == 'function')
animations[i].afterAnimate();
});
} else {
$(animations[i].selector).removeClass(animations[i].remove).addClass(animations[i].step).show().one("animationend
webkitAnimationEnd oAnimationEnd MSAnimationEnd", function () {
if (typeof animations[i].afterAnimate == 'function')
animations[i].afterAnimate();
});
}
} else {
if (animations[i].hide == true) {
$(animations[i].selector).addClass(animations[i].step).one("animationend
webkitAnimationEnd oAnimationEnd MSAnimationEnd", function () {
$(this).hide()
if (typeof animations[i].afterAnimate == 'function')
animations[i].afterAnimate();
});
} else {
$(animations[i].selector).addClass(animations[i].step).show().one("animationend
webkitAnimationEnd oAnimationEnd MSAnimationEnd", function () {
if (typeof animations[i].afterAnimate == 'function')
animations[i].afterAnimate();
});
}
}
}, timeline);
}
$.fn.adaptiveModal = function (options) {
return this.each(function () {
let settings = $.extend({}, defaults, options),
el = $(this);
// Public Method to Open Modal Programatically
$.fn.openModal = function () {
let el = $(this),
className = el.data("am-custom-class") || "",
customBgColor = el.data("am-custom-bgcolor") || el.css('backgroundColor') ||
settings.customBgColor,
h = el.outerHeight(),
w = el.outerWidth(),
posX = el.offset().left,
posY = el.offset().top - $(window).scrollTop(),
styles = el.getStyleObject(),
remote = "";
// Prevent animation overlap when there's an ongoing animation
if (el.hasClass("am-animating")) {
return false;
}
if (typeof settings.beforeAnimate == 'function') settings.beforeAnimate(el,
"open");
// Fallback default background color in case the button has no background color
available
if (el.css('backgroundColor') == "rgba(0 ,0 ,0 ,0)") customBgColor =
settings.customBgColor;
myThis.bgColor = customBgColor
// animation flag to true
el.addClass("am-animating");
// Apply to remove URL only
if (el.data("remote") == true || settings.remoteUrl != false) {
myThis.content = "Loading.."
remote = "am-remote"
let type = (el.data("type")) ? el.data("type") : settings.type;
let href = el.attr("href") || settings.remoteUrl;
let datatype = (el.data("datatype")) ? el.data("datatype") : settings.dataType;
// Call AJAX
$.ajax({
type: type,
url: href,
async: settings.async,
complete: settings.complete,
cache: settings.cache,
error: settings.error,
global: settings.global,
headers: settings.headers,
statusCode: settings.statusCode,
success: function (data, text, xhr) {
// Animate Elements when ajax is completed
if (typeof settings.success == 'function') {
settings.success(data, text, xhr);
} else {
$(".am-remote").html(data)
}
$(".am-back > .am-modal-content > *").each(function () {
animations.push({
time: 0,
step: "am-expanded",
selector: $(".am-back"),
beforeAnimate: function () {
$(".am-back").attr("style", "").css({
background: myThis.bgColor,
minHeight: $(".am-back").height()
});
}
}, {
time: settings.elementAnimateTime,
step: "animated " + settings.elementAnimateIn,
selector: this,
});
});
animations.push({
time: 0,
step: "",
selector: $(".am-back"),
beforeAnimate: function () {
if (typeof settings.afterAnimate == 'function') settings.afterAnimate(el,
"open");
el.removeClass("am-animating")
}
});
let timeline = 0;
for (let i = 0; i < animations.length; i++) {
timeline = parseInt(animations[i].time, 10) + parseInt('0', 10);
runAnimation(i, timeline, animations);
}
},
dataType: datatype
});
} else {
// Use data-title or content from href if the link is not remote
myThis.content = el.data("title") || $(el.attr("href")).html()
}
// Create objects to be animated
$("body").append("<div class='am-overlay'><div
class='am-close-backdrop'></div><div class='am-modal " + className + "'><div
class='am-wrapper'></div></div></div>");
el.clone().removeData("toggle").removeData("title").addClass("am-front").css(styles).appendTo(".am-modal
.am-wrapper");
$(".am-modal .am-wrapper").append("<div class='am-back'><div
class='am-modal-content " + remote + "'>" + myThis.content + "</div></div>")
$(".am-modal").css({
width: w,
height: h,
top: posY,
left: posX
});
// Get real height of the object to animate correctly
$("body").prepend("<div class='am-sample'></div>")
$(".am-back").clone().addClass("am-expanded " +
className).appendTo(".am-sample");
$(".am-sample .am-back").wrap("<div class='am-modal am-expanded " + className +
"'></div>");
let realH = $(".am-sample .am-back").outerHeight();
$(".am-sample").remove();
$(".am-back").css({
width: w,
height: h,
backgroundColor: myThis.bgColor
});
// Add close button
$(".am-back").append("<a href='#' class='am-close'>×</a>")
// Close function
$(".am-back .am-close, .am-close-backdrop, .am-trigger-close").click(function
(e) {
el.closeModal();
return false;
});
// Complex series of class switching and CSS3 animation
let animations = []
animations.push({
time: 500,
step: "am-flipped",
selector: $(".am-modal"),
beforeAnimate: function () {
el.css({
visibility: "hidden"
});
}
}, {
time: 500,
step: "am-expanded",
selector: $(".am-modal"),
beforeAnimate: function () {
$(".am-modal").attr("style", "");
}
}, {
time: 0,
step: "am-expanded",
selector: $(".am-back"),
beforeAnimate: function () {
$(".am-back").attr("style", "").css({
background: myThis.bgColor,
height: realH,
minHeight: realH
});
}
}, {
time: 500,
step: "",
selector: $(".am-back"),
beforeAnimate: function () {
if (!$(".am-back .am-modal-content").hasClass("am-remote")) {
$(".am-back").css({
height: "auto"
});
if (typeof settings.afterAnimate == 'function') settings.afterAnimate(el,
"open");
el.removeClass("am-animating")
}
}
}
);
// Animate elemtn directly under the modal one by one
$(".am-back > .am-modal-content > *").each(function () {
animations.push({
time: settings.elementAnimateTime,
step: "animated scaleShow",
selector: this,
});
});
let timeline = 0;
for (let i = 0; i < animations.length; i++) {
timeline = parseInt(animations[i].time, 10) + parseInt('0', 10);
runAnimation(i, timeline, animations);
}
$("body").addClass("am-modal-open");
}
// Public Method to Close Modal Programatically
$.fn.closeModal = function () {
let el2 = $(this),
className = el2.data("am-custom-class") || "",
animations = [],
h = el2.outerHeight(),
w = el2.outerWidth(),
posX = el2.offset().left,
posY = el2.offset().top - $(window).scrollTop();
// Prevent animation overlap when there's an ongoing animation
if (el2.hasClass("am-animating")) {
return false;
}
if (typeof settings.beforeAnimate == 'function') settings.beforeAnimate(el2,
"close");
// Toggle Animation to true
el2.addClass("am-animating");
//Animate out modal content
$(".am-back > .am-modal-content > *").each(function () {
animations.push({
time: settings.elementAnimateTime,
step: settings.elementAnimateOut,
remove: settings.elementAnimateIn,
selector: this,
});
});
// get real height to animate from
$("body").prepend("<div class='am-sample'></div>")
$(".am-back").clone().addClass("am-expanded " +
className).appendTo(".am-sample");
$(".am-sample .am-back").wrap("<div class='am-modal am-expanded " + className +
"'></div>");
let realH = $(".am-sample .am-back").outerHeight();
$(".am-sample").remove();
// complex series of class switching and CSS3 animations
animations.push({
time: 0,
selector: $(".am-expanded"),
step: "",
beforeAnimate: function () {
$(".am-expanded").css({
height: realH
});
}
},
{
time: 300,
remove: "am-expanded",
selector: $(".am-back"),
beforeAnimate: function () {
$(".am-back").css({
width: w,
height: h,
top: posY,
left: posX,
minHeight: 0
});
}
},
{
time: 0,
remove: "am-expanded",
selector: $(".am-modal"),
step: "",
beforeAnimate: function () {
$(".am-modal").css({
width: w,
height: h,
top: posY,
left: posX
});
}
},
{
time: 200,
remove: "am-flipped",
step: "",
selector: $(".am-modal")
},
{
time: 0,
step: "",
selector: $(".am-modal"),
beforeAnimate: function () {
el2.css({
visibility: "visible"
})
}
},
{
time: 500,
remove: "am-modal-open",
step: "",
selector: $("body")
},
{
time: 500,
step: "",
selector: $(".am-overlay"),
beforeAnimate: function () {
$(".am-overlay").remove();
if (typeof settings.afterAnimate == 'function') settings.afterAnimate(el2,
"close");
el2.removeClass("am-animating");
}
});
let timeline = 0;
for (let i = 0; i < animations.length; i++) {
timeline = parseInt(animations[i].time, 10) + parseInt('0', 10);
runAnimation(i, timeline, animations);
if (i - 1 == animations.length) {
console.log("Animations Length is equal to i - 1, in this case.");
}
}
}
// Determine the type of URL in the href attribute
if (el.attr("href").length > 0 && el.attr("href") != "#") {
if (!urlCheck(el.attr("href"))) $(el.attr("href")).hide();
}
// Add button trigger
el.addClass("am-btn").click(function () {
el.openModal()
return false;
});
});
}
// Auto initialize when data-toggle='adaptive-modal' are present
$(document).ready(function () {
$("[data-toggle='adaptive-modal']").adaptiveModal();
});
};
}
{code}
--
This message was sent by Atlassian JIRA
(v7.6.3#76005)
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@netbeans.apache.org
For additional commands, e-mail: commits-h...@netbeans.apache.org
For further information about the NetBeans mailing lists, visit:
https://cwiki.apache.org/confluence/display/NETBEANS/Mailing+lists
