IMG-LOGO

Tutorial

IMG
AngularJS Scopes...
03 Jan-2020

The scope making relation between the HTML (view) and the JavaScript (controller).

The scope is an object and scope have available properties and methods.

Scope is available for both the view and controller.

Using the Scope?

Try to make a controller in AngularJS, you pass the $scope object as an argument:

 

Example 1

Properties into controller, can be referred to in the view:

<div ng-app="FirstApp" ng-controller="FirstCtrl">
<h1>{{NameofCar}}</h1>
</div>
<script>
var app = angular.module('FirstApp', []);
app.controller('FirstCtrl', function($scope) {
  $scope.NameofCar = "Lamborghini";
});
</script>

 

When adding properties into $scope object in controller, the HTML view gets access properties.

In the view, you do not use the prefix $scope, just refer to a property name, like {{NameofCar}}.

 

Scope Understanding

AngularJS application consist of:

View( HTML).

Model, Data are available for the current view.

Controller, Is  JavaScript function that makes/changes/removes/controls the data.

Then the scope is the Model.

The scope is a JavaScript object with properties and methods, which are available for both the view and the controller.

 

Example 2

If changes in the view, model and the controller will be updated:

<div ng-app="FirstApp" ng-controller="FirstCtrl">
<input ng-model="name">
<h1>My name is {{name}}</h1>
</div>
<script>
var app = angular.module('FirstApp', []);
app.controller('FirstCtrl', function($scope) {
  $scope.name = "John Doe";
});
</script>

 

Known about Scope

Important to know which scope you are dealing with, at any time.

In the two examples above there is only one scope, so knowing your scope is not an issue, but for larger applications there can be sections in the HTML DOM which can only access certain scopes.

 

Example i

When dealing with the ng-repeat directive, each repetition has access to the current repetition object:

<div ng-app="FirstApp" ng-controller="FirstCtrl">
<ul>
  <li ng-repeat="x in names">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('FirstApp', []);
app.controller('FirstCtrl', function($scope) {
  $scope.names = ["Emil", "Tobias", "Linus"];
});
</script>

Root Scope

All applications have a $rootScope which is the scope created on the HTML element that contains the ng-app directive.

The rootScope is available in the entire application.

If a variable has the same name in both the current scope and in the rootScope, the application uses the one in the current scope.

 

Example ii

A variable named "color" exists in both the controller's scope and in the rootScope:

<body ng-app="FirstApp">
<p>The rootScope's favorite color:</p>
<h1>{{color}}</h1>
<div ng-controller="FirstCtrl">
  <p>The scope of the controller's favorite color:</p>
  <h1>{{color}}</h1>
</div>
<p>The rootScope's favorite color is still:</p>
<h1>{{color}}</h1>
<script>
var app = angular.module('FirstApp', []);
app.run(function($rootScope) {
  $rootScope.color = 'blue';
});
app.controller('FirstCtrl', function($scope) {
  $scope.color = "red";
});
</script>
</body>

News

IMG
Now Users get warning from Instagram, before they post ‘potentially offensi
News 04 Jan-2020

Starting today, Instagram will start warning users when they’re about to post a “potentially offensive” caption for a photo or video that’s being uploaded to their main feed, the company has announced. If an Instagram user posts something that the service’s AI-powered tools think could be hurtful, the app will generate a notification to say that the caption “looks similar to others that have been reported.” It will then encourage the user to edit the caption, but it will also give them the option of posting it unchanged.

The new feature builds upon a similar AI-powered tool that Instagram introduced for comments back in July. The company says that nudging people to reconsider posting potentially hurtful comments has had “promising” results in the company’s fight against online bullying.

Posting a potentially offensive comment will generate a warning that encourages you to edit it.

 Image: Instagram

This is just the latest in a series of measures that Instagram has been taking to address bullying on its platform. In October, the service launched a new “Restrict” feature that lets users shadow ban their bullies, and last year, it started using AI to filter offensive comments and proactively detect bullying in photos and captions.

Unlike its other moderation tools, the difference here is that Instagram is relying on users to spot when one of their comments crosses the line. It’s unlikely to stop the platform’s more determined bullies, but hopefully it has a shot at protecting people from thoughtless insults.

