Entr'Acte

Entr'Acte

Entr'Acte 0.08

Well here it is finally. Finally got some time to work on it. I've created a new forum topic to cover Entr'Acte. I'll post updates to it here. The version number incremented by .02 simply because there were two versions of the skin that I and a friend of mine used internally. They were fubared, so we never released them. It should be a nice improvement over the last versions. You can get it here.

Changelog:
<ol>
<li>The list header arrow bug is gone.
<li>Borders added to the right of the Address Bar, Navigation Bar, View Bar, and the Content Block Bar to better support panels placed on the right. I know it's not native to have borders on the outside of a window, but this is the only way to do it.
<li>Rearranged things to better support hacks. They will be listed farther down.
<li>Improvements to the Pagebar implementation on both the top and bottom variations. The Pagebar now supports items placed on the Pagebar header to better support the default toolbar setup.
<li>Support for doubled scrollbars (OS X default).
<li>Minor cosmetic improvements.
</ol>
Also, expect a completely custom icon set in the next version.

Hacks:

To apply these hacks you have to open up the zip file provided, find these items in the skin.ini file, and replace. You then replace the skin.ini file within the archive with the new one and rezip it. The images and such are already within the skin.

Top & Bottom Scrollbars:

[Scrollbar Horizontal Skin]
Tile Left	= doodads/scrollbar/horizontal/left-inactive.png
Tile Right = doodads/scrollbar/horizontal/right-inactive.png

[Scrollbar Horizontal Left Skin]
Tile Center = doodads/scrollbar/horizontal/leftarrow-inactive.png

[Scrollbar Horizontal Left Skin.pressed]
Tile Center = doodads/scrollbar/horizontal/leftarrow-active.png

[Scrollbar Vertical Skin]
Tile Top = doodads/scrollbar/vertical/top-inactive.png
Tile Bottom = doodads/scrollbar/vertical/bottom-inactive.png

[Scrollbar Vertical Up Skin]
Tile Center = doodads/scrollbar/vertical/uparrow-inactive.png

[Scrollbar Vertical Up Skin.pressed]
Tile Center = doodads/scrollbar/vertical/uparrow-active.png

No Items in Pagebar Head (Removes Pagebar header):

[Pagebar Head Skin.top]
Padding Left = 2

Lighter Tabs (When bars other than personal bar is above it):

[Pagebar Button Skin.top.selected]
Tile Center = window/bg.png

Large Tabs (For people who want selectable items in pagebar head & foot to look right):

[Pagebar Button Skin.top]
Padding Top = 7
Padding Bottom = 10

[Pagebar Button Skin.top.selected]
Padding Bottom = 8

[Pagebar Skin.bottom]
Tile Center = bars/pagebar/bottom/large/bg.png

[Pagebar Button Skin.bottom]
Tile Left	= bars/pagebar/bottom/large/tabs/inactive/divider.png
Tile Right = bars/pagebar/bottom/large/tabs/inactive/divider.png
Padding Top = 8
Padding Bottom = 8

[Pagebar Button Skin.bottom.hover]
Tile Center = bars/pagebar/bottom/large/tabs/inactive/hover/bg.png
Tile Right = bars/pagebar/bottom/large/tabs/inactive/hover/divider.png

[Pagebar Button Skin.bottom.selected]
Tile Center = bars/pagebar/bottom/large/tabs/active/bg.png
Tile Left	= bars/pagebar/bottom/large/tabs/active/divider.png
Tile Right = bars/pagebar/bottom/large/tabs/active/divider.png

This is great! Thank you so much for the update, the scrollbars were something I was looking forward to, and I'm glad you made it the default.

I don't quite understand some of the tweaks you describe. I tried "No Items in Pagebar Head (Removes Pagebar header)" but saw nothing - what is the pagebar header? What is "Large Tabs (For people who want selectable items in pagebar head & foot to look right)"? Some clarification would be great. I also noticed that the OS X archiver now seems to make zip files that Opera accepts, which is good.

By the way - http://img.soaringrabbit.com/opera-mac.png This really is how Opera should be shipping on the Mac. I can't understand why they don't follow the practices of your skin and make it nice like that.

Hey Khadgar, very nice theme. Thanks for the update. I wish opera would just make it look more mac like from the start maybe is just wishing too much lol.

Originally posted by SuitCase:

I don't quite understand some of the tweaks you describe. I tried "No Items in Pagebar Head (Removes Pagebar header)" but saw nothing - what is the pagebar header? What is "Large Tabs (For people who want selectable items in pagebar head & foot to look right)"? Some clarification would be great. I also noticed that the OS X archiver now seems to make zip files that Opera accepts, which is good.

