S2 Practice Discussion

Perl-like substitution in S2? Want to make custom HTML tag

2007-07-14T17:19:05Z

1. I'm trying to write a function that will do a find-and-replace on the entry text. It would search the entry for foo and replace every instance of foo with bar. Is this even possible?

2. If #1 is possible, what is S2's syntax for a "find-and-replace"/regular expression substitution? Also, if there is such a thing, it'd be important what to know to use as a wildcard.

I test this out in Perl, and all I have to do is:

$my_open = '123';
$my_close = '789';
$_ = $e.text;
s/<foo>(.+?)<\/foo>/$my_open\1$my_close/ig;
$e.text = $_;

In Perl, this would take the value of $e.text (which I presume is the variable for the entry text itself) and look for all instances of a <foo> HTML-style tag set. It would then grab all of the text between the <foo> and </foo> tags and surround it with the text in the $my_open and $my_close variables.

So, in my Perl code above, if $e.text had a value of...
the numbers are <foo>456</foo> and <foo>098</foo>

...and I ran it through this function (subroutine in Perl-speak), I get...
the numbers are 123456789 and 123098789

How would I do this with S2?

...help please?!

The example above was simplified from my original intent. If you're curious what I'm actually trying to do here, see this post in my journal:
http://williamw.livejournal.com/239967.html

Print Command Usage

2007-07-14T17:18:59Z

I recently started playing around in S2 (after about a year of having my brain melt every time I tried to look at it...), and I have a programming question. If I knew a bit about Perl or Java, this might be self evident, but previously, I've only worked in PHP. My question concerns whether you should always include a print command and what exactly the "safe" modifier does.

There seem to be two printing commands, print and println. println, I assume, prints the line followed by a line separator. I have noticed, however, that a lot of functions written tend to just dump strings out there, and they are printed. For example, the following would produce the same effect:

print "I like printing!";

"I like printing!";

That doesn't work with variables, just with strings. Also, there is a "safe" modifier, and I have absolutely no idea what that does. Does that prevent the string from being cleaned or does it require the string to be cleaned before printing?

print safe "I like printing!";

So, should a print command always be included? Is just dumping out a string bad programming? Also, how does safe printing differ from normal printing?

Thank you ahead of time. Sorry if this question is a bit basic, but like I said, I have limited experience with programming languages.

What day is today?

2006-07-11T23:51:56Z

Is there any way to tell, programmatically, what Date or DateTime "today" or "now" are from within an S2 layer's code? I would dearly love to style today's entries slightly differently, but there doesn't seem to be anything in Core that returns a current timestamp.

How does one go about submitting feature requests for S2 Core, anyway?

converting int to string

2006-07-11T18:41:42Z

I have this code below:

var int cdepth = 445+(15*($c.depth-1));

I want to convert $cdepth into a string because I need it as a string variable. How is that possible?

There's no info about it in the Core and I used LJSeek to search this community with no result either. Thanks.

Edit: Actually, the actual codes in Core had this and I suggest anyone to look at the Core Code instead of the Core Documentation.

Displaying friendslist in RSS

2006-04-26T23:54:22Z

Hi all. I'm trying to display my friends list in RSS format using S2. I actually found a script that someone else had written which is helpful:

http://hacks.atrus.org/rdf_atom_s2/rdf_atom_s2.s2

but, as is noted in the comments in that script, set_content_type doesn't seem to work (yet?). In other words, I can produce a beautiful RSS feed, but it is delivered as HTML, not XML, so the client I'm handing it to on the other end will refuse to read it.

Help? Thanks!

New To S2

2006-04-04T15:33:39Z

Hi All :) I am looking for a tutorial / how-to for creating my own top-level layer (not a layout-specific or style layer).

I'm new to the idea of customizing my liveJournal and I want all in. I have the HTML and CSS for the layout I want. I've browsed the S2 Manual and I've learned the most from looking at the public layers but I am still somewhat confused. I program PHP and VBScript for a living so it's not the language that's going over my head. Maybe my problem is that I AM a programer, or maybe it's that I never programmed in S1.

Some of my confusion is around functions, when I declare them they tell me they're undeclared, but when I copy and past declarations from the public layers they work fine, but those functions aren't included in the list of functions in the manual. *scratches head* Why does lay_print_header() compile but not printHeader()? Also, I don't see any function CALLS anywhere. I assume they're happening on a layer beneath the core layer? But I can't find a list of what those functions are.