Instagram says the new feature is rolling out in “select countries” for now, but it will expand globally in the coming months.

 

Collected From : https://www.theverge.com/

IMG
AI came to our lives, How ?
News

San Francisco (CNN Business)In 2010, artificial intelligence was more likely to pop up in dystopian science-fiction movies than in everyday life. And it certainly wasn't something people worried might take over their jobs in the near future.

A lot has changed since then. AI is now used for everything from helping you take better smartphone photos and analyzing your personality in job interviews to letting you buy a sandwich without paying a cashier. It's also becoming increasingly common — and controversial — when used for surveillance, such as facial-recognition software, and for spreading misinformation, as with deepfake videos that purport to show a person doing or saying something they didn't.

How did AI come to invade so many different parts of our lives over the last decade? The answer lies in technological advancements in the field, combined with cheaper, easier access to more powerful computers.

Much of the AI you encounter on a regular basis uses a technique known as machine learning, which is when a computer teaches itself by poring over data. More specifically, major developments over the last decade focused on a type of machine learning, called deep learning, that's modeled after the way neurons work in the brain. With deep learning, a computer might be tasked with looking at thousands of videos of cats, for instance, to learn to identify what a cat looks like (and, in fact, it was a big deal when Google figured out how to do this reliably in 2012).

"Ten years ago, deep learning was not on anybody's radar, and now it's in everything," said Pedro Domingos, a computer science professor at the University of Washington.

AI is still quite simplistic. A machine-learning algorithm, for instance, typically does just one thing and often requires mountains of data to learn how to do it well. A lot of work in the field of AI focuses on making machine learning systems better at generalizing and learning from fewer examples, Domingos said.

"We've come a thousand miles, but there's a million miles still to go," he said.

With a nod to those thousand miles already in the technological rear-view mirror, CNN Business took a look back at the last 10 years of AI's journey, highlighting six of the many ways it has impacted our lives.

Smartphones

These days, artificial intelligence is all over smartphones, from facial-recognition software for unlocking the handset to popular apps like Google Maps. Increasingly, companies like Apple and Google are trying to run AI directly on handsets (with chips specifically meant to help with AI-driven capabilities), so activities like speech recognition can be performed on the phone rather than on a remote computer — the kind of thing that can make it even faster to do things like translate words from one language to another and preserve data privacy.

General view of the Apple IPhone XR during the Covent Garden re-opening and iPhone XR launch at Apple store, Covent Garden on October 26, 2018 in London, England.

General view of the Apple IPhone XR during the Covent Garden re-opening and iPhone XR launch at Apple store, Covent Garden on October 26, 2018 in London, England.

One deceptively simple-sounding example of this popped up in October, when Google introduced a transcription app called Recorder. It can record and transcribe, in real time. It knows what you're saying and identifies various sounds like music and applause; the recordings can later be searched by individual words. The app can run entirely on Google Pixel smartphones. Google said this was difficult to accomplish because it requires several pieces of AI that must work without killing the phone's battery life or taking up too much of its main processor. If consumers take a shine to the app, it could lead to yet more AI being squeezed onto our smartphones.

Social networks

When Facebook began in 2004, it focused on connecting people. These days, it's fixated on doing so with artificial intelligence. It's become so core to the company's products that a year ago, Facebook's chief AI scientist, Yann LeCun, told CNN Business that without deep learning the social network would be "dust."

After years of investment, deep learning now underpins everything from the posts and ads you see on the site to the ways your friends can be automatically tagged in photos. It can even help remove content like hate speech from the social network. It's still got a long way to go, though, particularly when it comes to spotting violence or hate speech online, which is tricky for machines to figure out.

And Facebook isn't the only one; it's simply the biggest. Instagram, Twitter, and other social networks rely heavily on AI, too.

Virtual assistants

Any time you talk to Amazon's Alexa, Apple's Siri, or Google's Assistant, you're having an up-close-and-personal interaction with AI. This is most notable in the ways these helpers understand what you're saying and (hopefully) respond with what you want.

