Great idea from porneL, it now inserts a tab-stopped selector, background:, width: and height: for the dragged image if it's dropped into a source.css or course.css.embedded.html scope outside of a meta selector.

On Oct 24, 2006, at 7:25 AM, porneL wrote:

On Tue, 24 Oct 2006 12:27:07 +0100, Brett Terpstra brett@circlesixdesign.com wrote:

...

I figured out how to all-purpose-ify the image drag command. Now with one command, it can handle multiple situations. If you drag it:

Outside a selector/property (source.css): nothing happens

you could create a new rule, with background: width: and height:.

-- regards, porneL

---

For new threads USE THIS: textmate@lists.macromates.com (threading gets destroyed and the universe will collapse if you don't) http://lists.macromates.com/mailman/listinfo/textmate

Will this make it into any official release Alan?

Andreas

On Oct 24, 2006, at 17:31 , Hans-Joerg Bibiko wrote:

It works brilliant. Many thanks.

One very very tiny thing I changed. It prints a single space before TAB width:

I corrected this here:

... ${7:left}};\n " in ... ${7:left}};\n"

<Insert Image URL.tmDragCommand> <mime-attachment.txt> <mime-attachment.txt>

______________________

Andreas Wahlin Webbutvecklare

Webbhuset AB Östra Hamngatan 45, 411 10 Göteborg

Telefon: 031-339 19 19, Direkt: 031-739 18 20, Fax: 031-711 12 20 www.webbhuset.se

Privileged/confidential information may be contained in this message. If you are not the addressee indicated in this message (or responsible for delivery of the message to such person), you may not copy or deliver this message to anyone. In such case, you should destroy this message and kindly notify the sender by a reply email. Thank you.

Brett Terpstra wrote:

Great idea from porneL, it now inserts a tab-stopped selector, background:, width: and height: for the dragged image if it's dropped into a source.css or course.css.embedded.html scope outside of a meta selector.

And why not build the CSS selector to hide inner text.

In the same time I suppress awk warning : awk: AVERTISSEMENT:séquence d'échappement « $ » traitée simplement comme « » I redirect StdErr to Null. But I don't know if it's the way to do it in TextMate/awk ?

Best, Pierre Pracht

Brett Terpstra wrote:

That awk warning translates as something about the escape seqenuce treated simply as... but I don't know what it is and I don't get a warning... I suppose it can't hurt to redirect just in case. Under what circumstances does the warning appear?

I get same trouble with : Insert Image With Dimensions.

<img src="images/fond_colonne.gif" width="1018" height="1" tr: bornes d'intervalle de « _-] » sont en ordre inverse de séquence de comparaison. alt="">

I solve this one by changing the set of characters used with tr ('[_-]' to '_-')

All of this must be related to my fink setup. In fact I'm new to mac so...

I don't tend to use display:none to hide text when replacing images... I'd prefer to use text-indent:-9000px for accessibility reasons. It's still got issues if you view the page with CSS but images turned off, but it shows up for screen readers that way.

You right, to bad there is no IFR done right.

I would also need a tab stop on the "span", as I often use h1 tags inside of divs when replacing images.

All that being said, your assumption that dragging an image onto an empty source.css scope more than likely indicates the creation of an image replacement technique is probably correct. From an accessibility standpoint, if you're going to use background images, then replacing text is the only way to provide "alt" tags. But using display:none overrides the usefulness of the method, so it would be my suggestion that it be substituted with text-indent ...

Well text-indent: -9000px; overflow: hidden; doesn't work with span element (inline). So we must put : display:block; Then why not change text-indent: -9000px; to width:0; height:0; http://www.mezzoblue.com/tests/revised-image-replacement/#dwyer The whole code can be tan stopped so you let people put there preferred image replacement technique in it (better idea later).

