frontend_v2/src/app/components/home/home.component.html
<app-header-static></app-header-static>
<div class="white-bg view-container flex-body">
<div class="content">
<!-- EvalAI into -->
<div class="grad-container">
<div class="row">
<div class="col s12 m8 l8">
<div class="grad-head">
<h3 class="text-dark-black fw-regular">
<strong>Evaluating state-of-the-art in AI</strong>
</h3>
<p class="text-med-black fs-18 fw-light">
EvalAI is an open source platform for evaluating and comparing machine learning (ML) and artificial
intelligence algorithms (AI) at scale.
</p>
<div class="landing-buttons">
<ul class="inline-list">
<li>
<a (click)="hostChallenge()" href="javascript:void(0)" class="fw-regular dark-link"
><strong>Host Challenge</strong></a
>
</li>
<li>
<a
class="btn ev-btn-dark waves-effect waves-dark grad-btn grad-btn-dark fs-14"
routerLink="/challenges/all"
>Participate</a
>
</li>
</ul>
<br />
<br />
</div>
</div>
</div>
</div>
</div>
<!-- Stats -->
<section class="text-med-black ev-super-light-bg">
<div class="grad-container text-med-black">
<div class="row">
<div class="col s12 m3 l3">
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20 w-500">
<h3><strong>400+</strong></h3>
</div>
</div>
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20">
Hosted AI Challenges
</div>
</div>
</div>
</div>
</div>
<div class="col s12 m3 l3">
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20 w-500">
<h3><strong>40,000+</strong></h3>
</div>
</div>
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20">
Users
</div>
</div>
</div>
</div>
</div>
<div class="col s12 m3 l3">
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20 w-500">
<h3><strong>430,000+</strong></h3>
</div>
</div>
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20">
Submissions
</div>
</div>
</div>
</div>
</div>
<div class="col s12 m3 l3">
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20 w-500">
<h3><strong>40+</strong></h3>
</div>
</div>
<div class="row">
<div class="col s12 m12 l12">
<div class="center fs-20">
Organizations
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="text-med-black">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="w-300 center">Features</h3>
</div>
<div class="row">
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/protocols.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">Custom evaluation protocol</h5>
<p class="fw-light fs-16">
We allow creation of an arbitrary number of evaluation phases and dataset splits, compatibility
using any programming language, and organizing results in both public and private leaderboards.
</p>
</div>
</div>
</div>
</div>
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/remote.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">Remote evaluation</h5>
<p class="fw-light fs-16">
Challenge organizers can easily add their own cluster of worker nodes to process participant
submissions while we take care of hosting the challenge, handling user submissions, and maintaining
the leaderboard.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/docker.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">Reinforcement learning challenges</h5>
<p class="fw-light fs-16">
EvalAI supports hosting reinforcement learning challenges. Participants submit code for their agent
in the form of docker images which are evaluated against test environments on the evaluation server.
</p>
</div>
</div>
</div>
</div>
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/cli.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">CLI support</h5>
<p class="fw-light fs-16">
EvalAI-CLI is designed to extend the functionality of the EvalAI web application to your command
line to make the platform more accessible and terminal-friendly.
</p>
<br />
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/portability.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">Portability</h5>
<p class="fw-light fs-16">
EvalAI was designed with keeping in mind scalability and portability of such a system from the very
inception of the idea. We heavily rely on open-source technologies such as – Docker, Django,
Node.js, and PostgreSQL.
</p>
</div>
</div>
</div>
</div>
<div class="col s12 m12 l6">
<div class="card-panel z-depth-2 hoverable border-radius-10 pd-5">
<div class="row valign-wrapper">
<div class="col s12 m4 l3">
<img src="../../../assets/images/features/faster-eval.png" alt="" width="100%" />
</div>
<div class="col s12 m8 l9">
<h5 class="fw-light">Faster evaluation</h5>
<p class="fw-light fs-16">
We warm-up the worker nodes at start-up by pre-loading the dataset in memory. We also split the
dataset into small chunks that are simultaneously evaluated on multiple cores.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="ev-container ev-reverse-details text-med-black ev-super-light-bg">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Popular challenges</h3>
</div>
<div class="row">
<div class="col s12 m6 l3" *ngFor="let challenge of challengeList">
<a class="ev-card-hover" [routerLink]="['challenge', challenge['id']]">
<div class="card ev-card-panel ev-challenge-card z-depth-2 hoverable margin-bottom-cancel">
<div class="card-image ev-card-image">
<img class="bg-img" [src]="challenge['image']" />
</div>
<div class="card-content">
<p class="fs-18 fw-regular truncate">{{ challenge['title'] }}</p>
<p>
<strong class="fw-regular text-light-black fs-12">Organized by</strong>
<br />
<span class="fw-light fs-16">{{ challenge['creator']['team_name'] }}</span>
</p>
<p>
<strong class="fw-regular text-light-black fs-12">Starts on</strong>
<br />
<span class="fw-light fs-16">{{ challenge['start_date'] | date: 'medium' }}</span>
</p>
<p>
<strong class="fw-regular text-light-black fs-12">Ends on</strong>
<br />
<span class="fw-light fs-16">{{ challenge['end_date'] | date: 'medium' }}</span>
</p>
</div>
</div>
</a>
</div>
<div *ngIf="challengeList.length == 0" class="row">
<p class="fw-light text-dark-black w-300 center fs-16">
Sorry! there are no featured challenges. Please check again later.
</p>
</div>
</div>
</div>
</section>
<!-- organizatons section -->
<section class="ev-container ev-reverse-details text-med-black">
<div class="grad-container text-med-black">
<div class="row">
<div class="col s12 m12 l12">
<div class="row">
<h3 class="fw-light center">Partner Organizations</h3>
</div>
<div class="row">
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/aptiv.png" id="aptiv-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/cmu.png" id="cmu-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/draper.png" id="draper-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/ebay.png" id="ebay-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/fb.png" id="fb-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/gt.png" id="gt-logo" />
</div>
</div>
</div>
<div class="row">
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/google.png" id="google-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/ibm.png" id="ibm-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/illinois.png" id="illinois-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/iitm.png" id="iitm-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/intel.png" id="intel-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/ju.png" id="ju-logo" />
</div>
</div>
</div>
<div class="row">
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/mapillary.png" id="mapillary-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/mit.png" id="mit-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/nu.png" id="nu-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/siop.png" id="siop-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/stanford.png" id="stanford-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/adelaide.png" id="adelaide-logo" />
</div>
</div>
</div>
<div class="row">
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/umbc.png" id="umbc-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/pitt.png" id="pitt-logo" />
</div>
</div>
<div class="col s12 l2">
<div class="org-logo">
<img src="../../../assets/images/partners/vt.png" id="vt-logo" />
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Twitter Feed Container -->
<section class="ev-container ev-reverse-details text-med-black ev-super-light-bg">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Twitter Feed</h3>
</div>
<div class="twitter-container">
<a class="twitter-timeline" data-height="400" data-width="700" data-chrome="nofooter noheader transparent"
data-theme="light" href="https://twitter.com/eval_ai?ref_src=twsrc%5Etfw" data-aria-polite="assertive">Tweets by eval_ai</a>
</div>
</div>
</section>
<!-- Arxiv Entry -->
<section class="ev-container ev-reverse-details text-med-black">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Cite our work</h3>
</div>
<div class="row">
<div class="col s12 m12 l12">
<h5 class="fw-light">
EvalAI: Towards Better Evaluation Systems for AI Agents
</h5>
<span class="fw-light fs-16"
>Deshraj Yadav, Rishabh Jain, Harsh Agrawal, Prithvijit Chattopadhyay, Taranjeet Singh, Akash Jain, Shiv
Baran Singh, Stefan Lee, Dhruv Batra</span
>
</div>
</div>
<div class="row">
<a href="https://arxiv.org/abs/1902.03570" target="_blank">
<img src="../../../assets/images/evalai-paper.jpg" alt="" width="100%" class="thumb" />
</a>
</div>
</div>
</section>
<!-- Sponsors -->
<section class="ev-container ev-reverse-details text-med-black ev-super-light-bg " id="ev-scroll-down">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Sponsors</h3>
</div>
<div class="row">
<div class="col s12 m4 l4 offset-l2">
<div class="evalai-sponsor-logo">
<img src="../../../assets/images/sponsors/aws.png" id="aws" />
</div>
</div>
<div class="col s12 m6 l6">
<div class="evalai-sponsor-logo">
<img src="../../../assets/images/sponsors/gsoc.png" id="gsoc" />
</div>
</div>
</div>
</div>
</section>
<!-- Testimonials Section -->
<section class="ev-container testimonial-wrapper text-med-black">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Testimonials</h3>
</div>
<div class="testimonial-container">
<div class="card ev-card-panel ev-challenge-card z-depth-2 hoverable margin-bottom-cancel">
<div class="row">
<div class="testimonial-author col s12 m3 l3 center fs-20">
<img src="{{ testimonialAuthorImage }}" class="logo" width="100px" height="100px"/>
<div class=" testimonial-details">
<h5 class="name fs-20">{{ testimonialAuthor}}</h5>
<span class="orgname fs-18">{{ testimonialOrg }}</span>
</div>
</div>
<div class="col s12 m6 l9 testimonial-body">
<span class="fs-24">{{ testimonialBody }}</span>
</div>
</div>
<img src="assets/images/testimonials/arrow.png" (click)="testimonialNavigate()" class="testimonial-arrow-left" />
<img
src="assets/images/testimonials/arrow.png"
(click)="testimonialNavigate('right')"
class="testimonial-arrow-right"
/>
<img src="assets/images/testimonials/quotes.png" class="testimonial-quotes" />
</div>
</div>
</div>
</section>
<!-- Subscribe to newsletter -->
<section class="ev-container text-med-black ev-super-light-bg">
<div class="grad-container text-med-black">
<div class="row">
<h3 class="fw-light center">Subscribe to our newsletter</h3>
</div>
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 ev-mt-50 center subscribe-container">
<app-input
[label]="'email'"
[placeholder]="'Email*'"
[isRequired]="true"
[type]="'email'"
[icon]="'fa fa-letter'"
#formgroup
></app-input>
<button
class="btn ev-btn-dark waves-effect waves-dark grad-btn grad-btn-dark fs-14"
(click)="formValidate('formgroup')"
>
Subscribe
</button>
</div>
</div>
</div>
</section>
</div>
<!--landing-footer></landing-footer-->
</div>
<app-footer></app-footer>