The rise of these virtual assistants began in 2011, when Apple released Siri on the iPhone. Google followed with Google Now in 2012 (a newer version, Google Assistant, came out in 2016).

But while many consumers took a shine to Apple's and Google's early computerized helpers, they were mostly confined to smartphones. In many ways, it was Amazon's Alexa, introduced in 2014 and embodied by an Internet-connected speaker called the Amazon Echo, that helped the virtual assistant market explode --— and brought AI to many more homes in the process.

Consider this: During just the third quarter of 2019, Amazon shipped 10.4 million Alexa-using smart speakers, making up the biggest single chunk (nearly 37%) of the global market for these gadgets, according to data from Canalys.

Surveillance

As AI has improved, so have its capabilities as a surveillance tool. One of the most controversial of these is facial recognition technology, which identifies people from live or recorded video or still photos, typically by comparing their facial features with those in a database of faces. It's been used in many different settings: at concerts, by police, and at airports, to name a few.

A display shows a facial recognition system for law enforcement during the NVIDIA GPU Technology Conference, which showcases artificial intelligence, deep learning, virtual reality and autonomous machines, in Washington, DC, November 1, 2017.

A display shows a facial recognition system for law enforcement during the NVIDIA GPU Technology Conference, which showcases artificial intelligence, deep learning, virtual reality and autonomous machines, in Washington, DC, November 1, 2017.

Facial recognition systems have come under growing scrutiny, however, due to concerns about privacy and accuracy. In December, for instance, a US government study found extensive racial bias in almost 200 facial recognition algorithms, with racial minorities much more likely to be misidentified than whites.

In the US, there are few rules governing how AI in general, and facial recognition in particular, can be deployed. So in 2019, several cities, including San Francisco and Oakland in California and Somerville in Massachusetts, banned city departments (including police) from using the technology.

Healthcare

AI is increasingly being used to diagnose and manage all kinds of health issues, from spotting lung cancer to keeping an eye on mental health problems and gastrointestinal issues. Though much of this work is still in the research or early-development stages, there are startups — such as Mindstrong Health, which uses an app to measure moods in patients who are dealing with mental health issues — already trying out AI systems with people.

AI detection scan used for lung cancer malignancy prediction.

AI detection scan used for lung cancer malignancy prediction.

Two startups in the midst of this are Auggi, a gut-health startup building an app to help track gastrointestinal issues, and Seed Health, which sells probiotics and works on applying microbes to human health. In November, they started collecting photos of poop from the general public that they intend to use to make a data set of human fecal images. Auggi wants to use these pictures to make an app that can use computer vision to automatically classify different types of waste that people with chronic gut-related problems — such as irritable bowel syndrome, or IBS — usually have to track manually with pen and paper.

Art

Can AI create art? More and more often the answer is yes. Over the last 10 years, AI has been used to make musical compositionspaintings and more that seem very similar to the kinds of things humans come up with (though the jury is still out on whether a machine can actually possess creativity). And sometimes, that art can even be a big money maker.

 

Pierre Fautrel, co-founder of a group that produces art using AI, stands next to "Portrait of Edmond de Belamy," the first work produced by a machine to be sold at auction.

Perhaps the clearest indication that AI-generated art is gaining popularity came in late 2018, when a blurry, Old Masters-esque piece called "Edmond de Belamy" became the first work produced by a machine to be sold at auction.

The print was created using a cutting-edge technique known as GANS, which involves two neural networks competing with each other to come up with something new based on a data set. In this case, the data set was a slew of existing paintings, while the new thing was the computerized artwork. GANS is also gaining popularity because it can be used to make deepfakes.

 

Collected From : cnn.com

IMG
Sundar Pichai taking over All...
News

At a time when Google is facing critical questions about privacyChina, the way it treats its employees and the integration of acquired brands such as Nest, its co-founders Larry Page and Sergei Brin have decided to step aside from the day-to-day management of Google's parent company Alphabet. The destiny of the company -- and all of its thorny challenges -- are being handed over to Google CEO Sundar Pichai, who now also takes the wheel as Alphabet's chief executive. 