Sorry. I was going by what the skinning system calls them. Here's what they are:

No Items in Pagebar Head
The pagebar is the bar with the tabs in it obviously, but the pagebar header is the spot where you can put icons in front of the tabs. The spot where you can put icons on the right is called the pagebar tail. When you apply that hack it removes the uneeded spacing before the first tab. It has the first tab begin at the edge of the window instead of a few pixels beyond. It looks like I overcompensated a little bit judging by your screenshot. I'll update it when I do the next version.

Lighter Tabs
I made this little hack for people who don't have the personal bar on or do not have it at the top. Other bars are lighter than the personalbar is, so using the lighter stripes. Take your screenshot as an example... the tabs are darker than the main bar that's above it. This hack will fix that little eyesore.

Large Tabs
This is for people who find it annoying that when you have selectible items in the pagebar header or pagebar tail (like the Panel Toggle item for example) that the select box that is created around it overlaps the borders and creates a rather annoying unpolished look. This hack makes the bars larger to allow those such items to have room. If you don't have things in the pagebar like that or don't care about how it looks then this hack isn't for you.

BetterZip now makes zip files that Opera likes, yeah. The man who develops that program is an awesome person. I wish more developers were like him, and I wish more people knew of his excellent product. That along with a licensed copy of RAR does it all for me. I have Stuffit around for mainly sit and hqx files. I leave everything else up to BetterZip. Speaking of which I need to send him another bug I found...

I think something minimalist like that screenshot with the panel selector items at the top instead of the left would be a good way for them to start (it used to be that way, actually ). I've slowly been trying to create fake screenshots to show the devs what I would like to be feasible in Opera 10's skinning system or in a more recent version of Opera. The native skin is truely native just because it uses the default doodads provided by Interface Builder and the Carbon library, but that's where its nativity ends. They've done a great job with porting the browser to the Mac, but after 2 versions it's time to give the interface a high pressure washing so to speak.

Anyway, I hope that clears some of the questions up, and here's a little hint at what is coming in the next version. I'll explain more about it when I get more done.

Hi Khadgar-

Ent'Acte 0.08 is Excellent. Thanks for a really nice Mac Opera skin.

I have some trouble getting "lighter tabs" to work. Or at least I think so.
I might be wrong, then please correct me.
This is how it looks http://upl.yao.se/?a=ef7e4.png
The tabs get light when I have them on the bottom of the screen though.
This is my skin.ini

skin.ini

You have it working. It's just that you don't have anything above it for it to merge into. If you put the mainbar above the pagebar you'd see. I probably need to rephrase it because the default layout has the pagebar as the topmost bar. I might produce a hack to make the tabs link at the bottom rather than at the top. Just give me a bit...

Thanks for the information Khadgar. I'm still confused though.
http://upl.yao.se/?a=65ce1.png At top, but with the mainbar above it. Still grey.
http://upl.yao.se/?a=51617.png At bottom, so light and clean

The lighter tabs hack is only for the pagebar aligned at the top. The personalbar uses a slightly darker color as you can see here. The one on the right clearly is lighter. It's made to blend into the main bar instead of the personalbar like the default one is. The other tabs that you are seeing at the bottom are what the tabs look like on the bottom only (tabs look different when set to the left and right, too). It's quite possible to change the top tabs to look like the bottom tabs. Here's how:

Make Top Tabs Look Like Bottom Tabs:

[Pagebar Skin.top]
Clone = Pagebar Skin.bottom

[Pagebar Head Skin.top]
Clone = Pagebar Head Skin.bottom

[Pagebar Button Skin.top]
Clone = Pagebar Button Skin.bottom

[Pagebar Button Skin.top.hover]
Clone = Pagebar Button Skin.bottom.hover

[Pagebar Button Skin.top.selected]
Clone = Pagebar Button Skin.bottom.selected

[Pagebar Button Skin.top.selected.hover]
Clone = Pagebar Button Skin.bottom.selected.hover

This one works differently than the other hacks as this one needs to replace everything in those skinning items, so you'd replace Pagebar Skin.top with the one I have here and so forth. Theoretically this should work. I haven't tested it like I have the other hacks. Be sure to backup your skin.ini file anyway before doing these hacks as something could go wrong.

Thanks a lot!