and that the "span" be tab-stopped in addition (that's 10 tab stops! might be excessive).

For me using a mirror for the selector is a big win. Drop the whole IFR code can save a lot of time. In this case, tab stop the background is not useful.

Why not split the drag command for the two scope : meta.property-list.css : unchanged. (Just first part) source.css, source.css.embedded.html : multiple command for each image replacement technique.

So lazy people like me, would not stick with wrong technique ;)

Best, pierre pracht

I never really intend to suggest that all CSS Hacks must be in one command. My first thought was the split of the Drag Command in different scope. It would be easier for user to customize it for their own need.

I agree that snippets are far better place for CSS Hacks. May be a separate bundle with an associated WEB site. So they would be keep update and documented with people suggest and edit.

For KISS principle, why not use those scope :

string.quoted.single.css --> $TM_DROPPED_FILE

meta.property-value.css : with test : $TM_CURRENT_WORD=='url()' # aka variable.parameter.misc.css ? --> "'$TM_DROPPED_FILE'" #really need to quote ? (otherwise as needed) #can't url(^) give the right scope ? otherwise : --> url('$TM_DROPPED_FILE')

meta.property-list.css : # really need a full background declaration ? # why not let people use background snippet if they need it. --> background: url('$TM_DROPPED_FILE') no-repeat top left; # add width and height in a tab-stop --> width: ???px; --> height: ???px; # would be the place to do IFR and like

source.css, source.css.embedded.html : # build an id selector from images name img="$TM_DROPPED_FILE" base=${img##*/} --> #$base { background: #DDD url('$TM_DROPPED_FILE') repeat/repeat-x/repe... ; /* add width and height in a tab-stop */ width: ???px; height: ???px; }

meta.attribute-with-value.id.html : # to build an id from images name img="$TM_DROPPED_FILE" base=${img##*/} with test : string.quoted.double.html --> $base otherwise --> "$base"

meta.tag.block.any.html # to build an id and title from images name img="$TM_DROPPED_FILE" base=${img##*/} title=$(tr <<<${base%.*} '_-' ' '|perl -pe 's/(\w+)/\u$1/g') --> id="$base" title="$title"

to resume : need to add a background to an HTML element : type background adjust setting and add image to value want IFR and like : type or snip code and drop image in property list (get size) Have slice for an element : drop it in HTML and CSS (get size, id, title)

Too bad that TextMate don't let you give a list of string to show as tool tip on tab stop. Or better a function hook to compute completion on each one.

Just a last idea, is it possible to filter key modifier inside drag command ?

However, don't mind mind on these suggestions, HTML (as English) isn't my main activity.

Best, pierre pracht

Brett Terpstra wrote:

I'm as big a fan of overcomplication as anybody, but I think that this might be getting away from my original intention with the command. It's really just supposed to figure out into what context you've dropped an image and give it the appropriate "decoration". It's not supposed to do all your coding for you ;-). The problem is that the techniques are being revised and improved every couple of months and you can never account for all of the IE hacks required for some techniques. The amount of inserted code gets out of hand and everybody has different preferences that you'd waste a lot of time accounting for. Best, in my opinion, to let people create their own code and just provide tools to speed up the repetitive tasks.

My suggestion would be to create snippets for the different IFR techniques and tab stop the entire background, width and height section so that you can delete it if you have intentions of dragging an image in. Then have the drag command set up so that when dropped into the property value scope it inserts background url, width and height properties. Then you could just type ifr[tab] or mezzo[tab] etc. and get the technique you want, and have the image ready to drop in. Thoughts?

Brett

On 23. Nov 2006, at 23:23, Robert Nicholson wrote:

Can somebody tell me exactly why

the To: header of this email is

public-textmate-qhrM8SXbD5LrQoZeqNtYVVaTQe2KTcn/@ciao.gmane.org

just what is that? Did somebody reply to the list via list archives or something?

Via the GMANE interface, yes.

I try to filter list mail using the To: header but it now seems I should also include Reply-To in my checking

You should filter on list-id, which is: TextMate users <textmate.lists.macromates.com> (best to only use the address, not the label).