Let's not forget that what also hangs over Google's future is the spectre of the US federal government taking a stronger hand in the regulation of technology companies in the years ahead. Page and Brin likely see a future that's a lot less fun, freewheeling and creative -- but demands more discipline, corporate governance and bureaucracy. As CNET's Rich Nieva reported, there's fear from the rank-and-file that this will also be the death of Google's famous "open culture."

So what does it all mean for the Google products that so many of us rely on every day? Let's take a look at the impact on its three big categories.

What it means for Google search and services

Despite all the flashy things Alphabet and Google do around self-driving cars, fiber broadband, internet balloons and "other bets," the Google search engine and the massive advertising revenue it generates still pays virtually all the bills for the company. The vast majority (over 70%) of the company's revenue comes from search, although YouTube is becoming a much bigger contributor and the company's enterprise offerings in cloud computing and artificial intelligence are also growing. 

Still, don't expect Pichai to change much with search, Google Maps, Google Apps or YouTube -- other than to continue their course of incrementally adding new improvements. The entire company hinges on the continued success of these services, so expect Pichai and his leaders to be very conservative in how they manage them. The biggest challenges are well known: how to deal with international government regulations, backlash from parents and health providers over screen time and how to work within the laws of authoritarian regimes when it comes to censorship and handing over data on dissidents, who are often fighting for democracy and human rights.

What it means for Android and Google devices

Pichai rose to prominence as the leader of the team that created the Chrome web browser and Chrome OS devices such as the original Chromebook Pixel laptop. When his role expanded to include the leadership of the Android team in 2013, most of us expected Chrome OS and Android to merge into one. The fact that it never happened tells us something about Pichai's pragmatism.

Despite fears that Google could eventually sideline Android and put most of its focus on Chrome OS -- where it has more control and makes more money -- Google has not only kept pace in upgrading and simplifying the Android user experience, but it's also invested in Android hardware by creating its own Pixel phones. Google has never deeply invested in marketing Pixel devices, however, likely out of fear of cannibalizing sales from important Android partners like Samsung

As Alphabet CEO, Pichai will now come under more and more pressure from Wall Street to diversify Google's revenue. That will resurface the questions of whether Google should aggressively market its own Pixel devices at the expense of its partners or if it should evolve its mobile strategy from Android to Chrome OS-powered phones. Either option would be disruptive to loyal Android users. 

What it means for Nest and Google Assistant

Google unified manyof its smart home products under the Nest brand in 2019, including its smart speakers and its Wi-Fi routers. Nest had originally operated independently within Google, but it's now been folded into Google's hardware division, essentially replacing the "Google Home" brand. Nest has basically become the Pixel brand of the smart home. 

The way that Pichai has handled that -- after Nest bounced around inside Google and Alphabet for a few years -- again shows his pragmatism. In this case -- unlike with Android and Chrome OS -- it no longer made sense to have two brands and two teams working on similar stuff, so they've been combined.

Meanwhile, Google Assistant maintains its current branding because it's the voice version of traditional Google search, and spreads its wings across other platforms beyond smart home -- especially phones. The power of the Google brand itself remains one of the company's greatest assets, and it will be important to watch the way Pichai -- and the new regime he's likely to put in place at Alphabet -- chooses to use it in the years ahead. 

 

Orginal Post : https://www.cnet.com/news/what-sundar-pichai-taking-over-the-google-universe-means-for-search-android-and-nest/

Course

IMG
CSS Border -
Course - 19 Jun-2019

Properties of CSS Border

Properties of CSS border, allow your style is specify, width, and color of a border element's.

Such as

All sides borders have on.

Red bottom border I have

Rounded borders I have.

Blue left border I have a.

Border Style

The border-style property specifies what kind of border to display.

The listed following values are accepted:

  1. dotted - Defines a dotted border
  2. dashed - Defines a dashed border
  3. solid - Defines a solid border
  4. double - Defines a double border
  5. groove - Defines a 3D grooved border. The effect depends on the border-color value
  6. ridge - Defines a 3D ridged border. The effect depends on the border-color value
  7. inset - Defines a 3D inset border. The effect depends on the border-color value
  8. outset - Defines a 3D outset border. The effect depends on the border-color value
  9. none - Defines no border
  10. hidden - Defines a hidden border