Am I way off here? Can someone please point me in the right direction? Thanks.

Metadata and S2 arguments

2006-03-31T10:05:24Z

pthalogreen made a cool journal style ages ago, which lists posts by just the music field. I wanted to see if I could do this in S2 and also wanted to include the new location field. And look, I did it! That's probably the most original thing I've managed to do with S2 so far, as opposed to just cribbing other people's code.

I'm still stuck on one thing: I would like to make the metadata page show 50 items per page, while keeping 25 on my main journal. Is this possible? I tried changing $*page_recent_items within the bit of RecentPage::print_body where I deal with the argument version of the page, but this doesn't seem to have any effect.

Adapting overrides for use in S2 (advanced version)

2005-06-16T16:08:31Z

So I've been evangelizing S2 around lots of layout communities, and been doing quite a bit of helping people to convert their S1 styles to S2. I've turned up a couple of quirks that might be of interest, and I'm also curious to know why these things work the way they do, if anyone can tell me.

~~You can't use CSS comments in print_custom_head~~.

I'm sure everyone knows this already, but it's worth pointing out, because it's a good reason why pasting S1 overrides directly might not work. It also means you can't use some of the more elaborate browser selection hacks (on which more later).

kunzite1

Scrollbar colour overrides have to be applied to html rather than body.

html

body

print_custom_head

html {}

body {}

You can't use child selectors, because > is escaped to >.

Zilla'd

kamara

html>body div {}

troworld

* html body div {}

As far as I can tell, filters don't work in S2 at all.

Another IE specific thing, yes, and I'm not exactly a fan myself. But again, lots of teenyboppers like them, so I've faithfully tried to copy them over from their S1 overrides to S2, and they do nothing. I have no idea why this should be; a security thing? Is there any way to make them work?

display: none works weirdly in S2 + IE.

hide most of the default navigation

LASTN_WEBSITE

Page::print

Strange ideas about the height of the page

height

div {height: 50%;}

I'm thinking that a lot of these things may be to do with S2 layouts setting a different DOCTYPE from S1 layouts. That seems the most likely reason why the same CSS would work in S1 but break or behave strangely in S2. Can anyone enlighten me on the technical details of this? As you can probably tell by reading this my knowledge of CSS is kind of patchy!

New System Styles

2005-06-02T17:53:48Z

View Poll: New Styles

Anything else to add? Comments!

auto-paragraphing

2005-05-19T16:25:36Z

the LJ auto-formatter turns newlines into <br/>, and so "paragraphs" normally get delimited by newlines. it seems like there should be a way to change that into proper <p> tags using S2, but i can't think of it. has anyone done this/has a clue how to do it? (sorry if this is documented already, but i couldn't see it in s2howto's memories).

general random

2005-05-18T00:26:24Z

Kind of a half-baked idea: have any of you tried generalising the various random functions floating around? (userpics, background images, I have one for a fortune cookie saying)

I'm thinking about having something in the wizard for "random ______" and the user fills in what they want randomised and the elements...

Printing HTML

2005-05-16T23:07:26Z

I'm so pleased this community has been resurrected. To start the ball rolling:

When you want your S2 style to print some HTML, you sometimes use:

print
"""<tag attribute="blah">some sample text</tag>""";

. But you sometimes use: print "<tag attribute='blah'>some sample text</tag>";. And sometimes you use "<tag attribute='blah'>some sample text</tag>", without any print command.

