apeisa

.social_buttons { margin: 20px 0 20px 10px; width: 450px; float: left; /* This is new */ } I moved this to Pub. We don't have general webdev forum yet, but I am thinking Pub mostly like that.

Thanks. I updated the link in first post.

I think I understand what you meant. In your article you write: Our current in-house cms works this way. Meaning editor can add different "blocks" to the predefined places and in any order he/she wants. I don't use term "module" here, since it is very different thing in ProcessWire. So editor can easily build pages like this: MAIN COLUMN: Text and images News block Form Image gallery Text and images SIDEBAR: Read our newsletter -block Banners-block Text and images etc... you got the idea. Sometimes it is desired, but many times it just leads to very messy pages. But in good hands, yes, very powerful way to create individual pages. (BTW: You might be very interested in this: http://blog.squarespace.com/blog/2011/10/21/squarespace-6.html) But that way of managing content has one very major drawback: you are not actually managing content anymore, but "just" creating website, page by page. You tie your content and presentation very closely together. The smaller the site and needs, the better it works. On large scale sites: it leads to a mess. Things like redesigns (both: visual or structural), multichannel publishing, content re-usage and building API:s on top of CMS like that is more difficult. Of course there are structural content also (like news, events, form submissions etc) which are easily reusable. And probably the CMS you have used (REDAXO) is better in keeping content and presentation separate than the system I am familiar with. But in any way: if each page is "custom tailored" it always makes things I mentioned earlier harder.

I didn't understand this. If this still occurs in latest version, I would really appreciate screenshot or more description about how to produce this one. This is fixed in latest commit, thanks for finding & reporting Soma.

And fixed on latest commit. It was this one (again, didn't realize I wasn't using jQuery event object parameter, but native window.event): http://stackoverflow.com/questions/2974601/event-is-not-defined-in-firefox-but-ok-in-chrome-and-ie

Heh, I did test this on Chrome and IE9... And now that I test it on Firefox the preview fails here too. Is FF new IE? Should be quick fix though. Thanks for finding that one Ryan!

Great job! I have never really used either of those (markdown or textile), but I was thinking about markdown on my discussions module. Now I have more options to choose from

Ok guys, sorry about last version - there was bug in previews that assumed your fieldname was "cropImages"... This version is actually pretty nice. I commented the modal view out, since it was really annoying with bigger images. You really want all the possible space there. Also added timestamps for image urls in admin to prevent browser cache. It seems to help. I have few things for the future: Remove thumbnails after actual image is removed Allow resizing thumbnails in your templates.

I think you misunderstood Ryan's reply here: No one is saying you were impolite, but conversion where we discuss about yes-no-yes-no-yes doesn't do any good for ProcessWire (or any other os-project out there). For that reason I keep my answer short: Drupal: system provides default markup, and then there are several places where you can overwrite that markup. Totally different method than in pw, and that is what we think as "markup generator" here. If you look source codes from sites build with "markup generator cms" and one without (like pw or Expression Engine) you see that latter is almost always cleaner (it is as good as the front end developer and that is one of the main reasons EE is so popular among talented front-end developers). Of course you can re-write everything on most markup generator cms also, but that is usually slow and tedious process (and also fights against the ideology). Template flexibility: you could have template where you have one field, let's call it "html". Then user writes whole site markup on that field. If that is the kind of flexibility you need, there you have it. Then your actual "template file" would be this: <?php echo $page->html;

Just tested this on another site setup, and I have few minor bugs. It's usable, but previews won't show due js-error. I'll do quick fix for that at evening or tomorrow.

I think this topic is done. Feel free to open new topic if you have need or idea how to make images better in PW. Topic for CropImage-module can be found from here: http://processwire.com/talk/index.php/topic,705.msg5343.html

https://github.com/apeisa/Thumbnails Template usage: echo $page->cropImages->eq(0)->getThumb('thumbnail'); Better docs coming soon. Development sponsored by: http://stillmovingdesign.com.au/

