```javascript var tasks = [] $("h2").each(function(){ var text = $(this).text().split(' ') var name = text[0] var weight = text[1] tasks.push({name: name, weight: weight}) }) var rate = 10; var randomValues = tasks.map(function(item){ return Math.random()*(10-Math.abs(rate - item.weight)) }) //alert(tasks[randomValues.indexOf(Math.max.apply(Math, randomValues))].name) alert(tasks.splice(randomValues.indexOf(Math.max.apply(Math, randomValues)),1)[0].name) ``` ## Галерея 8 Галерея (img, prev, next) + лента thumbnails. Hashlinks (?) ```javascript $("#container").gallery([['url1.jpg','thumb1.jpg'],['url2.jpg', 'thumb2.jpg']],{thumbSize: 100, thumbPosition: 'top', effect: "//JQUERY ANIMATE OPTIONS"}) $("#container").gallery("currentPosition") //number in gallery array $("#container").gallery("currentImage") //array with URLS of image and thumbnail ``` ## Тест 8 ```javascript var tests = [{question: "Сколько вам лет?", answers: ["<5","5..10","10..20"]}, {question: "Ваш пол?", answers: ["мужской", "женский"]}] $("#container").test(tests); //.... $("#container").test("results"); // ["10..20", "мужской"] ``` ## TreeControl 9 ```javascript var cars = { minivan: { mercedes: ["b250", "2102"], volkswagen: ["touran"] }, sedan: { bmw: ["328", "530"], lada: ["2107"] }, } $("#container").tree(cars); // строит вложенный tree control по аналогии с деревом папок ``` ## GridView 6 ```javascript $("#container").grid([{name: "aaaa", surname: 'bbbb'},{name: "aaaa", surname: 'bbbb'}], [{key: "name", width: 200, title: "Имя"}, {key: "surname", width: 200, title: "Фамилия"}], 10 /* количество записей на странице */); // строит grid control по типу slickgrid, jqgrid. ``` ## ToolTip 3 ```javascript $("a.hinted").toolTip(); ``` Аналог https://jqueryui.com/tooltip/ ## Magnifier 3 ```javascript $("#block").magnify(1.5); //увеличивается в полтора раза block ``` ## MenuBuilder 5 Скреативьте плагин `menuBuilder`, которая из структуры ```javascript var menu = [{text: "google", href: "http://google.com"}, {text: "ebay", href: "http://ebay.com"}, {text: "ya", href: "http://ya.ru"}, ]; ``` создает меню используя `ul`, `li`, `a` в определенном контейнере. `id` контейнера передается в качестве параметра: ```html ... ... ``` ```javascript $("#menuContainer").menuBuilder(menu); //построить меню в элементе с id "menuContainer". ``` Сделайте возможность выделения "текущего" пункта меню. У него должен быть другой класс, который можно задать в конфигурации плагина ```javascript var config = { hrefClass: 'someClassForHref', //класс, который добавляется в каждую ссылку currentClass: 'currentHref', //класс, который добавляется в текущую ссылку currentHref: 'http://ya.ru', //или // currentHref: 2, //второй элемент } $("#menuContainer").menuBuilder(menu, config); //построить меню в элементе с id "menuContainer", с указанием классов и текущей ссылки другого вида ``` ## ScrollableFlyingBlock 6 Сделать плагин, который обеспечивает "прилепленное" поведение блока на странице (на подобие меню сайта). Меню должно иметь *css* `position: fixed`, однако при скролле мышью, если блок не влазит по высоте в страницу, он должен прокручиваться (т. е. временно "прилипать" к остальной странице) ```javascript $('#leftMenu').scrollableFlyingBlock(); //контейнер левого меню #leftMenu левитирует над страницей $('#right').scrollableFlyingBlock(); //контейнер правого блока меню #right левитирует над страницей ``` ## GrafityBox 4 Оформить рисовалку из дз в форме плагина. Обеспечить работу нескольких плагинов одновременно на странице. ```javascript $("#container").grafityBox({width: 400, height: 400}) // создает в div#container вложенные элементы (canvas размерами из конфигурации, выбор цвета-инструмента и т. п.) ``` ## ValidatedFormBuilder 6 Создает форму, при изменении данных в которой вызываются функции-валидаторы ```javascript $("#form").formBuilder({login: {value: "", type: "text", hint: "Логин"}, password: {value: "", type: "password", hint: "Пароль" validator: function(){}}, password2: {value: "", type: "password", hint: "Пароль 2" validator: function(){}}, }); //увеличивается в полтора раза ``` ## GraphPlot 8 Рисует график, координатные оси, то ли по точкам, то ли с помощью callback-функции. В конфигурации передаются размеры координатной плоскости ```javascript $("#plotContainer").graphPlot({xMin: -5, yMin: -2, xMax: 5, yMax: 2},[{x: -5, y: -2}, {x: 5, y: 2}]) //две точки на графике $("#plotContainer").graphPlot({xMin: -5, yMin: -2, xMax: 5, yMax: 2},function(x){ //функция return Math.sin(x); }) ``` ## SalfetkaDraw 9 главная настройка - количество секторов (угол между ними). И что бы работало. ## PiePlot 6 Рисует круговые диаграммы на подобие jqPlot. ```javascript $("#container").piePlot([ {name: 'bucks', value: 100, color: 'green'}, {name: 'eur', value: 50, color: 'blue'}, {name: 'uah', value: 5, color: 'red'}, ]) ``` ## UpScroll 8 Создать плагин, который обеспечивает перемотки страницы вверх по нажатию на блок, запоминает при этом позицию на странице и возвращается при нажатии наверху. Перемотку сделать плавной. ```javascript $('#up').upScroll({ down: "#down", //или // down: "
ВНИЗ
", //различать селектор или html по первому символу ('<' или нет?) interval: 20, //функция animation вызывается раз в 20 ms, используя setInterval animation: function(startPos, step, position){ //координата начала скролла, номер шага, текущая позиция. Функция вызывается раз в interval time и должна возвращать новую позицию страницы. return position - step //новая позиция на номер шага выше предыдущей. Скроллинг постепенно линейно разгоняется вверх, пока не достигается вверх страницы. } }) ```