I have figured out that if you use """, you can use " within the HTML, whereas if you use ", you need to use '. That's logical, because otherwise how would S2 know whether you mean to end the command or print some quotes in your HTML. But does anyone know, is there any particular reason to pick one style over another? Are there different circumstances where the triple quote is preferred versus the single quote? And why would you want to use or omit the print command? Or are they all just completely redundant?

Oh, and you can blame last.fm for the current music.

s2practice lives again!

2005-05-16T22:03:19Z

It's been a little over a year now since we shut down this community, and the time has come to revive it. s2practice is open again, with a new purpose.

Although there are a lot of communities out there for S2, this one is still geared toward support volunteers, though we are not restricting participation to only those involved with support.

Aims

Swapping and sharing ideas, tricks, tips, code and discussing ways to implement things
Getting people familiar with S2 so they can take advantage of it and troubleshoot it (for personal or support purposes)
Picking apart the system styles — what's good about them, what's inefficient, how they could be improved, what can be learned from them, etc.
Discussing the core layer, its oddities and intricacies, bugs, what can be changed and what can't

Incidentals
[not the main focus but okay too]

Talking about (X)HTML, CSS, general (but S2-relevant) coding technique and theory
Working out bugs and using regular support channels to report them
Moving some ideas over to howto_userdoc to discuss turning them into s2howto tutorials
Brainstorming about things that come up in support, helping people get better at working Style Systems, that sort of thing (but all S2-specific)

What this community ISN'T: support/lj_style/s2styles/s2howto. That means we aren't here for customization requests; if you want to add a background, make something transparent, change your comment links, add a component to Component, etc. check the usual places like the ones listed above. This isn't the community for that. A list of places where you can get help with customization requests is listed in the userinfo.

For now, the community has moderated posting and open membership. I'm flexible about the community settings, so we'll just go this way and see how things shake out.

On the subject of maintainers and moderators, I'll function as both. supersat has been a co-maintainer since the community's creation, but for now he's going into a "silent partner" role; he may drop out or become active in the future.

So I'm looking for a few active maintainers; the usual applies: people with a bit of time and interest, willing to archive via memories, make sure we're all following the rules and playing civilly, and also act as moderators.

If the volume of posts is more than we can handle, we'll start looking for more moderators or consider swapping out of moderated posting.

So! Questions?

Closed

2004-04-27T15:27:56Z

S2 came upon us faster than expected, and this community's original purpose -- to ease support volunteers and other interested parties slowly into S2 -- has been lost. Since there are some good references here, which have been mentioned in other areas of the site, we don't want to delete the community. However, we've cleared out a good deal of the posts, and all of the members too. This community should now be considered "closed", as it remains intact merely for archival purposes.

Defining Terminology

2003-05-03T20:49:24Z

Note: we've broken the "defining terminology and creating a theme" tutorial into two sections, as the glossary is quite long. The proceeding tutorial after this will be "creating a theme".

Defining Terminology

Words in S2 have dramatically different meanings from those used in reference to S1. Additionally, S2 introduces many more terms that some may be unfamiliar with, or find confusing and/or intimidating.

We have written this glossary with the intention of explaining these terms, in relation to S2 and not general programming, to interested support volunteers, or at least users with a working knowledge of S1.

layer -- a distinct block of S2 code; there are 6 layer types in S2, which are listed below. Layers are called such because a page view in S2 consists of a stack of layers, each overriding the one below it. In a sense, a layer is an overglorified S1 override, but in S2 you can have overrides on top of overrides, and they are far more powerful and flexible.
- core layer -- the base layer, which doesn't override any other layers. It defines functions, objects and the base functionality of those objects.
  - i18nc -- a core language layer. It contains common words used in other layers; each language has its own i18nc layer.
- layout layer -- essentially an S1 style, but covers all "views" (from S1, LASTN, FRIENDS, etc.), rather than one. It adds functionality to the core layer, so that it produces any page design you desire.
- i18n -- a language layer. It contains used in a layout layer to allow the layout to be viewed in multiple languages.
- theme -- essentially a color scheme, but may also change other properties, such as comment links. It is used to modify a layout.
- user layer -- essentially an S1 override list. It is used to further tweak the layout, i18n, and theme layers. Usually users do not directly create a user layer, but rather go through the wizard.

style -- a distinct combination of layers.

function -- a block of code that performs a specific task. Functions can take data, known as parameters, and return data. In S2, most functions output HTML to the browser in some fashion.
- function call -- an instruction to execute a function. After a function completes, the system resumes executing the code where it left off, which is generally just below the function call.
- global function -- a function that is available for use from any other function.
- builtin function -- a function that is not implemented in S2 code, but rather in the server code itself. These are used to do things that S2 alone cannot, and can only be defined in the core layer.

variable -- a data item named by an identifier. Usually, variables contain numbers, text, or instances of objects.
- parameter -- a variable that is passed to a function when called.
- properties -- a variable, accessible from anywhere, that can be set by end users via a wizard. Properties are usually used to define a visual element, such as a background color or a table width.
- string -- a series of characters, or text.
- array -- a set of multiple data items. In S2, arrays usually represent collections of objects, such as entries or comments.
  - associative array -- a set of multiple, named data items. Associative arrays work almost exactly as normal arrays, but one would reference items by their name rather than number.
- operator -- performs an operation on one or more data items (operands). Common operators are found here.

object -- data item that represents a conceptual entity, such as an entry, a page, a date, etc.
- inheritence -- a concept where objects can have children, and those child objects inherit functionality from the parent object.
- class -- the type of an object. For example, an entry, a page, a date, etc.
- instance -- a particular occurrence of an object. Instances contain the actual data.
- null -- a lack of an instance of an object. In other words, no object is being referred to.
- member -- a data item an object contains. For example, the subject of an entry.
- parent object -- an object that has sub-objects that inherit its behavior.
- child object -- an object that inherits the behavior of another object, its parent.
- method -- a function that belongs to an object, which usually performs an operation on the object's members.
- entrypage, recentpage, calendarpage, monthpage, friendspage, daypage -- specific S2 object classes that represent various "views".

keywords -- words that have a specific meaning in the S2 language.
- if, elseif, else (an "if statement") -- a statement that evaluates a logical statement (e.g. "viewer is owner") and chooses what code to execute based on the outcome of the evaluation. For example, if the viewer is the journal owner, show the edit entry icon; else (implied, everyone else) do not show the edit entry icon.
- foreach -- a statement that executes a code block for each data item in an array. For example, for each entry in the array of entries, output the entries to the browser.

We realise this glossary itself may create some questions while answering others, so feel free to reply with any questions you may still have with regards to terminology. We will explain in detail many of the concepts listed here within future tutorials.

Setting Your Account Up To Work With S2 And A Brief Walk Through The Wizards

2003-05-01T20:47:56Z

To start, you'll need to turn S2 on for your account. Go to http://www.livejournal.com/customize/, make sure the appropriate account is selected (if you control more than one account from the one you're logged into), and choose "New System (S2)" from the drop-down menu, then save (click on "Change"). You can always switch back to S1; all of your S1 styles and/or overrides are kept intact.

In this tutorial, we are going through the wizards. They are relatively self-explantory, so this will only briefly take you through the steps.

The first step is to choose a layout. You'll notice most of the S1 system styles have been ported to S2. In this tutorial, we'll use the default, Generator. This should already be selected, if you haven't done any tweaking prior to this tutorial. You'll notice next to the "Change" button, there is a link for previews. Open this in another browser window/tab to check out the various S2 versions of the system styles.

Since you are reading this tutorial in English, we will assume you can read English. So, for step 2, leave the language set to English.

Step 3 is choosing a theme; select "Iceburg" from the drop-down menu and press the "Change" button to save. Look at the preview of themes in another window/tab; you'll notice that "Iceburg" is the old default color scheme from S1.

When you've ensured that you have Generator, English and Iceburg set (the "Change" button must be pressed after each of these is set, if they are not already set as default), click on the "Customize..." button at the bottom.

On the Customize page, the first section is devoted to tweaking colors from the Iceburg theme. For the purposes of this tutorial, we'll only tweak two colors.

Go to the "Page background color (and around userpics)" section and select the "Override" radio button; from here, you could press the "Choose" button for a pop-up color-selector. However, as this does not appear to like Opera (7.03) very much, just insert the following color hex code: #CEF5C1. Then to go to the section labeled "Background color for the bar below entries", select "Override", and enter the following hex code: #F1FDED.

Now that a couple of colors have changed -- if you have JavaScript turned on, you'll see the color previews dynamically change when you click outside of the text box -- scroll down to "Box width (pixels)". Select "Override" and enter the value 400.

Move to the section labeled "Link text to leave a comment", select "Override" and enter "Have a child" (without the quotes; yes I know it's a weird comment link, but work with me here). In the next section, "Link text to read comments", select "Override" and enter "A lone child // # children" (again, without the quotes). Enter these same values for the friends view entry comment links.

Click on the "Save" button when you've completed the steps above. Now view your journal. Notice the colors, the width, and the comment links.

Congratulations, you've just successfully created a "user layer" using the wizard, including easily implementing non-standard pluralisation. A user layer is equivalent to basic S1 overrides.

Next tutorial: defining terminology and creating a theme.

s2practice revival starts tonight

2003-05-01T19:30:50Z

Tonight and tomorrow, Karl and I will be working on, and posting, 3 tutorials.

Tonight,
Tutorial 1: Setting your account up to work with S2 and a brief walk through the wizards.

Tomorrow,
Tutorial 2: Defining terminology and creating a theme.
Tutorial 3: Creating a Very Simple Layout.

Community Revival

2003-04-24T00:05:54Z

The community is being revived to go over LiveJournal-specific S2!

Karl and I will start on presenting info this week. :)

[caveat] Viewing S2 source with View HTML is broken

2002-11-19T06:24:42Z

Some of you have tried to make custom layouts by copying an existing layout source and pasting it into a new layout, only to find that it won't compile. For some reason, the View HTML method of viewing S2 source code is broken and mangles the code. For now, use the Download link (it should display the source in the browser despite the link's name) to copy S2 source code. I'll investigate this more soon.

Happy hackin'!

[tutorial] A Simple Start -- Setting Up & Making A Simple Layer

2002-11-19T01:57:13Z

Create account on http://fb.callete.com.
Go to "Manage Account".
Go to "Galleries".
Go to "Create Gallery".
Enter a name and fill in other fields if desired.
Click on the "Create Gallery" button.
Go to "Upload Pics".
Select your newly created gallery.
Click "Browse" to select an image on your computer.
Fill in a title.
Repeat as desired.
Click on the "Upload" button.
Look at your gallery by going to "Your Pictures" (on the side). It's using the "Super Simple" layer.

Most end-users will only want to use a predefined "style" (known as a layout layer in S2) and tweak some settings, such as the colors. To change the colors:

Click "Manage Account" if the menu isn't already open.
Click on "Styles".
Click the style name (it defaults to your username).
For now, leave the name of the layer as your username. Enter a language, if desired, and select the "Super Simple" layout, then click on the "Change Layout" button.
Now that you have told FotoBilder what layout you want to use, you can apply a theme layer. A theme layer is is similar to a color scheme but can affect much more than just the colors.
Select the "White on Black" theme (it's the last theme in the list) and click on the "Change Theme" button.
Look at your pictures again (click on "Your Pictures"). Notice that the colors have changed.
Return to the style editor ("Manage Account", "Styles", click the style name).
Click on the "Customize" button. This will allow you to override settings in the theme.
Go down to "Thumbnail size", select "Override", and select 200x200.
Click on the "Save" button.
Look at your gallery. Your thumbnails are approximately 200x200 (this is the maximum; the exact dimensions will depend on your image's original dimensions).

Anything that you can change on the customisation page can be put into a theme, again, like a color scheme. The new theme you'll create will be identical to White on Black, except that the thumbnails will be 200x200, and the main page will be titled "username's galleries", with your own username, of course.

Click on "Tech Resources".
Click on "Layer Browser".
Click on "White on Black".
Click on "View as HTML". This will show you the source code of this theme. Copy it to your clipboard/buffer since you'll be basing your new theme off of it.
Return to the layer browser.
Under "Create Layer", select "Theme (for a layout)" and enter 5 as the parent id. The number 5 is the layout id for Super Simple, as shown below.
Click on the "Create" button.
Paste in the contents of the White on Black theme over the existing text.
The new theme name will be "My White on Black". Change "White on Black" to "My White on Black" on this line:
layerinfo "name" = "My White on Black";
Remove the layerinfo "redist_uniq" = "supersimple/wb"; line, since you won't be redistributing your theme.
Add the following below the last line:
set title = "asciident's Gallery"; set thumbnail_size = "200x200";
Click on the "compile" button.
Go back to the main site: http://fb.callete.com/.
To test your style, click "Manage Account", "Styles", click your style name, and select your new theme.
Click "Change Theme", and then click "Your Pictures" to see the end result.

More to come. :)

S2 practice

2002-11-19T00:50:31Z

This community is for the users of http://fb.callete.com to discuss using FB's version of S2 until cust support volunteers can get access to LJ's version.

Karl and I will be posting some examples here soon.