I wrote a wiki page in siwapp’s project with some stuff I found on how to integrate Selenium RC with Symfony 1.2.
You can see it here: How to write AJAX tests
Suppose we have HTML code with the following structure:
<body>
<a id="panel-previous" href="#">previous</a>
<ul id="panel">
<li>ad</li>
<li>adipisicing</li>
<li>aliqua</li>
<li>aliquip</li>
<li>amet</li>
<li style="display:none;">anim</li>
<li style="display:none;">aute</li>
<li style="display:none;">cillum</li>
<li style="display:none;">commodo</li>
<li style="display:none;">consectetur</li>
<li style="display:none;">consequat</li>
<li style="display:none;">culpa</li>
</ul>
<a id="panel-next" href="#">next</a>
</body>
We want to show only five items at once, and we want to show next and previous items in a scrolling-like manner. This approach is based on showing only those items that should remain visible and hiding the others. The other one would be the classical container vs. content divs.
You need jquery, jquery.timers plugin (included in the attachment zip file) and the code we are going to comment now, as a panel.cer.js file in the attachment.
(function($){
$.fn.cerPanel = function () {
var speed = arguments.length > 0 ? parseInt(arguments[0]) : 100;
return this.each(function(){
var panel = $(this);
$('#'+panel.attr('id')+'-next').mousedown(function(e){
$(this).everyTime(speed, 'next', function(i){
if (panel.children(':visible ~ :hidden').length > 0) {
panel.children(':visible + :hidden').show();
panel.children(':visible:first').hide();
}
});
}).mouseup(function(e){
$(this).stopTime('next');
}).click(function(e){ e.preventDefault(); });
$('#'+panel.attr('id')+'-previous').mousedown(function(e){
$(this).everyTime(speed, 'prev', function(i){
if (panel.children(':hidden ~ :visible').length > 0) {
panel.children(':hidden:not(:visible ~ :hidden):last').show();
panel.children(':visible:last').hide();
}
});
}).mouseup(function(e){
$(this).stopTime('prev');
}).click(function(e){ e.preventDefault(); });
});
};
})(jQuery);
After the document is loaded you can call:
$('#panel').cerPanel();
$('#panel').cerPanel(mySpeed);
You will notice that in our HTML we defined ‘panel-previous’ and ‘panel-next’ links. You can use any clickable tag.
Those links works similar; we will focus on the ‘next’ link first:
On mouse down a timer starts repeating the same action: if there are more hidden items after a visible one then show the first hidden after a visible item and hide the first visible item. On mouse up stop doing it.
The ‘previous’ link works looking for visible items after a hidden one. If one item matches the condition it shows “the last hidden item that is not located after a visible one” and hides the last visible item.
This is useful when we want to scroll “complete” block items inside a parent block; this is not recommended to scroll text in the usual way.
If you are a web developer, maybe this post title doesn’t say nothing new to you. But I’m really really tired of IE annoyances. Today I worked extra hours on an ajax problem with IE.
The page I was working on has an ajax call like this one:
<div id="LoginForm"> </div>
<script type="text/javascript">
new Ajax.Updater('LoginForm',
'/www.php/login/ajaxForm'),
{asynchronous:true, evalScripts:false, method:'get'})
</script>
Well, is the typical prototype ajax call. The call updates the “LoginForm” layer with the information of the user: if he is logged or not basically.
Everything works right on every browser. I remark: on every browser, except of course IE. Explorer has the bright idea of use always his cache to fill the layer, so when the user logout, and go to another page, the “ajax call” shows the cached content, and voilá: the user is logged in again!
Here the solution:
<div id="LoginForm"> </div>
<script type="text/javascript">
new Ajax.Updater('LoginForm',
'/www_dev.php/login/ajaxForm?rdm='+Math.floor(Math.random()*10000),
{asynchronous:true, evalScripts:false, method:'get'})
</script>
It’s pretty obvious knowing the problem, but anyway is ANOTHER annoyance!
Thank you Microsoft, for these great moments.
If you manage :focus CSS styles for certain input controls you may have noticed that Safari attempts against your pretty innovative design adding a blurry blue outline effect.
You can avoid this adding this:
input:focus {
outline-width:0;
...
}
And that’s all.
I’m going to show a way that I’ve found to easily edit N1 relationships with the admin generator of symfony 1.2 Surely it can be polished, and maybe it could be done better another way, if you know how please let me know.
We are going to use the next model schema:
# config/schema.yml
propel:
lista:
id: ~
name: varchar(255)
type: varchar(255)
lista_item:
id: ~
lista_id: {type: integer, foreignTable: lista, foreignReference: id, required: true }
name: varchar(255)
There is a table of lists, and a table of list items related with the lists, so a list can contain n list items. The problem is to achieve the edition of the list properties and related list items on the same form.
Today I needed to access a webserver with phpMyAdmin configured as default page if no virtual host matched the requested one. It was configured to deny access from outside so my solution was to use a SSH tunnel:
carlos$ ssh -L 10080:192.168.1.3:80 user@host
So I can access phpMyAdmin writting this in my browser address bar:
localhost:10080
That’s all!
Recently I discovered that Firefox lets you override alert and confirm window object methods. I tried this with prototype and surprisingly it just worked! (Note that it is not tested in IE or Opera and others yet, but it also works in Safari).
<div id="test" style="background:red;color:white;display:none;"></div>
<script type="text/javascript">
window.confirm = function (s) { alert(s); };
window.alert = function (s) { $('test').update(s).show(); }
confirm('Ok?');
</script>
I hope the title is self-explanatory …
Several times, in a symfony project or a project which runs with the help of the prototype library, some problems arise regarding the scope of certain javascripts variables declared inside ajax request (that can be theyselves declared within other ajax request).
Usually , you need to access certain javascript varible or function that is declared on a place which can be outside the scope of the ajax request you’re calling that variable / function from.
This example: (written in symfony) will not work, because it’s written on an ajax request response already
echo javascript_tag("
var pageOkCodigoAcceso='".url_for('corbatas/compra')."';
".remote_function(array(
'update'=>'div_formulario_codigo_acceso',
'url' => 'forms/codigoAcceso',
'script'=> 'true',
'with' => "'complete_callback=garbageDisposal'",
'complete' => "garbageDisposal()",
'method'=>'get'))."
function garbageDisposal()
{
$('codigoAcceso_submitButton').value='activar oferta';
}
");
in this case, pageOkCodigoAcceso is a javascript variable which the ajax-generated content at div_formulario_codigo_acceso will need to access.
garbageDisposal() is a simple javascript function that will be executed upon completeness of the ajax request described inside the remote_function tag.
dWhen executing this code:
$this->items = $object->getItens();
...
foreach($this->items as $item)
{
...yadda yadda $item->getId() yadda yadada
}
within a symfony action, the php engine throws:
Notice: Indirect modification of overloaded property xxxActions::$items has no effect in xxxactions.class.php
That’s related to a php bug , whose implications in symfony are described here. It looks like it’s related to php 5.2. I can see it appears on version 5.2.0 . It looks like the bug is gone in version 5.2.4.
Anyway, the simple workaround: insted of iterate through $this->items, we do:
$items = $object->getItems();
...
foreach($items as $item)
{
...yadda yadda $item->getId() yadda yadda
}
$this->items = $items;
and that’s it.
You can see regular expression examples at this site. Very useful.
This is the content:
- Examples
- Numeric Ranges
- Floating Point Numbers
- Email Addresses
- Valid Dates
- Credit Card Numbers
- Matching Complete Lines
- Deleting Duplicate Lines
- Programming
- Two Near Words
Recent Comments