Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WIP: Strings with some feature dev for Channel browse and search #8424

Merged
Merged
Changes from 1 commit
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
MVP CategoryModal (no strings added), update constants, and adjust pa…
…ge layout
marcellamaki committed Sep 8, 2021
commit 6d0ebf0581925357a1c74ce6bf8732e02f526714
106 changes: 104 additions & 2 deletions kolibri/core/assets/src/constants.js
Original file line number Diff line number Diff line change
@@ -29,6 +29,20 @@ export const ContentNodeKinds = {
SLIDESHOW: 'slideshow',
};

// coach-facing
export const ContentNodeResourceType = {
LESSON: 'Lesson',
TUTORIAL: 'Tutorial',
ACTIVITY: 'Activity',
EXERCISE: 'Exercise',
MEDIA: 'Media',
BOOK: 'Book',
GAME: 'Game',
GUIDE: 'Guide',
TEXTBOOK: 'Textbook',
LESSON_PLAN: 'Lesson plan',
};

export const LearningActivities = {
CREATE: 'create',
LISTEN: 'listen',
@@ -48,14 +62,102 @@ export const ContentKindsToLearningActivitiesMap = {
video: LearningActivities.WATCH,
};

// Resource library categories and subcategoriess
export const LibraryCategories = {
ALL_CATEGORIES: 'all_categories',
SCHOOL: 'school',
BASIC_SKILLS: 'basic_skills',
WORK: 'work',
DAILY_LIFE: 'daily_life',
FOR_TEACHERS: 'for_teachers',
OTHER: 'other',
};

export const SchoolCategories = {
MATHEMATICS: 'Mathematics',
SCIENCES: 'Sciences',
LITERATURE: 'Literature',
SOCIAL_SCIENCES: 'Social Sciences',
ARTS: 'Arts',
COMPUTER_SCIENCE: 'Computer Science',
LANGUAGE_LEARNING: 'Language learning',
HISTORY: 'History',
};

export const MathematicsSubcategories = {
ARITHMETIC: 'Arithmetic',
ALGEBRA: 'Algebra',
GEOMETRY: 'Geometry',
CALCULUS: 'Calculus',
STATISTICS: 'Statistics',
};

export const SciencesSubcategories = {
BIOLOGY: 'Biology',
CHEMISTRY: 'Chemistry',
PHYSICS: 'Physics',
EARTH_SCIENCE: 'Earth science',
ASTRONOMY: 'Astronomy',
};

export const LiteratureSubcategories = {
LITERATURE: 'Literature',
READING_COMPREHENSION: 'Reading comprehension',
WRITING: 'Writing',
LOGIC_AND_CRITICAL_THINKING: 'Logic and critical thinking',
};

export const SocialSciencesSubcategories = {
POLITICAL_SCIENCE: 'Political science',
SOCIOLOGY: 'Sociology',
ANTHROPOLOGY: 'Anthropology',
CIVIC_EDUCATION: 'Civic education',
};

export const ArtsSubcategories = {
VISUAL_ART: 'Visual art',
MUSIC: 'Music',
DANCE: 'Dance',
DRAMA: 'Drama',
};

export const ComputerScienceSubcategories = {
PROGRAMMING: 'Programming',
MECHANICAL_ENGINEERING: 'Mechanical engineering',
WEB_DESIGN: 'Web design',
};

export const BasicSkillsCategories = {
LITERACY: 'Literacy',
NUMERACY: 'Numeracy',
DIGITAL_LITERACY: 'Digital literacy',
LOGIC_AND_CRITICAL_THINKING: 'Logic and critical thinking',
LEARNING_SKILLS: 'Learning skills',
};

export const WorkCategories = {
PROFESSIONAL_SKILLS: 'Professional skills',
TECHNICAL_AND_VOCATIONAL_TRAINING: 'Technical and vocational training',
};

export const VocationalSubcategories = {
TOOLS_AND_SOFTWARE_TRAINING: 'Tools and software training',
SKILLS_TRAINING: 'Skills training',
INDUSTRY_AND_SECTOR_SPECIFIC: 'Industry and sector specific',
};

export const DailyLifeCategories = {
PUBLIC_HEALTH: 'Public health',
ENTREPRENEURSHIP: 'Entrepreneurship',
FINANCIAL_LITERACY: 'Financial literacy',
CURRENT_EVENTS: 'Current events',
ENVIRONMENT: 'Environment',
MEDIA_LITERACY: 'Media literacy',
DIVERSITY: 'Diversity',
MENTAL_HEALTH: 'Mental health',
};

export const TeachersCategories = {
GUIDES: 'Guides',
LESSON_PLANS: 'Lesson Plans',
};

export const ResourcesNeededTypes = {
131 changes: 131 additions & 0 deletions kolibri/plugins/learn/assets/src/views/CategorySearchModal.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,131 @@
<template>

<KModal
:title="$tr('title')"
:cancelText="coreString('closeAction')"
size="large"
@cancel="$emit('cancel')"
>

<KFixedGrid
v-if="categoryGroupIsNested"
:numCols="12"
:style="{ margin: '24px' }"
>
<KFixedGridItem
v-for="(nestedObject, key) in displaySelectedCategories"
:key="key"
:span="4"
>
<KIcon
icon="info"
size="large"
/>
<h2>All {{ key }}</h2>
<p
v-for="item in nestedObject"
:key="item"
>
{{ item }}
</p>
</KFixedGridItem>
</KFixedGrid>
<KFixedGrid
v-else
:numCols="12"
:style="{ margin: '24px' }"
>
<KFixedGridItem
v-for="value in displaySelectedCategories"
:key="value"
:span="4"
>
<KIcon
icon="info"
size="large"
/>
<h2>{{ value }}</h2>
</KFixedGridItem>
</KFixedGrid>
</KModal>

</template>


<script>

import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
import {
SchoolCategories,
MathematicsSubcategories,
SciencesSubcategories,
LiteratureSubcategories,
SocialSciencesSubcategories,
ArtsSubcategories,
ComputerScienceSubcategories,
BasicSkillsCategories,
WorkCategories,
// VocationalSubcategories,
DailyLifeCategories,
TeachersCategories,
} from 'kolibri.coreVue.vuex.constants';

const filterToCategoryNameMap = {
school: SchoolCategories,
'basic skills': BasicSkillsCategories,
work: WorkCategories,
'daily life': DailyLifeCategories,
'for teachers': TeachersCategories,
};

const schoolSubcategoriesMap = {
MATHEMATICS: MathematicsSubcategories,
SCIENCES: SciencesSubcategories,
LITERATURE: LiteratureSubcategories,
HISTORY: null,
SOCIAL_SCIENCES: SocialSciencesSubcategories,
ARTS: ArtsSubcategories,
COMPUTER_SCIENCE: ComputerScienceSubcategories,
// LANGUAGE_LEARNING: LanguageLearningSubcategories,
};

export default {
name: 'CategorySearchModal',
mixins: [commonCoreStrings],
props: {
selectedCategory: {
type: String,
required: true,
default: null,
},
},
data: function() {
return {
categoryGroupIsNested: {
type: Boolean,
default: false,
},
};
},
methods: {
displaySelectedCategories() {
let categoryGroup = filterToCategoryNameMap[this.selectedCategory];
if (this.selectedCategory === 'school' || this.selectedCategory === 'work') {
let nestedCategoryObject = {};
Object.keys(categoryGroup).map(category => {
let key = categoryGroup[category];
nestedCategoryObject[key] = schoolSubcategoriesMap[category];
});
this.categoryGroupIsNested = true;
return nestedCategoryObject;
}
this.categoryGroupIsNested = false;
return categoryGroup;
},
},
$trs: {
title: 'Choose a category',
},
};

</script>
36 changes: 31 additions & 5 deletions kolibri/plugins/learn/assets/src/views/EmbeddedSidePanel/index.vue
Original file line number Diff line number Diff line change
@@ -18,6 +18,17 @@
Categories
</h2>
<!-- list of category metadata - clicking prompts a filter modal -->
<div
span="4"
class="category-list-item"
>
<KButton
text="All Categories"
marcellamaki marked this conversation as resolved.
Show resolved Hide resolved
appearance="flat-button"
:appearanceOverrides="customCategoryStyles"
@click="$emit('filterResults', value)"
/>
</div>
<div
v-for="(value, category) in libraryCategoriesList"
:key="category"
@@ -29,6 +40,18 @@
appearance="flat-button"
:appearanceOverrides="customCategoryStyles"
iconAfter="chevronRight"
@click="$emit('openModal', value)"
/>
</div>
<div
span="4"
class="category-list-item"
>
<KButton
text="Other"
appearance="flat-button"
:appearanceOverrides="customCategoryStyles"
@click="$emit('filterResults', value)"
/>
</div>
<ActivityButtonsGroup class="section" />
@@ -43,7 +66,7 @@
>
<KCheckbox
key="adHocLearners"
:checked="isSelected"
:checked="isSelected(value)"
:label="value"
@change="$emit('toggleSelected', $event)"
/>
@@ -80,10 +103,6 @@
},
},
computed: {
isSelected() {
return false;
},

libraryCategoriesList() {
let libraryCategories = {};
Object.keys(LibraryCategories).map(key => {
@@ -123,6 +142,12 @@
};
},
},
methods: {
isSelected(value) {
console.log(value);
return value === 'For beginners' ? false : true;
},
},
};

</script>
@@ -131,6 +156,7 @@
<style lang="scss" scoped>

.side-panel {
position: fixed;
height: 100%;
padding: 30px 40px !important;
padding-bottom: 120px !important;
Loading