typescript – angular set default value to to angular material button

I want to set default value to mat angular radion button , if this.ssoEnabled has value for example the value of this.ssoEnabled is not null and is equal to “Yes” then the radio button should be checked by default like on the image. Any idea how to do this in angular?

enter image description here

Code to get user data

  getUserData() {
    this.isInProgress = true;
      .pipe(finalize(() => (this.isInProgress = false)))
        next: (res) => {
          if (res.isSuccess) {
            this.data = res.data;
            this.ssoEnabled = this.data.ssoEnabled
        error: (err) => this._notificationService.showError(err),
        complete: noop,

html code

 <mat-radio-group formControlName="ssoEnabled" class="label3" >
                        <mat-card fxLayoutAlign="start center" style="cursor: pointer;"
                            (ngClass)="securityForm.get('ssoEnabled').value === 'Yes' ? 'selected-card' : ''">
                            <mat-radio-button color="accent" (value)="this.data.ssoEnabled"
                                (ngClass)="securityForm.get('ssoEnabled').value === 'Yes' ? 'selected-radio' : ''">
                        <mat-card fxLayoutAlign="start center" style="cursor: pointer;"
                            (ngClass)="securityForm.get('ssoEnabled').value === 'No' ? 'selected-card' : ''">
                            <mat-radio-button  value="this.data.ssoEnabled" color="accent" 
                                (ngClass)="securityForm.get('ssoEnabled').value === 'No' ? 'selected-radio' : ''">

Kendo Grid Filter Menus and Angular Material Selects – Closes Whenever You Make a Selection

I’m trying to make a custom filter menu using mat-select elements. By default, Kendo Grid Filter Menus close when another element outside of the menu is focused. This functionally prevents you from using mat-selects inside the filter menu. When you select an option of the mat-select, it closes the filter menu. I created a stackblitz demonstrating this.


Can anyone think of a workaround?

3d – GLSL Shade a box different colors for two ends with one material in Three.js

First, I knew the following basic knowledges,

Then, I can use shader to render 2D graphics on the Shadertoy or GLSL Sandbox Gallery cross-browser online editor through WebGL or with the cross-platform SHADERed IDE. It’s easy to use GLSL to draw 2D objects because 2D coordinates correspond to gl_Position. But I failed to use ShaderMaterial with the GLSL code to render a BoxGeometry I created in three.js. See the following code for my case.

var container;
var camera, scene, renderer;
var mesh;
var uniforms;

var clock = new THREE.Clock();


function init() {
    container = document.getElementById('container');

    camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 1, 3000);
    camera.position.z = 2.0;
    camera.position.y = 1.0;
    camera.rotation.x = -0.45;

    scene = new THREE.Scene();

    //var boxGeometry = new THREE.PlaneGeometry(0.75, 0.75, 1);
    var boxGeometry = new THREE.BoxGeometry(0.5, 0.5, 0.5, 1,1,1);

    uniforms = { u_time: { type: "f", value: 0.0 } };

    var material = new THREE.ShaderMaterial({
        uniforms: uniforms,
        side: THREE.DoubleSide,
        transparent: true,
        vertexShader: document.getElementById('vertexShader2').textContent,
        fragmentShader: document.getElementById('fragment_shader2').textContent

    mesh = new THREE.Mesh(boxGeometry, material);

    renderer = new THREE.WebGLRenderer();
    renderer.setClearColor(0xffffff, 1);


    window.addEventListener('resize', onWindowResize, false);


function onWindowResize(event) {
    camera.aspect = window.innerWidth / window.innerHeight;
    renderer.setSize(window.innerWidth, window.innerHeight);

function animate() {

function render() {
    var delta = clock.getDelta();
    uniforms.u_time.value += delta;
    mesh.rotation.y += delta * 0.5;
    renderer.render(scene, camera);
window.onerror = function (msg, url, line, col, error) {
    // Note that col & error are new to the HTML 5 spec and may not be 
    // supported in every browser.  It worked for me in Chrome.
    var extra = !col ? '' : 'ncolumn: ' + col;
    extra += !error ? '' : 'nerror: ' + error;

    // You can view the information in an alert to see things working like this:
    alert("Error: " + msg + "nurl: " + url + "nline: " + line + extra);

    // TODO: Report this error via ajax so you can keep track of what pages have JS issues

    var suppressErrorAlert = true;
    // If you return true, then error alerts (like in older versions of 
    // Internet Explorer) will be suppressed.
    return suppressErrorAlert;
    <!-- <script src="https://threejs.org/build/three.min.js"></script> -->
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r121/three.min.js"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/three@0.130.1/build/three.min.js"></script>

    <div id="container"></div>

<script id="fragment_shader2" type="x-shader/x-fragment">
varying vec3 v_color;

void main( void ) {
    gl_FragColor = vec4(v_color, 1.);    
<script id="vertexShader2" type="x-shader/x-vertex">
varying vec3 v_color;
void main()
    v_color = vec3(position.z < 0.25, 0, position.z >= 0.25);
    vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
    gl_Position = projectionMatrix * mvPosition;

<script id="fragment_shader" type="x-shader/x-fragment">
varying vec2 v_uv;

void main( void ) {
    vec2 uv = v_uv;
    // Zooms out by a factor of 2.0
    uv *= 2.0;
    // Shifts every axis by -1.0
    uv -= 1.0;
    // Base color for the effect
    vec3 color = vec3 ( .2, 1., 0. );

    // specify size of border. 0.0 - no border, 1.0 - border occupies the entire space
    vec2 borderSize = vec2(0.3); 

    // size of rectangle in terms of uv 
    vec2 rectangleSize = vec2(1.0) - borderSize; 

    // distance field, 0.0 - point is inside rectangle, 1.0 point is on the far edge of the border.
    float distanceField = length(max(abs(uv)-rectangleSize,0.0) / borderSize);
    // calculate alpha accordingly to the value of the distance field
    float alpha = 1.0 - distanceField;

    gl_FragColor = vec4(color, alpha);    

<script id="vertexShader" type="x-shader/x-vertex">
varying vec2 v_uv;
void main()
    v_uv = uv;
    vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
    gl_Position = projectionMatrix * mvPosition;

    <div id="info">
        <a href="https://threejs.org/examples/#webgl_postprocessing_outline">WebGL Postprocessing Outline</a>
    <a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - Outline Pass by 
    <a href="http://eduperiment.com" target="_blank" rel="noopener">Prashant Sharma</a> and
    <a href="https://clara.io" target="_blank" rel="noopener">Ben Houston</a>
<script type="module" src="index.js"></script>

I guessed that it was because it could distinguish between vertexes in the same middle position of the +x sides and -x sides for v_color = vec3(position.x < 0.25, 0, position.x >= 0.25);.

Finally, I also knew that I can Split the geometry into groups with different materials, but I just want to use one ShaderMaterial to do this.

var geo = new THREE.BoxGeometry(48, 48, 48, 2);
var magnetMaterial = ('red', 'blue', 'green', 'purple', 'cyan', 'white', 'black', 'pink', 'orange', 'gray').map(it =>
    new THREE.MeshPhongMaterial({
        color: it, side: THREE.DoubleSide,
        polygonOffset: true, polygonOffsetFactor: 1

//Initializes the magnetic orientation to +x, red on the left side and blue on the right side.
//faces().materialIndex: -x,-x, +x,+x, +z,+z,+z,+z, -y,-y,-y,-y, -z,-z,-z,-z, +y,+y,+y,+y
// var faceColors = (1, 1, 0, 0, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 1, 1, 0, 0);
// console.log('faceColors', geo.faces.map((it, idx) => it.materialIndex = faceColors(idx))); // for Three.js 1.20

// let's regroup materialIndex of five faces of the two ends of the Cuboid (x+,x-,y+,y-,z+,z-)
console.log(geo.getIndex().count, geo.groups.slice(0));
(0, 1, 1, 0, 1, 0, 1, 0, 0, 1).forEach((val, idx) => geo.addGroup(6 * idx, 6, val));

Anyone could help me to explain and solve this problem because the gradient is not what I want?

dungeons and dragons – Where in D&D published material did the nomenclature “ability check” first appear?

Looking through the Redbox and the Bluebox I noticed that there are abilities and there are checks. But there is no cohesive concept of an “ability check”. Then I looked in Gygax’ AD&D Dungeon Masters Guide and did not find the term “ability check” there either.

I did however find the term “Ability Check” prominent and repeated often in the 1991 “Rules Cyclopedia” (ex. chapter 13).

Where in D&D published material did the term “Ability Check” first appear?

models – Material diffuse Colour is not correctly showing on unity 2020

I have a model which has been exported in Unity 2020, it is not showing the exact colour as I have in max. Instead, it showing white colour in diffuse. But if I bring the same FBX into unity 2019 then it’s showing the right colour.

I see that unity docs states something like this:

If a diffuse Texture is set, it ignores the diffuse color (this
matches how it works in Autodesk® Maya® and Autodesk® 3ds Max®).

But this is true for Unity 2019 but its picking the right diffuse colour. why?

godot – Spatial Shader Material Doesn’t Show Albedo from Texture (Splatmap Tutorial)

I’m trying to do this tutorial

I can’t get this to work in Godot 3.3.2 with a Blender Mesh. My mesh is white and if I do ALBEDO = splatmapcolor the whole mesh turns green.

Shader Code is below:

shader_type spatial;

uniform sampler2D splatmap;
uniform sampler2D sand;
uniform sampler2D earth;
uniform sampler2D rock;

uniform float sandres = 1;
uniform float earthres = 1;
uniform float rockres = 1;

void fragment() {
vec3 sandcolor;
vec3 earthcolor;
vec3 rockcolor;
vec3 splatmapcolor;

splatmapcolor = texture(splatmap, UV).rgb;

sandcolor = texture(sand, UV * sandres).rgb * splatmapcolor.r;
earthcolor = texture(earth, UV * earthres).rgb * splatmapcolor.g;
rockcolor = texture(rock, UV * rockres).rgb * splatmapcolor.b;

ALBEDO = sandcolor + earthcolor + rockcolor;

Godot version 3.3.2

dnd 5e – Can artificer subclasses be in (third-party) material published under the OGL?

This is a duck

A duck

You can label it a chicken if you like but you won’t fool anyone who knows about ducks.

The artificer is protected by copyright and trade mark law. Ham-fistedly obfuscating it by referring to it obliquely doesn’t circumvent that protection.

Because you expanding on the protected works of WotC, you can only do this if you have permission (a licence) or a legal exemption.

The artificer is not part of the material that is covered by the OGL – it only applies to materials that are in the System Reference Document:

The License: This License applies to any Open Game Content that contains a notice indicating that the Open Game Content may only be Used under and in terms of this License.

Anything you release pertaining to the artificer cannot be under the OGL. Therefore, to be legal, you must be relying on some other legal basis. You don’t have permission of the copyright holder so you must be relying on fair use or the considerably narrower exemptions that apply outside the United States.

It’s always difficult to say if a particular use case is fair use since it relies on a balancing of factors. However, it’s likely this is not fair use as it’s a public exploitation of a commercially valuable property in a way similar to the way the copyright owner exploits their own property – adding subclasses is what WotC do to make money from their D&D property (among other things).

dnd 5e – Can you cast spells that do not require material components through an arcane focus?

The PHB states:

Casting some spells requires particular objects, specified in parentheses in the component entry. A character can use a component pouch or a spellcasting focus (found in chapter 5, “Equipment”) in place of the components specified for a spell.

However, even when looking at the Spellcasting feature of the various casters, nothing seems to indicate that spells with no material components cannot be cast through an arcane focus.

From my understanding it seems to mostly be a widely accepted assumption that one cannot do so, but no rule really prevents you from doing so…

When an item/arcane focus says you gain a bonus when casting through it (ex. Artillerist Artificer’s Arcane Firearm feature), are you really only limited to spells with an M component by RAW?

How can I recreate a material from blender in Unreal engine

I’m new to unreal and I am having trouble finding a way to reproduce the materials for a mesh in blender in unreal. It’s a simple material but I can’t find a way to reproduce the color ramp specifically. Is there any unreal alternative or just some way i can reproduce it. the way I’m using the color ramp is so that light is so the material is affected by the light.

(here’s what I mean)


dnd 5e – Does a level 20 druid bypass the costless but consumed mistletoe material component of the spell Druid Grove?

The spell Druid Grove has an oddly specific material component that is consumed but is otherwise costless: “A mistletoe harvested with a golden sickle under the light of a full moon” (XGE, p.154).

At level 20, an Arcdruid can ignore material components that don’t have a cost and aren’t consumed (PHB, p.64).

Does that mean that the druid can ignore material components that have no cost but are consumed?

Just have this idea of a high-level naked druid wandering in the forests creating temporary sanctuaries all over. But I don’t know whether the druid itself has to have the component for Druid Grove on hand, or can just be completely naked.