That's a nice list of new features, fixes and hacks. Your skin is the first thing I download and install for Opera whenever I do a new installation (even on Windows machines). Can't wait till you implement the new icon set, it sure looks good :-)

Thanks Glad you like it.

I did some testing, and I see the button-fix-CSS still applies.

To make the input buttons show up correctly with this skin add the following CSS codes to your user.css file:

input[type="submit"],input[type="reset"],input[type="button"],input[type="file"]
 {color: #000 !important;
  font-family:"Lucida Grande",sans-serif !important;
  min-height:21px !important;
  max-height:21px !important;
  font-size:11px !important;
  padding:0 5px 3px 5px !important;}

input[type="file"]
 {min-height:23px !important;}

If you want to read more about user CSS, go to the <a href="http://operawiki.info/OperaUserCSS">user CSS section on Operawiki.info</a>.

Yeah I forgot to mention that the User CSS hack still applies. It will apply here on out until Opera updates its skinning system.

C'mon Khadgar, whip up a graphite version with native scrollbars! (see new weekly)
Please?

"Native OS X UI elements can now be used in skins"

WOW!

Hmm. Now that we finally have that, what does it do? We just get nicer scrollbars, or anything more?

Yes I about did a backflip when I saw the new weekly. Yes expect a new version soon. Just when I turn on Final Fantasy XII to play it I get hit with this

I have to figure out how to do it first...

That sounds so great, can't wait to see a mixed skin!

It doesn't work through setting it to a native skin and it doesn't fallback to the native scrollbars if you remove the definitons for them in the skin. It still falls back to the standard skin's scrollbars and buttons. The tabs, however, fall back to the native skin.

Perhaps we need to use a switch somewhere in the skin or something similar. An official note on how to do it would help.

I've asked, but I haven't gotten a reply yet. We'll see...

Does this mean I can have a graphite scroll bar soon?

It could if the desktop team ever tells me how to do it, but after almost a day without a reply I doubt I'm getting one. I guess I'm supposed to know how already.

C'mon now, let us have the weekend off once in a while

In the [Options] section of skin.ini, define "native = mac". In any sections you don't want native elements, define "native = 0" to override.

I'm really looking forward to seeing what can be accomplished with this, so gl/hf

Thanks a bunch I thought it might be something I knew already, but never put two and two together. Thanks! *gets to work*

Working on the skin, and it's coming along quite well. I just thought I'd give an update so I wouldn't get as large of an angry mob on my hands. I just have to work late tonight, but it's worth the wait. Found some bugs in the process, too .

Great!

Can't wait Khadgar.
The new buttons look lickable. Did you make them yourself? They're really nice!

Yeah I did and have actually made a quite bit more than that. I've been making one here and there for quite some time. I've been making them in Illustrator so they're vector. I've done that because I don't want to make it and realize I have to resize it by a small bit. I have more control over them that way.

The icon set won't be in this version... hehe. Opera threw me a curve ball. I wasn't expecting this.

They threw you a what?

Threw me a curve ball. Like in Baseball when a pitcher wants to confuse the batter he will throw a curve ball.

Originally posted by rObkE:

They threw you a what?

Havnt you played Wii Sports? :O
It's something unexpected, and catches you off guard.

By the way Khadgar, time is ticking. I'm starting to get anxious over here

Entr'Acte 1.0!
With Opera's new skinning capabilities I think Entr'Acte deserves a 1.0. THIS SKIN ONLY WORKS ON MACINTOSH OPERA 9.10 WEEKLY BUILD 3602 AND NEWER. You can get it here.

Changelog:
<ol>
<li>All native UI elements such as scrollbars, list headers, checkboxes, dropdowns, input boxes, buttons, radio buttons, etc. will be native thanks to the new skinning capabilities in the new Opera build. THANKS DESKTOP TEAM!
<li>Any hacks that involved anything used from the native skin will not apply to this skin neither will you need them. It obeys your system settings .
<li>For TennesseeStiff and anyone else who uses Graphite I will provide an update in the future to provide for a hack to change the panel header (the blue bar) to graphite.
<li>Entr'Acte has been uploaded to the Opera Skins section of My Opera pending approval. You should be able to download any updates in the future there.
<li>A better Mac experience!
</ol>
Since this was completely unexpected there isn't a completely custom icon set in this. Have fun!

I could kiss you, if I didn't think it would make you run away and not come back.

Well I always wanted to go to Great Britain, but not to kiss you, though.

This is great, especially with all the native stuff. You don't need the user.css with the native widgets!