The border-style property can have from one to four values (for the top border, right border, bottom border, and the left border).

Example

p.dotted {border-style: dotted;}

p.dashed {border-style: dashed;}

p.solid {border-style: solid;}

p.double {border-style: double;}

p.groove {border-style: groove;}

p.ridge {border-style: ridge;}

p.inset {border-style: inset;}

p.outset {border-style: outset;}

p.none {border-style: none;}

p.hidden {border-style: hidden;}

p.mix {border-style: dotted dashed solid double;}

Output:

  • A dotted border.
  • A dashed border.
  • A solid border.
  • A double border.
  • A groove border. The effect depends on the border-color value.
  • A ridge border. The effect depends on the border-color value.
  • An inset border. The effect depends on the border-color value.
  • An outset border. The effect depends on the border-color value.
  • No border.
  • A hidden border.
  • A mixed border.

Note: None of the OTHER CSS border properties described below will have ANY effect unless the border-style property is set!

Border Width

The border-width property specifies the width of the four borders.

The width can be set as a specific size (in px, pt, cm, em, etc) or by using one of the three pre-defined values: thin, medium, or thick.

The border-width property can have from one to four values (for the top border, right border, bottom border, and the left border).

6px border-width

Example

p.first {
border-style: solid;
border-width: 5px;
}
p.second {
border-style: solid;
border-width: medium;
}
p.third {
border-style: solid;
border-width: 2px 10px 4px 20px;
}

Border Color

The border-color property is used to set the color of the four borders.

The color can be set by:

name - specify a color name, like "red"

Hex - specify a hex value, like "#ff0000"

RGB - specify a RGB value, like "rgb(255,0,0)"

transparent

The border-color property can have from one to four values (for the top border, right border, bottom border, and the left border).

If border-color is not set, it inherits the color of the element.

Example

p.one {
border-style: solid;
border-color: red;
}
p.two {
border-style: solid;
border-color: green;
}
 
p.three {
border-style: solid;
border-color: red green blue yellow;
}

Border - Individual Sides

From the examples above you have seen that it is possible to specify a different border for each side.

In CSS, there are also properties for specifying each of the borders (top, right, bottom, and left):

Different Types of Border Styles

Example

p {
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;
}

Example

p {
border-style: dotted solid;
}
So, here is how it works:

If the border-style property has four values:

border-style: dotted solid double dashed;

top border is dotted

right border is solid

bottom border is double

left border is dashed

If the border-style property has three values:

border-style: dotted solid double;

top border is dotted

right and left borders are solid

bottom border is double

If the border-style property has two values:

border-style: dotted solid;

top and bottom borders are dotted

right and left borders are solid

If the border-style property has one value:

border-style: dotted;

all four borders are dotted

The border-style property is used in the example above. However, it also works with border-width and border-color.

Border - Shorthand Property

As you can see from the examples above, there are many properties to consider when dealing with borders.

To shorten the code, it is also possible to specify all the individual border properties in one property.

The border property is a shorthand property for the following individual border properties:

border-width

border-style (required)

border-color

Example

p {
border: 5px solid red;
}
You can also use border properties for just one side:
Left Border
p {
border-left: 5px solid red;
background-color: lightgrey;
}

 

Bottom Border

p {
border-bottom: 6px solid red;
background-color: lightgrey;
}

Rounded Borders

The border-radius property is used to add rounded borders to an element:

Normal border

Round border

Rounder border

Roundest border

Example

p {
border: 2px solid red;
border-radius: 5px;
}

Note: The border-radius property is not supported in IE8 and earlier versions.

More Examples

All the top border properties in one declaration

This example demonstrates a shorthand property for setting all of the properties for the top border in one declaration.

 

Set the style of the bottom border

This example demonstrates how to set the style of the bottom border.

 

Set the width of the left border

This example demonstrates how to set the width of the left border.

 

Set the color of the four borders

This example demonstrates how to set the color of the four borders. It can have from one to four colors.

Set the color of the right border

This example demonstrates how to set the color of the right border.

Test Yourself with Practices 

Projects