Ok fellows, I cleaned code quite a bit and it's not that bad anymore. I pushed it also into github: https://github.com/apeisa/CropImage I need to write better readme for this, but basic usage in templates is like before: <?php echo $page->cropimagefield->eq(0)->getThumb('thumbnail'); And that returns url to your image. This does all the magic I wanted it to do: If there isn't cropped image, it crops one for you (using default center cropping) If you change your crop width and/or height, it recrops images - so your image is always on right size There is little preview when you hover over crop link I got few items on todo list, and one for those is to provide nicer UI (at least for links and preview). Happy testing and all feedback is most welcome!

Yep, you found the super secret easter egg!

Thanks for your time and help Ryan. I'll go now with two variables, and finish other aspects. I will clean and re-factor parts of the code. One downside defining crops directly in fieldtype settings (or plus, depends on usage) is that you cannot define crops per field basis. I think that would make it easier on huge sites, but on most scenarios it will be unnecessary.

Ah, so you are just playing with tinyMCE settings. I am not pro with that magic, but I would try this: Default stuff: I would try to remove that bold thing there and not touch anything else. It should make this: <p class="SomeUglyMsWordClasses">Text here</p> into this: <p>Text here</p>

Ah, I understand. I actually can have different thumb setups for different fields (didn't realize that first) Btw, if I have this on my template file: echo $page->fieldname->getThumb('thumbnail'); Can my getThumb-method know about fieldname? Or should I just add it as variable?

Can you post in your code and how you have tried to achieve that? You are building custom textformatter and use it with tinyMCE fields?

Great stuff. No hurry for this.

Updated this to support localized day titles and simple prev/next navigation. <?php function renderCalendar($page, $year, $month, $field = 'startdate') { // This feels little dirty, there is probably much more efficient way to get local day name? $mon = strftime('%a', strtotime("2011-11-14 00:00:00")); $tue = strftime('%a', strtotime("2011-11-15 00:00:00")); $wed = strftime('%a', strtotime("2011-11-16 00:00:00")); $thu = strftime('%a', strtotime("2011-11-17 00:00:00")); $fri = strftime('%a', strtotime("2011-11-18 00:00:00")); $sat = strftime('%a', strtotime("2011-11-19 00:00:00")); $sun = strftime('%a', strtotime("2011-11-20 00:00:00")); $year = (int) $year; $month = (int) $month; $startTime = strtotime("$year-$month-01 00:00:00"); $endTime = strtotime("+1 month", $startTime); $lastMonth = strtotime("-1 month", $startTime); // find all events that fall in the given month and year $events = $page->children("$field>=$startTime,$field<$endTime"); // get all the info you need to draw a grid calendar $weekDayNames = array($mon, $tue, $wed, $thu, $fri, $sat, $sun); $firstDayName = strftime('%a', $startTime); // i.e. "Tue" (Eng) or "ti" (Fin) $daysInMonth = date('t', $startTime); // 28 through 31 // make the calendar headline $out = "<h1>" . strftime('%B %Y', $startTime) . "</h1>"; // i.e. October 2011 $out .= "<div class='nav'>"; $out .= "<a href='../../". date('Y', $lastMonth) ."/". date('m', $lastMonth) ."/'>←</a>"; $out .= "<a href='../../". date('Y', $endTime) ."/". date('m', $endTime) ."/'>→</a>"; $out .= "</div>"; // create the calendar header with weekday names $out .= "<table class='calendar'><thead><tr>"; foreach($weekDayNames as $name) $out .= "<th>$name</th>"; $out .= "</tr></thead><tbody><tr>"; // fill in blank days from last month till we get to first day in this month foreach($weekDayNames as $name) { if($name == $firstDayName) break; $out .= "<td> </td>"; } // draw the calendar for($day = 1; $day <= $daysInMonth; $day++) { // get the time info that we need for this day $startTime = strtotime("$year-$month-$day 00:00:00"); $endTime = strtotime("+1 day", $startTime); $dayName = strftime('%a', $startTime); // if we're at the beginning of a week, start a new row if($day > 1 && $dayName == $mon) $out .= "<tr>"; // create the list of events for this day (if any) $list = ''; foreach($page->children("$field>=$startTime, $field<$endTime") as $event) { $list .= "<li><a href='{$event->url}'>{$event->title}</a><p>{$event->location->title}, <span class='city'>{$event->location->city->title}</span></p></li>"; } // if any events were found for this day, wrap it in <ul> tag if($list) $list = "<ul>$list</ul>"; // make the day column with day number as header and event list as body $out .= "<td valign='top'><h2>$day</h2>$list</td>"; // if last day in week, then close out the row if($dayName == $sun) $out .= "</tr>"; } // finish out the week with blank days for next month $key = array_search($dayName, $weekDayNames); while(isset($weekDayNames[++$key])) { $out .= "<td> </td>"; } // close the last row and table $out .= "</tr></tbody></table>"; // output the calendar return $out; }

Ryan, one question: will templates have labels and will they be multilang? That is actually pretty important, since editors can many times choose templates, and it would great to provide clean labels instead of computer friendly ones like "news-item" and "basic-page".

Ok, I tried to quote Ryan's post above, but accidentally modified it and overwrote with my own message. Ryan's code worked almost perfectly (it outputted sundays as their own row), so here is only minor changes to the original: <?php function renderCalendar($page, $year, $month, $field = 'startdate') { $year = (int) $year; $month = (int) $month; $startTime = strtotime("$year-$month-01 00:00:00"); $endTime = strtotime("+1 month", $startTime); // find all events that fall in the given month and year $events = $page->children("$field>=$startTime,$field<$endTime"); // get all the info you need to draw a grid calendar $weekDayNames = array('Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'); $firstDayName = date('D', $startTime); // i.e. Tue $daysInMonth = date('t', $startTime); // 28 through 31 // make the calendar headline // $out = "<h1>" . date('F Y') . "</h1>"; // i.e. October 2011 // create the calendar header with weekday names $out .= "<table><thead><tr>"; foreach($weekDayNames as $name) $out .= "<th>$name</th>"; $out .= "</tr></thead><tbody><tr>"; // fill in blank days from last month till we get to first day in this month foreach($weekDayNames as $name) { if($name == $firstDayName) break; $out .= "<td> </td>"; } // draw the calendar for($day = 1; $day <= $daysInMonth; $day++) { // get the time info that we need for this day $startTime = strtotime("$year-$month-$day 00:00:00"); $endTime = strtotime("+1 day", $startTime); $dayName = date('D', $startTime); // if we're at the beginning of a week, start a new row if($day > 1 && $dayName == 'Mon') $out .= "<tr>"; // create the list of events for this day (if any) $list = ''; foreach($page->children("$field>=$startTime, $field<$endTime") as $event) { $list .= "<li><a href='{$event->url}'>{$event->title}</a></li>"; } // if any events were found for this day, wrap it in <ul> tag if($list) $list = "<ul>$list</ul>"; // make the day column with day number as header and event list as body $out .= "<td><h2>$day</h2>$list</td>"; // if last day in week, then close out the row if($dayName == 'Sun') $out .= "</tr>"; } // finish out the week with blank days for next month $key = array_search($dayName, $weekDayNames); while(isset($weekDayNames[++$key])) { $out .= "<td> </td>"; } // close the last row and table $out .= "</tr></tbody></table>"; // output the calendar return $out; }

Wrong. PW does not generate markup, you do. In most cms systems you add "news module" or "blog" which automatically generates news lists and article views and their markup - not in PW. Wrong. There are no predefined templates (other than examples that are bundled in demo site - easy to remove if you don't need those), but in PW you create your templates (data models, like database tables in sql). These templates can have template file, which is not required. You can just use pw as a storage engine if you want to, and even include it from another php-program and use its API from there. So PW can work without template files, but not without templates (data models) - it would be same thing than database without data (well, you could use it classes like $sanitizer etc, but not much value alone). Wrong. Templates are not containers for markup generated by either code in the templates themselves or by modules. Markup can come from anywhere suits your needs. Template file is just a regular php file that gets few PW variables as given. Most important of those is $page which pulls data from the current page. It doesn't generate any markup at all. You write the markup into the template file (like in demo site) or in separate file (like I do) and include that file and use your actual template file as a controller, where you manipulate and pull more data from other pages etc. You can also write modules or just regular functions that generate your markup if that suits your workflow better. True. To have themes as "skins" then your markup should follow a common scenario. You cannot install site theme on top of JSON API for example... I think accessibility is very important thing and there is no excuses for this. As far as I know there aren't very many "fully accessible" admin UI:s out there. Drupal and Perch are the ones I know. But I don't think PW admin application should try to go without JS.. that is because in PW it is very easy to create simplified admin views for your editors. So in your example, I would build custom views for disabled editor to help him/her to work even easier than ever before. Rough time estimate for this would be something from 30min, but it depends how much and what kind of content he/she needs to edit and produce. Out of the box and without basic php knowledge this is not possible. I don't think that you can fully manage whole site if you cannot use normal web browser, but you definitely can produce and edit content. But things like managing site tree, assets management etc... it's just isn't possible (or very hard) if you are in example blind. As we all know our industry is still fighting to get "reading usability" right on websites and I am very happy that PW let's do this as well as you know. I might be totally wrong here, and I am by no means accessibility expert, these are just my assumptions. Google Maps doesn't, at least not for me. I don't know why it should, since if you are blind, you cannot read maps. If you are computer, you cannot read maps (as images anyway). I know there are many other Impairments than blindness, but I use it as most common example here. PW is a framework with an admin application build on top of it, which uses PW API (no shortcuts here, which is very important!). Something what oldies (Drupal, Joomla) are trying to achieve afterwards (separating cms and framework) - and I don't think that path can be very successful. If you test PW as a software that you install and play without diving into coding (at least html&css and some very basic php) you cannot get much value from it. At least not before we have site-profiles. You really need to start building something unique for you needs before you realize what makes PW different (and better) from most cms out there.

Small problem (again): How do I get my inputfield setting value? I have this code in my fiedtype: $this->modules->get('InputfieldCropImage')->get('crops'); But it returns always the default value I have set in my InputfieldCropImage class Init: public function init() { parent::init(); $this->set('crops', 'thumbnail,200,200'); } Saving and editing that value works in admin and also when I read $this->crops in my inputfield, it get's modified values. But outside inputfield (on my fieldtype, to be exact) it just returns the default. This got me thinking that if I have those crop setup settings in wrong place all together - should they be in fieldtype instead of inputfield?

This goes little off topic: IMO good way to learn is to be brave and publish stuff that you have done for feedback. This forum is one fine place to do it (and I remember you have done also) - it's great to get feedback and is many times beneficial for others too! I don't know how to thank Ryan and others enough for all the learning I have got from here. I have also found that there are some concepts that are very common in web development (php & js for me) and understanding those will speed up your learning (not saying that I have grasped these all, still learning basic stuff also..): arrays, multidimensional looping those arrays functions (especially those that return something) classes and objects Web dev basics: server side vs. client side? sessions, cookies, databases. http-basics: post, get, headers... Also there are super simple things that we waste a lot of time. Things like string manipulation or simple maths. If you have problems like that and google doesn't help you right away, then just ask for help - it will help you learn faster. Also - learn to love php.net - ugly but working docs there! There will be boring and depressing phases when you learn slower and even feel going backwards (you realize how much you don't know and it feels bad ). And then there are those awesome moments when you feel like everything is possible and you just want to build and learn more. Most important thing is to keep building stuff. There are those wizard brain lies that keep telling people that they don't know and they will never know something - that they are just incompetent for doing stuff like coding/painting/music etc. "You are just a designer, don't bother trying to code something yourself, it will never work" or just the opposite: "You are just a developer, don't even try to build something beautiful or even usable"... how much better software we would have without lies like that?