I strongly suggest (to users of this skin, but also to the developer - maybe a variant of the skin, if you like it) moving the style from the bottom pagebar to the to pagebar as you described. I also disabled my adressbar and moved everything from there to the main(?)bar (changing via opera), so I have the adress field above the tabs and edited the skin.ini so that the pagebar has a border at the bottom. For perfection, I removed the top border from the view bar.

Originally posted by Khadgar:

No Items in Pagebar Head The pagebar is the bar with the tabs in it obviously, but the pagebar header is the spot where you can put icons in front of the tabs. The spot where you can put icons on the right is called the pagebar tail. When you apply that hack it removes the uneeded spacing before the first tab. It has the first tab begin at the edge of the window instead of a few pixels beyond. It looks like I overcompensated a little bit judging by your screenshot. I'll update it when I do the next version.

While in the preferences for the pagebar, if you klick inside the pagebar header, you can disable it in the field where you can choose left/rigth/top/down/off. This looks pretty nice without editing the skin.

I included two screenshots of my configuration... I think this skin will bring me back from safari, although a unified toolbar would be even nicer.

Screenshot 1.png
Screenshot 2.png

I already provided a hack before that would allow for putting the bottom tabs to the top. A unified toolbar would be nice, but impossible using this skinning system. If they allowed for conditional statements in the skinning system then it would be possible as you could change the look of things based upon where other things are placed.

And the whole idea with the pagebar header hack is because the default toolbar setup has items on the left, and the hack doesn't apply if the "candy" pagebar is put at the top. The skin tries to cater to the default toolbar setup first, alternate setups second, provide hacks for toolbar setups that can't be done by default, and lastly provide hacks for customizations such as your desire to have the "candy" pagebar at the top. Many of the hacks that allow support for some toolbar setups could be integrated into the skin if conditional statements were allowed.

I can't make the skin satisfy everyone, so the final hacks are provided for people who want it to look different from what it does already.

Yeah I saw that hack. I just wanted to say to everyone trying this skin to also try how it looks with the "candy" pagebar, because it is really worth it... I understand that you have a default setup and am more than satisfied I understand the pagebar header hack now too, thanks for clarifying. The thing about the unified toolbar isn't your fault, of course. Was just random rambling.

Thanks again for the skin, those native buttons are really great. Did you notice that the "native" dropdown popup menu looks different from Safari's? I think it could be a Carbon/Cocoa problem... And the native "simple" progress bar when a page loads looks a bit thin. I could switch that back to the non-native version in skin.ini, right?

I'm looking forward to your new icons. Don't like the current viewbar-switch-binoculars icon that much, others are ok

I've tried hacking the progress bar skin. That's one of the bugs I'd like to address to Opera. It's a bit annoying not being able to resize the progress bar. There's really nothing you can do about it except write a non-native skin and start from scratch (like old versions of Entr'Acte were), but that leaves with trying to imitate the native UI elements which are an impossibility to get them correct.

It's not that I use the default toolbar setup, it's just that I tailor the skin first for the default toolbar setup that you get when you first run Opera. I don't know what you mean by the dropdown. Are you talking about the address bar dropdown? Opera's dropdown there isn't native. It really has nothing to do with Carbon or Cocoa. I can't change it without changing the other dropdowns as well. There's not a separate skin section that exists for just the address bar's dropdown.

Hey Khadgar, I tried to download the new version of Entr'Acte but it wouldn't download. Just thought would let you know. It said "The requested URL /community/forums/www.dark-phantasy.com/skin/entr'acte1.0.zip was not found on this server." Thanks

To the poster above, try: http://www.dark-phantasy.com/skin/entr'acte1.0.zip. Khadgar forgot the http://. I wish he wasn't so lazy and did some work for us for once.

Khadgar - very good! Thank you so much for putting the effort into revising it so quickly for us. The native controls are great. Opera is still imperfect, but in very subtle ways now

Just to annoy you, here's a few things I wonder:

I like the top tab bar hack thing, but applying your hack leads to ugly merging with my Address bar as there's no bottom grey border. Did I do it wrong or is there a step missing in your post above?

Is there a hack to remove the top grey line that appears above the page bar if it's the topmost toolbar visible? This line is visible in all areas except the top of the active tab (in the default skin's look, which I think is debatably prettier than the gloss.) Also, how about the thick grey line that appears if you align your pagebar to the left? I remember asking this previously but not quite understanding how the system worked.. my toying with your skin.ini didn't quite enlighten me as to how you pulled it off.

