Социальная подкаст-платформа
Рассмотрение сервисов, позволяющих прослушивать подкасты. Разработка платформы, сочетающей в себе функции для удобного поиска подкастов и возможность их обсуждения с ведущими и другими слушателями. Оценка удобства работы с пользовательским интерфейсом.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | дипломная работа |
| Язык | русский |
| Дата добавления | 14.12.2019 |
| Размер файла | 2,7 M |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
<div className="container-fluid">
<h2 className="text-center">@{this.state.myPage ? getCookie("username"): this.state.user !== null ? this.state.user.username: '...'}</h2>
<hr/>
<h4>id: <font
color="#A2A2A2"> {this.state.myPage ? getCookie("userId"): this.state.user !== null ? this.state.user.id: '...'}</font>
</h4>
{!this.state.editMode &&
<h4>Имя:
<font
color="#A2A2A2"> {this.state.myPage ? getCookie("name"): this.state.user !== null ? this.state.user.name: '...'}</font>
 
{this.state.myPage &&
<button className="btn btn-info btn-sm" type="button" onClick={() => {
this.onEditClick()
}}>
<span className="glyphicon glyphicon-pencil"></span>
</button>
}
</h4>}
{this.state.editMode &&
<h4>Имя:
<input ref="newName" placeholder={'Введите имя'} maxLength={30}/>
 
<button className="btn btn-info btn-sm" type="button" onClick={() => {
this.onEditOkClick()
}}>
<span className="glyphicon glyphicon-ok"></span>
</button>
</h4>}
<h4>Email:<font
color="#A2A2A2"> {this.state.myPage ? getCookie("userEmail"): this.state.user !== null ? this.state.user.email: '...'}</font>
</h4>
<hr/>
<h4>Подкасты:</h4>
{this.state.loadEnds &&
<UserProfilePagePodcastTable
myPage={this.state.myPage}
userId={this.state.myPage ? getCookie("userId"): this.state.user !== null ? this.state.user.id: '-1'}
history={this.props.history}
/>}
</div>
</div>
</div>
</div>
</div>
</div>
)
}
}
Файл: Discasst\src\main\resources\static\app\components\userPage\ UserProfilePageModalOnDelete.js
import React, {Component} from 'react';
export default class UserProfilePageModalOnDelete extends Component {
constructor(props) {
super(props);
this.state = {};
}
getName() {
if (this.props.podcast) return this.props.podcast.name;
return null
}
render() {
return (
<div className="modal fade" id="exampleModal" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div className="modal-dialog" role="document">
<div className="modal-content">
<div className="modal-header">
<button type="button" className="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div className="modal-body">
Удалить подкаст "{this.getName()}"?
</div>
<div className="modal-footer">
<button type="button" className="btn btn-secondary" data-dismiss="modal">Нет, я передумал
</button>
<button type="button" className="btn btn-primary" data-dismiss="modal"
onClick={this.props.onDelete}>Да, удалить подкаст
</button>
</div>
</div>
</div>
</div>
);
}
}
Файл: Discasst\src\main\resources\static\app\components\userPage\ UserProfilePagePodcastTable.js
import React from 'react';
import UserProfilePageModalOnDelete from './UserProfilePageModalOnDelete';
import {getCookie, getFullCSRFParam} from '../Helper';
export default class UserProfilePagePodcastTable extends React.Component {
constructor() {
super();
this.state = {
podcasts: -1,
coauthorPodcast: -1,
deletedPodcast: null
};
}
componentDidMount() {
if (this.props.userId !== '-1') this.getMyPodcasts();
}
getMyPodcasts() {
fetch(`/getPodcastsByUserId?id=${this.props.userId}`)
.then((response) => {
return response.json()
})
.then((json) => {
this.setState({podcasts: json});
this.getCoauthorPodcasts();
});
}
getCoauthorPodcasts() {
fetch(`/getPodcastsByUserIdInCoauthors?id=${this.props.userId}`)
.then((response) => {
return response.json()
})
.then((json) => {
this.setState({coauthorPodcast: json});
});
}
addEpisode = (item) => {
console.log("add episode to " + item.name);
this.props.history.push(`/createNewEpisode/${item.id}`);
};
deletePodcast = () => {
console.log("delete podcast " + this.state.deletedPodcast.name);
$.ajax({
url: `/removePodcast?id=${this.state.deletedPodcast.id}&${getFullCSRFParam()}`,
type: 'post',
success: () => {
this.props.history.push(`/user/${getCookie("username")}`);
},
error: (jqXhr, textStatus, errorThrown) => {
console.log(errorThrown + " " + textStatus);
}
});
window.location.reload();
};
chooseDeletedPodcast = (item) => {
this.setState({deletedPodcast: item});
};
addNewPodcast = () => {
console.log("add new podcast");
this.props.history.push(`/createNewPodcast`);
};
editCoauthors = (item) => {
this.props.history.push(`/addCoauthors/${item.id}`);
};
render() {
return (
<div className="panel panel-info" style={{backgroundColor: "#F9F9F9"}}>
<div className="panel-body">
{this.state.podcasts.length !== 0 && <h4>Созданные:</h4>}
{this.state.podcasts !== -1 && this.state.podcasts.map((item, num) =>
<div key={item.id}>
<div className="panel panel-info">
<div className="panel-body">
{this.props.myPage &&
<div style={{display: "flex", justifyContent: "center"}}>
<p className="h4" style={{width: "100%"}}><a onClick={() => {
this.props.history.push(`/podcast/${item.id}`)
}}>{item.name}</a></p>
<button className="btn btn-info btn"
onClick={() => this.editCoauthors(item)}><span
className="glyphicon glyphicon-user"></span> Изменить соавторов
</button>
  
<button className="btn btn-info btn" onClick={() => this.addEpisode(item)}><span
className="glyphicon glyphicon-plus"></span> Добавить выпуск
</button>
  
<button className="btn btn-danger btn" data-toggle="modal"
data-target="#exampleModal"
onClick={() => this.chooseDeletedPodcast(item)}
>
<span className="glyphicon glyphicon-remove"></span>
</button>
</div>}
{!this.props.myPage &&
<div style={{display: "flex", justifyContent: "center"}}>
<p className="h4" style={{width: "100%"}}><a onClick={() => {
this.props.history.push(`/podcast/${item.id}`)
}}>{item.name}</a></p>
</div>}
</div>
</div>
</div>
)}
{this.state.coauthorPodcast.length !== 0 && <h4>В соавторстве:</h4>}
{this.state.coauthorPodcast !== -1 && this.state.coauthorPodcast.map((item, num) =>
<div key={item.id}>
<div className="panel panel-info">
<div className="panel-body">
<div style={{display: "flex", justifyContent: "center"}}>
<p className="h4" style={{width: "100%"}}><a onClick={() => {
this.props.history.push(`/podcast/${item.id}`)
}}>{item.name}</a></p>
</div>
</div>
</div>
</div>
)}
{this.props.myPage &&
<button style={{height: "39px"}} className="btn btn-info pull-right"
onClick={this.addNewPodcast}>
<span className="glyphicon glyphicon-plus"></span> Добавить новый подкаст
</button>}
</div>
<UserProfilePageModalOnDelete onDelete={this.deletePodcast} podcast={this.state.deletedPodcast}/>
</div>
);
}
}
Размещено на Allbest.ru
...Подобные документы
Обзор существующих технологий разработки программного обеспечения. Описание платформы NET Framework. Принцип работы платформы: компиляция исходного кода; процесс загрузки и исполнения кода; IL-код и верификация. Новые возможности платформы NET Framework.
реферат [30,7 K], добавлен 01.03.2011Последовательность разработки информационного обеспечения очного и дистанционного обучения через просмотры и прослушивание подкастов. Создание веб-сайта или модуля существующей системы. Описание интерфейсов системы. Настройка прав доступа к подкастам.
дипломная работа [2,3 M], добавлен 19.11.2010Знакомство с особенностями и этапами разработки приложения для платформы Android. Рассмотрение функций персонажа: бег, прыжок, взаимодействие с объектами. Анализ блок-схемы алгоритма генерации платформ. Способы настройки функционала рабочей области.
дипломная работа [3,4 M], добавлен 19.01.2017Основы работы с многооконным графическим пользовательским интерфейсом операционной системы Windows95/NT. Основы работы с прикладными программами Windows и DOS. Разработка простого приложения для Windows при помощи средства разработки приложений DELPHI.
контрольная работа [281,0 K], добавлен 15.01.2009Облачные технологии - использование приложения, расположенного на удаленных серверах, посредством удобного пользовательского интерфейса. История и перспективы их развития. Платформы обслуживания "облаков". Положительные и отрицательные стороны сервисов.
презентация [770,2 K], добавлен 14.03.2017Отличительные черты смартфонов и коммуникаторов от обычных мобильных телефонов, их дополнительные возможности. Назначение и конфигурация платформы J2ME, ее функции. Порядок проектирования приложения для мобильного телефона на основе платформы J2ME.
дипломная работа [3,6 M], добавлен 05.09.2009Анализ хозяйственной деятельности организации и ее состояния. Особенности работы мобильной платформы. Реквизитный состав документов. Программная реализация и оценка эффективности приложения. Безопасность работы с приложением и безопасность данных.
дипломная работа [1,0 M], добавлен 13.06.2014Рассмотрение поисковых систем интернета как программно-аппаратного комплекса с веб-интерфейсом, предоставляющего возможность поиска информации. Виды поисковых систем: Archie, Wandex, Aliweb, WebCrawler, AltaVista, Yahoo!, Google, Яндекс, Bing и Rambler.
реферат [24,3 K], добавлен 10.05.2013База знаний интеллектуальной справочной системы по алгебре дробей со стандартными набором информационно-поисковых операций, пользовательским интерфейсом. Тестирование на стандартных вопросах и шаблонах поиска. Интеграция со смежными предметными областями.
курсовая работа [12,3 M], добавлен 06.05.2011Описание языков программирования Java и JavaFX. Среда разработки NetBeans и класс численных методов. Архитектура и принцип работы апплета с понятным пользовательским интерфейсом. Разработка алгоритма программы на примере модели межвидовой конкуренции.
курсовая работа [1023,2 K], добавлен 19.09.2012Понятие и функциональные особенности Java Card как версии Java-платформы для устройств с крайне ограниченными вычислительными ресурсами, оценка ее возможностей и необходимых ресурсов. Анализ степени безопасности платформы, взаимодействие компонентов.
презентация [1,0 M], добавлен 19.05.2014Описание платформы Deductor, ее назначение. Организационная структура аналитической платформы Deductor, состав модулей. Принципы работы программы, импорт и экспорт данных. Визуализация информации, сценарная последовательность и мастер обработки.
курсовая работа [3,7 M], добавлен 19.04.2014Рассмотрение и анализ моделей и алгоритмов семантического поиска в мультиагентной системе поддержки пользователей. Ознакомление с интерфейсом чата с ботом. Изучение и характеристика экспериментальных оценок релевантности и пертинентности запросов.
дипломная работа [3,0 M], добавлен 13.10.2017Изучение информационной базы клиента "Управление торговлей". Выбор и изучение платформы для построения сайта. Выбор технологии и среды разработки. Разработка основных алгоритмов решения задач и хранения данных. Проектирование интерфейса пользователя.
дипломная работа [1,1 M], добавлен 20.05.2017Разработка базы данных средней сложности с типовым пользовательским интерфейсом, а в частности, разработка базы данных СНАБЖЕНИЕ МАГАЗИНОВ на основе реляционной системы управления базами данных Microsoft Access, входящей в комплект Microsoft Office.
курсовая работа [2,1 M], добавлен 02.12.2012Разработка компьютерного приложения "Кипящая жидкость" с применением навыков программирования на языке Java. Проектирование алгоритма для решения поставленной задачи, его предметная область. Создание приложения с графическим пользовательским интерфейсом.
отчет по практике [3,0 M], добавлен 29.10.2015Возможности среды программирования delphi при разработке приложения с визуальным интерфейсом. Разработка спецификации программного обеспечения и на ее основе кода программного продукта. Отладка программы "трассировкой", ее тестирование и оптимизация.
курсовая работа [501,4 K], добавлен 07.12.2016Возможность поиска информации в режиме продвинутого диалога на естественном языке. Системы с интеллектуальным интерфейсом. Экспертные, самообучающиеся и адаптивные системы. Интеллектуальные базы данных. Системы контекстной и когнитивной помощи.
презентация [224,2 K], добавлен 16.10.2013Средства поиска информации в сети Интернет. Основные требования и методика поиска информации. Структура и характеристика поисковых сервисов. Глобальные поисковые машины WWW (World Wide Web). Планирование поиска и сбора информации в сети Интернет.
реферат [32,2 K], добавлен 02.11.2010Создание информационной системы работы такси с целью обеспечения диспетчерам более быстрого и удобного поиска необходимой информации. Создание таблиц и связей для работы с базами данных в среде Microsoft Access 2007. разработка запросов и отчетов.
курсовая работа [3,1 M], добавлен 06.05.2013
