Merge pull request #116 from goldenstar999/backend

ninjadev999 · ninjadev999 · commit c3720dae36a6 · 2019-02-17T23:59:15.000-08:00
updated video interview on admin part
diff --git a/frontend/src/components/shiptalent/videos/videoPlayer.js b/frontend/src/components/shiptalent/videos/videoPlayer.js
@@ -9,8 +9,7 @@ import styles from 'styles';
 
 class VideoPlayer extends Component {
   render() {
-    const { title, url, classes } = this.props;
-    console.log('===== VideoPlayer: title: ', title);
+    const { title, url, width, height, classes } = this.props;
     return (
       <Grid container spacing={16} justify="center" alignItems="center">
         {title && (
@@ -24,10 +23,9 @@ class VideoPlayer extends Component {
           <ReactPlayer
             url={url}
             className={url ? classes.clientVideoPlayer : classes.clientEmptyVideoPlayer}
-            width={'480px'}
-            height={'270px'}
+            width={width ? width : '480px'}
+            height={height ? height : '270px'}
             controls={true}
-            light
           />
         </Grid>
       </Grid>
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/EditGreetingVideos/EditGreetingVideos.js b/frontend/src/containers/admin/EditProfiles/Videos/EditGreetingVideos/EditGreetingVideos.js
@@ -7,6 +7,7 @@ import Spacer from 'components/general/spacer';
 import AdminForm from 'components/shiptalent/forms/adminForm';
 import OverviewVideo from '../OverviewVideo';
 import IntervewVideoItem from '../InterviewVideos/InterviewVideoItem';
+import { getLiveVideosByPositionName, getCurrentTalentPositionName } from 'utils/appUtils';
 import { adminStyles } from 'styles';
 
 
@@ -78,7 +79,7 @@ class EditGreetingVideos extends React.Component  {
           <Grid item lg={2} md={1} xs={12}/>
           <Grid item xs={12}><Spacer size={15} /></Grid>
           <Grid item xs={12}>
-            <IntervewVideoItem videos={profile && profile.talent_videos} />
+            <IntervewVideoItem videos={profile && getLiveVideosByPositionName(profile.talent_videos, getCurrentTalentPositionName(profile))} />
           </Grid>
           <Grid item xs={12}><Spacer size={30} /></Grid>
         </Grid>
@@ -93,8 +94,8 @@ class EditGreetingVideos extends React.Component  {
         talent={profile}
         showName
         formSubTitle="Video Greetings"
-        nextLink={{pathname: "/admin/edit-profiles/edit-profile", state: {profileId: profile ? profile.id : null}}}
-        nextButtonTitle="Back to Profile"
+        nextLink={{pathname: "/admin/edit-profiles/profile-videos"}}
+        nextButtonTitle="Back to VIDEOS"
       >
         {this.renderContent()}
       </AdminForm>
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/GreetingVideoItem.js b/frontend/src/containers/admin/EditProfiles/Videos/GreetingVideoItem.js
@@ -10,10 +10,12 @@ import { adminStyles } from 'styles';
 class GreetingVideoItem extends Component {
 
   render() {
-    const { videos, classes } = this.props;
-    let total = 4;
-    let currentVideos = videos ? videos.length : 0;
-    let approved = (total && videos) ? videos.filter(video => video.approved).length : 0;
+    const { greetingVideos, interviewVideos, classes } = this.props;
+    let total = 9;
+    let currentVideos = greetingVideos ? greetingVideos.length : 0;
+    let currentInterviewVideos = interviewVideos ? interviewVideos.length : 0;
+    currentVideos += currentInterviewVideos;
+    let approved = (greetingVideos ? greetingVideos.filter(video => video.approved).length: 0) +  currentInterviewVideos;
     let pending = currentVideos - approved;
     
     return (
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/InterviewVideoItem.js b/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/InterviewVideoItem.js
@@ -6,7 +6,6 @@ import Typography from '@material-ui/core/Typography';
 import Grid from '@material-ui/core/Grid';
 import Button from '@material-ui/core/Button';
 import ApprovedStatus from '../../ApprovedStatus';
-import { getLiveVideoNumbers } from 'utils/appUtils';
 import { adminStyles } from 'styles';
 
 
@@ -25,7 +24,8 @@ class InterviewVideoItem extends Component {
 
   render() {
     const { videos } = this.props;
-    const videoCount = videos ? getLiveVideoNumbers(videos) : 0;
+    const videoCount = videos ? videos.length : 0;
+
     return (
       <Grid container spacing={16} direction="column" justify="center" alignItems="center">
         <Grid item xs={12}>
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/LiveInterviewVideo.js b/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/LiveInterviewVideo.js
@@ -7,9 +7,9 @@ import Panel from 'components/general/panel';
 import VideoPlayer from 'components/shiptalent/videos/videoPlayer';
 import AdminForm from 'components/shiptalent/forms/adminForm';
 import QuestionSelection from './QuestionSelection';
-import { getLiveVideos } from 'utils/appUtils';
 import defaultValues from 'constants/defaultValues';
 import * as talentActions from 'actions/talentActions';
+import { getLiveVideosByPositionName, getCurrentTalentPositionName } from 'utils/appUtils';
 import { adminStyles } from 'styles';
 import TechnicianQuestionSelection from './TechnicianQuestionSelection';
 
@@ -23,7 +23,9 @@ class LiveInterviewVideo extends Component  {
 
   getInfoFromProps = (props) => {
     const { profile } = props;
-    let videos = (profile && profile.talent_videos) ? getLiveVideos(profile.talent_videos) : [];
+    let videos = (profile && profile.talent_videos) 
+                  ? getLiveVideosByPositionName(profile.talent_videos, getCurrentTalentPositionName(profile)) 
+                  : [];
     return { videos };
   };
 
@@ -43,33 +45,35 @@ class LiveInterviewVideo extends Component  {
     const { selectedQuestionId, videos } = this.state;
     const { profile, classes } = this.props;
     const video = videos ? videos[selectedQuestionId] : 0;
-    const positionType = (profile && profile.talent_position_types && profile.talent_position_types[0]) 
-                          ? profile.talent_position_types[0] : null;
+    const positionName = getCurrentTalentPositionName(profile);
     const subPositionType = (profile && profile.talent_position_sub_types && profile.talent_position_sub_types[0]) 
                           ? profile.talent_position_sub_types[0].position_sub_type : null;
     return (
       <Panel>
         <Grid container spacing={24}>
           <Grid item md={1} xs />
           <Grid item md={10} xs={12}>
-            { (positionType === defaultValues.DEFAULT_TECHNICIAN_POSITION_TYPE) 
-              ? <QuestionSelection positionType={positionType} selectedQuestionId={`${selectedQuestionId}`} onChange={this.handleChange} />
-              : <TechnicianQuestionSelection subPositionType={subPositionType} selectedQuestionId={`${selectedQuestionId}`} onChange={this.handleChange} />
+            { (positionName === defaultValues.DEFAULT_TECHNICIAN_POSITION_TYPE) 
+              ? <TechnicianQuestionSelection subPositionType={subPositionType} selectedQuestionId={`${selectedQuestionId}`} onChange={this.handleChange} />
+              : <QuestionSelection positionName={positionName} selectedQuestionId={`${selectedQuestionId}`} onChange={this.handleChange} />
             }
           </Grid>
           <Grid item md={1} xs />
 
-          <Grid item xs={12} >
-            <Grid container spacing={8} alignItems="center">
+          <Grid item md={1} xs />
+          <Grid item xs={10} >
+            <Grid container spacing={8} justify="center" alignItems="flex-start">
               <Grid item sm={6} xs={12}>
                 { video && video.question }
               </Grid>
               <Grid item sm={6} xs={12} className={classes.centerText}>
-                <VideoPlayer url={video ? video.url : ''} />
+                <VideoPlayer url={video ? video.url : ''} width={'100%'} height={'100%'}/>
               </Grid>
               <Grid item xs />
             </Grid>
           </Grid>
+          <Grid item md={1} xs />
+          
         </Grid>
       </Panel>
     );
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/QuestionSelection.js b/frontend/src/containers/admin/EditProfiles/Videos/InterviewVideos/QuestionSelection.js
@@ -27,14 +27,14 @@ class QuestionSelection extends Component {
   };
 
   render() {
-    const { positionType } = this.props;
+    const { positionName } = this.props;
     const { selectedQuestionId } = this.state;
     return (
       <Grid container spacing={16} justify="center" alignItems="center">
         <Grid item xs={12}></Grid>
         <Grid item xs={12}>
           <FormControl component="fieldset">
-            <FormLabel component="legend">{`${positionType ? positionType.position_type : ''} Questions:`}</FormLabel>
+            <FormLabel component="legend">{`${positionName && positionName} Questions:`}</FormLabel>
             <RadioGroup
               aria-label="selectedQuestionId"
               name="selectedQuestionId"
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/ProfileVideos.js b/frontend/src/containers/admin/EditProfiles/Videos/ProfileVideos.js
@@ -14,7 +14,6 @@ class ProfileVideos extends React.Component {
 
   getInfoFromProps = (props) => {
     const { location } = props;
-    // let profile = (location && location.state && location.state.profile) ? location.state.profile : null;
     let profileId = (location && location.state && location.state.profileId) ? location.state.profileId : null;
     return { profileId };
   };
diff --git a/frontend/src/containers/admin/EditProfiles/Videos/ProfileVideosTable.js b/frontend/src/containers/admin/EditProfiles/Videos/ProfileVideosTable.js
@@ -4,18 +4,21 @@ import Grid from '@material-ui/core/Grid';
 import Spacer from 'components/general/spacer';
 import GreetingVideoItem from './GreetingVideoItem';
 import PositionVideoItem from './PositionVideoItem';
-import { filterSubSkillVideosByPosition, getSubSkillVideosByPositionType } from 'utils/appUtils';
+import { getSubSkillVideosByPositionType, getLiveVideosByPositionName, getCurrentTalentPositionName } from 'utils/appUtils';
 import { adminStyles } from 'styles';
 
 
 class ProfileVideosTable extends Component {
   render() {
     const { profile, greetingsVideos, interviewVideos, subSkillVideos, allPositionTypes, allSkills, classes } = this.props;
-    
+
     return (
         <Grid container spacing={32} justify="center" alignItems="center">
           <Grid item lg={4} md={6} xs={12}>
-            <GreetingVideoItem videos={greetingsVideos} interviewVideos={interviewVideos}/>
+            <GreetingVideoItem 
+              greetingVideos={greetingsVideos} 
+              interviewVideos={getLiveVideosByPositionName(interviewVideos, getCurrentTalentPositionName(profile))}
+            />
           </Grid>
           {profile && allPositionTypes && allPositionTypes.map(positionType => {
             if (positionType.video_audition_button_title) {
diff --git a/frontend/src/utils/appUtils.js b/frontend/src/utils/appUtils.js
@@ -167,6 +167,17 @@ export function getLiveVideos(talent_videos) {
   return res;
 }
 
+export function getLiveVideosByPositionName(talent_videos, positionName) {
+  let res = [];
+  if (talent_videos && talent_videos.length > 0) {
+    for (let i = 0; i < talent_videos.length; i ++) {
+      let video = talent_videos[i];
+      if (video.position_type === positionName) res.push(video);
+    }
+  }
+  return res;
+}
+
 export function checkPreviousShipMedical(medicals) {
   let checkingMedicals = [
     'Pregnancy',
@@ -221,6 +232,14 @@ export function  getLanguageIndex(name) {
   return defaultValues.LANGUAGES.indexOf(name);
 }
 
+export function getCurrentTalentPositionName(talent) {
+  return talent.talent_position_types[0] ? talent.talent_position_types[0].position_type : null;
+}
+
+export function getCurrentTalentPositionSubType(talent) {
+  return talent.talent_position_sub_types[0] ? talent.talent_position_sub_types[0].position_sub_type : null
+}
+
 export function findRelatedSkillByPositionName(skills, positionName) {
   return skills.find(function(skill) {
     return skill.related_position_type === positionName;