Have you tried stealing Panic's Transmit look for the glossy pagebar? I think the shade of colour, "X" icon and black text is a bit nicer.

Uhh.. wow. I'm running out of things to suggest. Oh! Perhaps in a future version you could work on a replacement icon for the website authentication thing that's currently a very ugly grey ? in a rectangle?

That's about it. As always, I'm very appreciative of your efforts and think that this skin only gets better and better.

Originally posted by intelimac20inch:

Hey Khadgar, I tried to download the new version of Entr'Acte but it wouldn't download. Just thought would let you know. It said "The requested URL /community/forums/www.dark-phantasy.com/skin/entr'acte1.0.zip was not found on this server." Thanks

Oops. I wish someone else told me sooner. Fixed.

Originally posted by SuitCase:

I like the top tab bar hack thing, but applying your hack leads to ugly merging with my Address bar as there's no bottom grey border. Did I do it wrong or is there a step missing in your post above?

Show me a screenshot. I probably forgot something. I just wrote the code out to replace the pagebar and never tested it.

Originally posted by SuitCase:

Have you tried stealing Panic's Transmit look for the glossy pagebar? I think the shade of colour, "X" icon and black text is a bit nicer.

Yeah I could probably do something like that, although without an additional hack the close icon won't look like Panic's.

Originally posted by SuitCase:

Uhh.. wow. I'm running out of things to suggest. Oh! Perhaps in a future version you could work on a replacement icon for the website authentication thing that's currently a very ugly grey ? in a rectangle?

Yeah I've been looking into that. The standard says to keep it grey, so I'll have to leave it so. I'll do something to it to make it blend in more. I can easily change the ? icon, too. I'll have to look on the Opera Wiki to see.

Most awesome. Thanks a bunch, Khadgar

Edit: one minor issue. When I have a couple of inactive chat tabs and one of them receives an event (like, for instance, text ), the tab name doesn't change color (to blue) anymore. The orange exclamation point on the Opera logo is displayed as usual, but I can't easily see which chat tab the event occured in.

Originally posted by blaabjerg:

Yeah I've been looking into that. The standard says to keep it grey, so I'll have to leave it so. I'll do something to it to make it blend in more. I can easily change the ? icon, too. I'll have to look on the Opera Wiki to see.

An small version of the lock icon from System Preferences wouldn't be too bad.

Originally posted by Khadgar:

I don't know what you mean by the dropdown. Are you talking about the address bar dropdown? Opera's dropdown there isn't native. It really has nothing to do with Carbon or Cocoa. I can't change it without changing the other dropdowns as well. There's not a separate skin section that exists for just the address bar's dropdown.

No, I like the Adress bar dropdown. It looks almost the same as safaris, and I think thats a good thing! I'm talking about the dropdowns in webpages, the select/option thing, for example the forum quick jump at the bottom of this page. Try what they look like in a native application, Safari in a webpage or e.g. System preferences has a bunch of them. The open centered around the current selected item, not above or below. I think that would be operas fault.

I've mentioned that in the "Opera's (un)native look and feel on the Mac" thread (second link in my sig) also. It's same problem with the other controls like radio buttons etc. They look native, but they don't feel 100%. I don't think this can be solved with a skin.

I will make a followup there, because it is a bit offtopic in this thread.

Originally posted by blaabjerg:

Most awesome. Thanks a bunch, Khadgar Edit: one minor issue. When I have a couple of inactive chat tabs and one of them receives an event (like, for instance, text ), the tab name doesn't change color (to blue) anymore. The orange exclamation point on the Opera logo is displayed as usual, but I can't easily see which chat tab the event occured in.

Ahh. I think I know how to fix that. *Writes it down*

Originally posted by rObkE:

An small version of the lock icon from System Preferences wouldn't be too bad.

The close icon on the tabs already changes to a lock icon. I just wish there was a way to make the button solid. You can't change it from being translucent.

I really do need to make a webpage for this skin now... since it can be native (up until how native Opera itself is) I'll see about putting together that form for applying different hacks to the skin I was talking about before. I've got part of it programmed in any case.

Originally posted by prionic6:

No, I like the Adress bar dropdown.

Sorry for going alittle offtopic, this isnt much about Entr'Acte but more about Opera,
but how hard can it really be to make a dropdown with the correct size?

http://upl.yao.se/?a=3bf47.png
http://upl.yao.se/?a=3a19c.png

Originally posted by johannordholm:

how hard can it really be to make a dropdown with the correct size

I've reported that as a bug some time ago, I hope that gets fixed aswell.