Всё про браузер Opera
.: Форум сайта - operaman.ru :.

Opera браузер >> Opera for Windows

Страниц в этой теме: 1 | 2 | 3 | (показать все)
Первый пост темы

profiT
User
Предлагаю жесты для изменения размеров TEXTAREA 24/08/2005 20:23
 

После того, как мне указали на такую возможность в Файрфоксе, меня не покидала мысль, как это реализовать в Опере. И сделал. Заодно добавил стирание элемента страницы жестом.

Есть букмарклет на ОпераВики, но посмотрев его самого и его код, обнаружил, что он увеличивает размер у всех TEXTAREA, что при нескольких полях приведёт к прыганью макета, чего хотелось бы избежать.

Чтобы однозначно идентифицировать именно нужное поле, приделывается пользовательский скрипт. Есть подозрения, что вы с него поимеете побочные эффекты, но это потом исправлю. Сначала пусть народ заценит как работает.

Как это работает:

Жест "протянуть направо" на многострочном поле (TEXTAREA), увеличивает ширину поля. "Протянуть налево" -- уменьшает ширину.

Аналогично для жестов "протянуть вверх" и "протянуть вниз", они увеличивают/уменьшают высоту поля.

Вот что надо для этого сделать:

1. Скопировать два файла: пользовательский скрипт "lastHovered.js" и файл настройки мышиных жестов "resize and hide textareas.ini".

2. Пользовательский скрипт с путём, куда вы его положили, внести в ваш список скриптов в настройках.

3. Настройку мышиных жестов положить в папку "profile\mouse\". Если у вас уже есть своя настройка, объедините её текстовым редактором, там добавляются всего пять новых жестов: в разделе "Advanced"--"Edit widget" -- четыре, и в "Application" -- один сразу после заголовка.

Вот этот последний жест -- полный оборот по часовой стрелке, начиная с протяжки вверх (вверх-направо-вниз-влево) уничтожает элемент со страницы. В принципе, если этот жест выкинуть, то можно предполагать что побочные эффекты пользовательского скрипта сведуться на нет.

Есть мнение, что функционал можно расширить. Рацухи?

Stinger
Operaman
****

Зарегистр: 26/03/2004
Сообщений: 550
Re: Небольшой оффтоп. new 
21/05/2005 14:27   [Re: Kildor]   [post link]  

В ответ на:
Ты бы хоть поставил его и посмотрел сколько там места он занимает.

Охотно верю. Но это не избавляет от проблем с другими скриптами, когда один будет налезать на другой.

В ответ на:
зачем? если форма имеет удобный размер, то зачем всегда торчать кнопочкам?

Кнопочки могут появляться только при _наведении мышкой_ на форму ввода, как-бы "всплывать" рядом с формой(или по ее краям). Мешать в таком случае они не будут.

В ответ на:
Кому как - я вообще жесты не использую. Мне проще тянуть, чем фигуры вычерчивать

[OFFTOPIC]А я себя часто ругаю за то, что долгое время игнорировал мышинные жесты и стал их использовать относительно недавно[/OFFTOPIC]

В ответ на:
BodyID4all + user.css (если возможно для textarea задавать length/width) - там правишь. Не знаю насчет кукисов.


Задавать размеры textarea в CSS для каждого сайта, для каждой формы? Если добавлять вручную, то неудобно же.

Kildor

Спасибо. Будем отлавливать баги и глюки. Но лучше бы ты конечно для своего скрипта отдельную тему создал.

aga
Operaman
***

Зарегистр: 04/05/2004
Сообщений: 762
Из: россия, москва
Re: Небольшой оффтоп. new 
21/05/2005 14:52   [Re: Stinger]   [post link]  

этот новый скрипт всё же получше.
- скрипт profiT`а не работает с отключённым использованием текущей страницы, новый скрипт легко вместе с этой отключённой опцией работает.
- изменение размеров происходит очень быстро и без тормозов.
как работает скрипт profiT`f: я протянул поле ввода с зажатой правой кнопкой, отпустил правую клавишу, размер поля изменился.
и как работает новый скрипт: как с обычным окном винды - т.е. я тяну за квадрат и размер поля ввода изменяется.

места новый срипт занимает мизерно мало. в стандарте в углу правом нижнем небольшой квадрат, примерно пикселей 10. при нажатии на него около поля ввода появляются ва небольших квадратика пикселей наверное по 5: красный и синий, первый квадрат из правого нижнего угла исчезает. при зацеплении левой кнопкой синего квадрата (курсор мыши приобретает соответствующий вид) и передмещении мыши размер поля ввода изменяется. при нажатии на красный квадрат размер поля ввода возвращается к дефолтному.

aga
Operaman
***

