MyRandom/list.html at master · denis-gr/MyRandom · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html> <html lang=ru > <meta charset=UTF-8 > <meta name=viewport  content="width=device-width, initial-scale=1.0"> <meta name=description  content=Random > <title>MyRandom</title> <link rel=stylesheet  href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css"> <link rel=manifest  href="/MyRandom/manifest.webmanifest"> <link rel=apple-touch-icon  href="/MyRandom/icons/maskable_icon_x192.png" type="image/png"> <link rel="shortcut icon" href="/MyRandom/icons/maskable_icon_x192.png" type="image/png"> <meta name=theme-color  content="#ffffff" /> <script> window.addEventListener("load", () => navigator.serviceWorker.register("/MyRandom/sw.js", { scope: "/MyRandom/" })); </script> <header class="navbar navbar-expand-lg navbar-light bg-light"> <div class=container > <a class=navbar-brand  href="#">MyRandom</a> <button class=navbar-toggler  type=button  data-bs-toggle=collapse  data-bs-target="#navbarSupportedContent" aria-controls=navbarSupportedContent  aria-expanded=false  aria-label="Toggle navigation"> <span class=navbar-toggler-icon ></span> </button> <div class="collapse navbar-collapse" id=navbarSupportedContent > <ul class="navbar-nav me-auto mb-2 mb-lg-0"> <li class=nav-item > <a class=nav-link  href="/MyRandom/numbers.html">Числа</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/list.html">Список</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/passwords.html">Пароль</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/names.html">Названия</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/words.html">Слова</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/person.html">Личность</a> <li class=nav-item > <a class=nav-link  href="/MyRandom/about.html">О сайте</a> </ul> </div> </div> </header> <div id=app > <div class=container > <h1 class="text-center mb-3" v-text="$t('random_line')"></h1> </div> <div class="bg-secondary text-white p-4 text-center"> <pre class="container text-wrap text-break mb-0" style="font-size: 2rem;" v-text=answer ></pre>
    <div class=container  v-else v-text="$t('error')"></div>
</div>
<div class="container py-3">
    <div class="mb-3 row">
        <label for=field-list  class="col-sm-auto col-form-label" v-text="$t('list')"></label>
        <div class=col-sm >
            <textarea class=form-control  v-model=list  id=field-list  rows=10></textarea>
        </div>
    </div>
    <div class="mb-3 row justify-content-center">
        <label for=field-count  class="col-auto col-form-label" v-text="$t('how')"></label>
        <div class=col-auto >
            <input type=number  class=form-control  id=field-count  v-model=count >
        </div>
    </div>
    <div class=text-center >
        <a class="btn btn-primary" v-text="$t('generate')" @click=generate ></a>
    </div>
</div>

    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.min.js" defer></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue-i18n@8.22.4/dist/vue-i18n.min.js"></script>
    <script>
        const i18n = new VueI18n({
            locale: 'ru',
            messages: {
                ru: {
                    random_line: "Случайная строка",
                    list: "Список",
                    how: "Сколько",
                    generate: "Сгенерировать",
                    random_number_warn: "Наибольшее и минимальное числа входят в диапазон.",
                    from: "От",
                    to: "До",
                    random_number: "Случайное число",
                    length: "Длинна",
                    digits: "Цифры",
                    uppercase_latin_letters: "Прописные латинские буквы",
                    small_latin_letters: "Строчные латинские буквы",
                    special_characters: "Специальные символы",
                    generator_passwords: "Генератор паролей",
                    generator_names: "Генератор названий",
                    error: "Ошибка",
                    words: "Слова",
                    random_words: "Случайные слова",
                    lang: "Язык",
                    russian: "Русский",
                    english: "Английский",
                    age: "Полных лет",
                    birthdate: "Дата рождения",
                    company: "Компания",
                    firstname: "Имя",
                    lastname: "Фамилия",
                    nickname: "Ник",
                    password: "Пароль",
                    patronymic: "Отчество",
                    profession: "Профессия",
                    generator_person: "Генератор личностей",
                    passwor_requirement: "Требование к паролю",
                    birthdate_from: "Дата рождения от",
                    birthdate_to: "Дата рождения до",
                    use: "Использовать",
                    sex: "Пол",
                    a: "Любой",
                    m: "Мужской",
                    f: "Женский",
                    yes: "Да",
                    no: "Нет",
                    about_site: "О сайте",
                    description_items: "MyRandom - это веб приложение, позволяющие получать вам разнообразные случайные данные.;На данные момент доступны такие инструменты, как генерация одного или нескольких целых чисел в диапазоне, выбор одной или нескольких случайных строк из списка, генерация случайных паролей, генерация случайных названий на английском из ключевых слов, генерация случайных английских или русских существительных и генерация случайной информации о человеке на русском языке.;MyRandom - это PWA приложение, то есть оно оптимизировано для работы, а также дает возможность работы сайта без подключения к сети Интернет и возможность установить этот сайт и пользоваться им как обычным приложением (на некоторых браузерах).",
                    features: "Особенности",
                    features_items: "Является PWA;Может работать без интернета (после первой загрузки);Может устанавливаться, как обычное приложение (на некоторых браузерах);Имеет большой функционал;Не имеет рекламы",
                    technologies_used: "Используемые технологии",
                    technologies_used_items: "HTML5 - Основа любого сайта;Bootstap 5, CSS - Оформление;Vue, JavaScript - Работа сайта, реализованной в нем логики;Vue I18N - Интернализация (будет в будущем);ServiceWorcker - Работа сайта оффлайн;Manifest - Возможность установки сайта, как приложения;Django, Python - Подготовка сайта",
                    old_browser_support: "Создатель сайта не ставил целью поддержку старых браузеров.",
                    disclaimer: "Сайт не несет ответственности, ни за что.",
                    source_code: "Исходный код",
                },
            }
        });
    </script>

<script>
    function getRandomIntInclusive(min, max) {
        min = Math.ceil(min);
        max = Math.floor(max);
        return Math.floor(Math.random() * (max - min + 1)) + min;
    };

    function getRandomChoice(array) {
        return array[getRandomIntInclusive(0, array.length - 1)];
    };

    function getAnswer(count, list) {
        return new Array(Number(count)).fill(null).map(() =>
            getRandomChoice(list.split("\n"))).join("\n");
    };

    const vueApp = new Vue({
        el: "#app",
        i18n,
        data() {
            return {
                answer: "",
                list: `${this.$t("yes")}\n${this.$t("no")}`,
                count: 1,
            }
        },
        methods: {
            generate() {
                this.answer = getAnswer(this.count, this.list);
            },
        }
    });
    vueApp.generate();
</script>