Зарегистр: 04/05/2004
Сообщений: 762
Из: россия, москва
Re: Небольшой оффтоп. new 
21/05/2005 15:07   [Re: aga]   [post link]  

если в папке оперы оба скрипта изменения размеров, скрипт Prift`а по-крайней мере у меня не работает.

и ещё небольшая непонятка. не знаю, это только у меня так или у всех, но при использовании нового скрипта страница прокручивается небольшими рывками, подтормаживает. хотя это опять же может быть только у меня и только сейчас, а потом исправится.

пытался добавить вышеприведённых абзаца в конец предыдущего сообщения через редактирование, почему-то редактирование не было принято. т.е. я нажал кнопку исправления, эта страница обновилась, в конце предыдущего сообщения появилась надпись, что сообщение было отредакторовано агой (т.е. мною) число и время. но исправлений в виде первых двух абзацев не было видно.
это что: глюки форума или что-то другое?

Dimanish
User

Зарегистр: 07/03/2005
Сообщений: 120
Из: 52 RUS
Re: Небольшой оффтоп. new 
26/06/2005 13:06   [Re: aga]   [post link]  

Народ, скажите, пожалуйста, почему не работает готовый скрипт Resize Textarea 0.1, который я наглым образом вытянул из расширения resizeabletextarea v0.1a для FireFox? Вроде тотже javascript.... браузер должен влиять на работоспособностть скрипта?
вот код:
Code:
/*

Resize Textarea 0.1
Original coding by Raik Juergens
Contact: borstel33@web.de

*/

var resizeTa =
{
loaded: null,
TAlength: 0,

init: function (){
if (resizeTa.loaded)
return;
else{
resizeTa.loaded = true;
var appcontent = document.getElementById("appcontent");
if(appcontent)
appcontent.addEventListener("load", resizeTa.pageload, true);
}
},

pageload: function (aEvent){
resizeTa.doc = aEvent.originalTarget;
resizeTa.TA = resizeTa.doc.getElementsByTagName('TEXTAREA');
resizeTa.TAlength = resizeTa.TA.length;
if(resizeTa.TAlength == 0){
return;
}else{
resizeTa.rootElem = resizeTa.doc.getElementsByTagName('HTML')[0];
var i = resizeTa.TAlength;
while(i--){
resizeTa.newdiv('5' ,'1' ,'gripH_',i,'w' );
resizeTa.newdiv('1' ,'5' ,'gripV_',i,'n' );
resizeTa.newdiv('10','10','gripX_',i,'se');
}
resizeTa.newdiv('0','0','showCursor','','w');
CursorDiv = resizeTa.doc.getElementById('showCursor');
CursorDiv.removeEventListener('mousedown', resizeTa.activate, true);
CursorDiv.style.left = '0px';
CursorDiv.style.top = '0px';
resizeTa.posdivs();
window.addEventListener("resize",resizeTa.posdivs,true);
}
},

newdiv: function (w,h,id,nr,cu){
var grip = resizeTa.doc.createElement("div");
grip.setAttribute("ID", id+nr);
grip.setAttribute("STYLE", "position:absolute;width:"+w+"px;height:"+h+"px;cursor:"+cu+"-resize");
grip.addEventListener('mousedown', resizeTa.activate, true);
resizeTa.rootElem.appendChild(grip);
},

getposition: function (i){
var curElem = resizeTa.TA[i];
var curX = curElem.offsetLeft;
while (curElem.offsetParent) {
curX += curElem.offsetParent.offsetLeft;
curElem = curElem.offsetParent;
}
curElem = resizeTa.TA[i];
var curY = curElem.offsetTop;
while (curElem.offsetParent) {
curY += curElem.offsetParent.offsetTop;
curElem = curElem.offsetParent;
}
return [curX,curY]
},

posdivs: function (){
var k = resizeTa.TAlength;
while(k--){
curPos = resizeTa.getposition(k);
resizeTa.doc.getElementById('gripH_'+k).style.left = curPos[0]+resizeTa.TA[k].offsetWidth -3 + "px";
resizeTa.doc.getElementById('gripH_'+k).style.top = curPos[1] + "px";
resizeTa.doc.getElementById('gripH_'+k).style.height = resizeTa.TA[k].offsetHeight-8 + "px";
resizeTa.doc.getElementById('gripV_'+k).style.left = curPos[0] + "px";
resizeTa.doc.getElementById('gripV_'+k).style.top = curPos[1]+resizeTa.TA[k].offsetHeight-3 + "px";
resizeTa.doc.getElementById('gripV_'+k).style.width = resizeTa.TA[k].offsetWidth -8 + "px";
resizeTa.doc.getElementById('gripX_'+k).style.left = curPos[0]+resizeTa.TA[k].offsetWidth -8 + "px";
resizeTa.doc.getElementById('gripX_'+k).style.top = curPos[1]+resizeTa.TA[k].offsetHeight-8 + "px";
}
},

activate: function (e){
resizeTa.doc = e.target.ownerDocument;
resizeTa.TA = resizeTa.doc.getElementsByTagName('TEXTAREA');
CursorDiv = resizeTa.doc.getElementById('showCursor');
resizeTa.TAlength = resizeTa.TA.length;
var curTargetId = e.target.getAttribute('ID').split("_");
curTarget = curTargetId[0];
curTA_Nr = parseInt(curTargetId[1]);
resizeTa.doc.addEventListener('mouseup', resizeTa.deactivate, true);
switch(curTarget){
case "gripH": resizeTa.doc.addEventListener('mousemove', resizeTa.resizeta_h, true); break;
case "gripV": resizeTa.doc.addEventListener('mousemove', resizeTa.resizeta_v, true); break;
case "gripX": resizeTa.doc.addEventListener('mousemove', resizeTa.resizeta_x, true); break;
}
CursorDiv.style.width = resizeTa.rootElem.offsetWidth + "px";
CursorDiv.style.height = resizeTa.rootElem.offsetHeight + "px";
CursorDiv.style.cursor = e.target.style.cursor;
},

deactivate: function (){
resizeTa.doc.removeEventListener('mouseup', resizeTa.deactivate, true);
switch(curTarget){
case "gripH": resizeTa.doc.removeEventListener('mousemove', resizeTa.resizeta_h, true); break;
case "gripV": resizeTa.doc.removeEventListener('mousemove', resizeTa.resizeta_v, true); break;
case "gripX": resizeTa.doc.removeEventListener('mousemove', resizeTa.resizeta_x, true); break;
}
CursorDiv.style.width = '0px';
CursorDiv.style.height = '0px';
resizeTa.posdivs();
},

resizeta_h: function (e){
curPos = resizeTa.getposition(curTA_Nr);
resizeTa.TA[curTA_Nr].style.width = e.pageX - curPos[0] + "px";
},

resizeta_v: function (e){
curPos = resizeTa.getposition(curTA_Nr);
resizeTa.TA[curTA_Nr].style.height = e.pageY - curPos[1] + "px";
},

resizeta_x: function (e){
curPos = resizeTa.getposition(curTA_Nr);
resizeTa.TA[curTA_Nr].style.width = e.pageX - curPos[0] + 2 + "px";
resizeTa.TA[curTA_Nr].style.height = e.pageY - curPos[1] + 2 + "px";
}
}

window.addEventListener("load",resizeTa.init,false);


Сори за слишком большое сообщение.

Dennis_HAWKS
User
****

Зарегистр: 11/09/2003
Сообщений: 238
Из: Молдова, Тирасполь
Re: Небольшой оффтоп. new 
26/06/2005 16:39   [Re: Dimanish]   [post link]  

Работает другой user.js
Code:
// ==UserScript==
// @name ExpandArea
// @version 1.1
// @namespace http://stilleye.com/greasemonkey
// @author David Schontzler
// @description Adds button to make textareas expandable
// @include *
// @exclude gmail.google.com/*
// @exclude *.jot.com/*
// ==/UserScript==

(function() {
function expandArea(elms) {
var elms2 = [];
for(var i = 0; i < elms.length; i++) {
elms2.push(elms[i]);
}
for(var i = 0; i < elms2.length; i++) {
applyArea(elms2[i]);
}

function applyArea(elm) {
var w = elm.offsetWidth,
h = elm.offsetHeight;
var pos = getAbsolutePosition(elm);

var overlay = document.createElement("div");
overlay.style.width = w + "px";
overlay.style.height = h + "px";
overlay.style.position = "absolute";
overlay.style.left = pos.x + "px";
overlay.style.top = pos.y + "px";
overlay.style.padding = "4px";
overlay.style.zIndex = "999";
overlay.className = "ExpandArea";

var size = document.createElement("div");
size.style.width = size.style.height = "8px";
size.style.background = "#33f";
size.style.position = "absolute";
size.style.right = "-8px";
size.style.bottom = "-8px";
size.style.cursor = "nw-resize";
size.style.MozBorderRadius = "4px";
size.setAttribute("title", "Drag blue box to size the text area");
var offX, offY;
size.addEventListener("mousedown", function(e) {
offX = e.offsetX + 8; offY = e.offsetY + 8;
document.body.addEventListener("mousemove", doSize, false);
document.body.addEventListener("mouseup", endSize, false);
}, false);
overlay.appendChild(size);

var reset = size.cloneNode(false);
reset.style.background = "#c00";
reset.style.right = "1px";
reset.style.cursor = "pointer";
reset.setAttribute("title", "Click the red box to reset the size of the text area");
reset.addEventListener("click", function(e) {
overlay.style.width = w + "px";
overlay.style.height = h + "px";
}, false);
overlay.appendChild(reset);

var txt = document.createElement("textarea");
txt.value = elm.value;
txt.style.width = "100%";
txt.style.height = "100%";
txt.onkeyup = function(e) {
elm.value = this.value;
}
overlay.appendChild(txt);

document.body.appendChild(overlay);
elm.style.visibility = "hidden";

function doSize(e) {
var x = e.pageX - pos.x - offX;
var y = e.pageY - pos.y - offY;
if( x > 40 ) overlay.style.width = x + "px";
if( y > 40 ) overlay.style.height = y + "px";
}

function endSize(e) {
document.body.removeEventListener("mousemove", doSize, false);
document.body.removeEventListener("mouseup", endSize, false);
}
}

function getAbsolutePosition(elm) {
var x = 0, y = 0;
while( elm && elm != document.body ) {
x += elm.offsetLeft;
y += elm.offsetTop;
elm = elm.offsetParent;
}
return { x: x, y: y };
}
}

function setup() {
if( !document.getElementsByTagName("textarea").length ) return;

var on = document.createTextNode("Expand Textarea");
var off = document.createTextNode(String.fromCharCode(160) + String.fromCharCode(171) + String.fromCharCode(160));

var html = "&nbsp;&laquo;&nbsp;";
var trigger = document.createElement("div");
trigger.appendChild( off );
with(trigger.style) {
position = "fixed";
right = bottom = "0px";
color = "black";
background = "white";
border = "1px solid";
padding = "3px";
font = "10px sans-serif";
cursor = "pointer";
MozOpacity = ".4";
}
document.body.appendChild(trigger);
trigger.onmouseover = function() {
this.replaceChild(on, off);
}
trigger.onmouseout = function() {
this.replaceChild(off, on);
}
trigger.onclick = function() {
expandArea(document.getElementsByTagName("textarea"));
this.parentNode.removeChild(this);
}
}

window.addEventListener("load", setup, false);
})();





Dimanish
User

Зарегистр: 07/03/2005
Сообщений: 120
Из: 52 RUS
Re: Небольшой оффтоп. new 
26/06/2005 17:08   [Re: Dennis_HAWKS]   [post link]  

Ну да этот скрипт работает, только почему-то страница тормозить начинает... Да и не так красиво как в FF получается.

Dennis_HAWKS
User
****

Зарегистр: 11/09/2003
Сообщений: 238
Из: Молдова, Тирасполь
Re: Небольшой оффтоп. new 
26/06/2005 17:12   [Re: Dimanish]   [post link]  

там еще и другие глюки есть.
Особенно на форумах забывается тема и юзер.

AndreyI
User

Зарегистр: 06/07/2003
Сообщений: 97
Re: Предлагаю жесты для изменения размеров TEXTAREA new 
27/06/2005 20:45   [Re: Dennis_HAWKS]   [post link]  

В ответ на:
Ура наконец-то появился работающий скрипт для увеличения textarea - дали здесь...

А у меня с этим скриптом что-то не то с окном ответа происходит: если я что-нибудь сначала напишу в окне, а потом через некоторое время исправлю или допишу, то отправляется в итоге то, что было написано сначала, а исправления и дополнения куда-то исчезают

profiT
User
****

Зарегистр: 13/11/2004
Сообщений: 224
Из: Караганда
Re: Предлагаю жесты для изменения размеров TEXTAREA new 
24/08/2005 20:23   [Re: AndreyI]   [post link]   Прикреплённые файлы (467 downloads)

Тут некоторое затишье образовалось... Работаем, учимся. Ну, ладно, в общем я тут вам принёс обновлённую версию моего скрипта с жестами. В прикреплённом файле, ридми внутри.

Изменение там с прошлой версии только одно: теперь мой скрипт работает и с отключенной галкой "использовать текущую страницу" (вроде работает с версии 8.02tp2).

Как это делается: команда "Goto page" теперь поддерживает второй аргумент и если задать его как 1, то адрес будет запускаться на текущей странице вне зависимости от значения той галки.

Исправлено profiT (24/08/2005 21:22)

Страниц в этой теме: 1 | 2 | 3 | (показать все)  

Opera браузер >> Opera for Windows

Дополнительные сведения
0 зарег. и 130 анонимные пользователи просматривают этот форум.

Модератор:  netman, van_grieg, alter, Angolier, Pechkin 

Распечатать тему

Разрешения
      Вы не можете создавать новые темы
      Вы не можете отвечать в темах
      HTML запрещен
      UBBCode разрешен

Рейтинг: *****
Тема просмотрена: 55561

Оценить эту тему
Быстрый поиск
Перейти на



  
Отправить email администрации operaman.ru - Home

© 2000-2002. Николай Ковальчук - All rights reserved
Rambler's Top100