SASS User Tool for Editplus

I needed to simplify things to use the SASS scripting language for writing CSS, and I came up with an user tool for Editplus.

Editplus is a useful software to write any kind of code, because it is very flexible that if you know how to do it, you can write your own tools to co-op with this software for example user tools like html tidy, css tidy or indent code, or auto completion for any language that you can think, code colorization, remote file editing directly from FTP, managing projects.. it has too many specialities to tell, you should give it a try.

 

Well, it’s a bit complicated but not impossible. Here’s how it works:

You write a .scss or .sass file in editplus and while it is the active window in it, just pressing one shortcut key compiles it to .css file at the same folder.

It’s too easy to use but was hard for me to write it ­čÖé I’m used to any VB code since VB6 but lately I’ve been busy with C# and PHP like curly braced and semi-colon’ed languages, so it took a while to remember the good ol’ VB days. it was good though.

Well, here’s how you can install it on your own computer.

 

First, you need SASS and Ruby etc. installed and running.

Second, create a “sassy.vbs” file inside your editplus application folder and paste this code inside:

Set ArgObj = WScript.Arguments

filename = Right(ArgObj(0),Len(ArgObj(0)) - InstrRev(ArgObj(0),"\"))
extension = Right(ArgObj(0),Len(ArgObj(0)) - InstrRev(ArgObj(0),"."))

If extension<>"sass" and extension<>"scss" Then
    WScript.StdOut.WriteLine "Error: Sorry. Only works with .sass and .scss files."
    WScript.Quit
End If 

var2 = Left(filename,InstrRev(filename,".")) & "css"
var3 = Left(ArgObj(0),InstrRev(ArgObj(0),"\")) & var2

str = """" & ArgObj(1) & "\sassy.bat"" """ & ArgObj(0) & """ """ & var3 & """"

Function ExecuteWithTerminalOutput(cmd)
    Set sh = WScript.CreateObject("WScript.Shell")
    Set exec =  sh.Exec(cmd)
    Do While exec.Status = 0
        WScript.Sleep 100
        WScript.StdOut.Write(exec.StdOut.ReadAll())
        WScript.StdErr.Write(exec.StdErr.ReadAll())
    Loop
    ExecuteWithTerminalOutput = exec.Status
End Function

Call ExecuteWithTerminalOutput(str)

 

Then create a “sassy.bat” file in the same directory and paste this code inside it:

@echo off
sass %1 %2
@echo on

Now our files are ready to integrate into Editplus.

 

  • Open Editplus, Go to the “Tools” Menu
  • Choose “Configure User Tools”
  • Click “Add Tool >>”
  • Write to the Menu text anything you want.
  • To the “Command” input this:
    • cscript //NoLogo “C:\Program Files (x86)\EditPlus 3\sassy.vbs”
  • Into Arguments input (with quotes):
    • “$(FilePath)” “$(AppDir)”

Set the others like in the picture above. Note that the Command Input contains the path to the sassy.vbs file and it should be the correct path for our script to work.

 

sass3

The setup seems complete. Now give it a try. Create a .scss or .sass file which you are familiar with or which example you have in your hand. Then fill the file with some SASS code and save.

Now open the “Tools” menu from above and select the SASS Converter you just created from the bottom of the menu. It should show you the errors if there’s one in the bottom console. If you hear a system sound after you click this, it means that the compilation is successful. Otherwise, there are some errors in your SASS file.

I built it only to use with .sass and .scss files, so you may want to open the preferences -> settings and syntax page and add .sass and .scss extensions to your CSS extension list.

Installing SASS on Windows

In this post, I introduced some of the powers of SASS language, and I left the rest of the exploration to you, because I didn’t really go deep yet. But first you need to install it on your system to use it of course.

In their website, they explained how to install it on Linux and MacOS, and mentioned how to install on a Windows system but i needed to figure it out because before that, I never had a relationship with Ruby. And lucky me(!), SASS uses Ruby to operate.

Let me explain what I did.

First get the latest Ruby installer here : http://rubyinstaller.org/downloads/

Second, double click and start the installation, accept the licence agreement, and on the second page, check all of the checkboxes and click Install.

When the installation finishes, open a Command Prompt window (Win+R then type “cmd” and press enter)

Then type this:

ruby -S gem install sass

and wait for the script to install SASS. (It feels like using apt-get or yum :P). when you finish installing SASS, type this:

sass --help

and if you see a list of parameters and explanations, then your SASS is ready to be used.

SASS – Syntatically Awesome Stylesheets

As the official website says, Sass is an extension of CSS3, adding nested rules, variables,mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.

Sass has two syntaxes. The new main syntax (as of Sass 3) is known as ‘SCSS’┬Ł (for ‘Sassy CSS’), and is a superset of CSS3’s syntax. This means that every valid CSS3 stylesheet is valid SCSS as well. SCSS files use the extension:┬á.scss.

The second, older syntax is known as the indented syntax (or just “Sass”). Inspired by Haml’s terseness, it’s intended for people who prefer conciseness over similarity to CSS. Instead of brackets and semicolons, it uses the indentation of lines to specify blocks. Although no longer the primary syntax, the indented syntax will continue to be supported. Files in the indented syntax use the extension:┬á.sass.

For example: A SCSS file looks like this:

$blue: #0000ff;
$margin: 10px;

@mixin table-base {
  th {
	@extend td;
	background-color: darken($blue, 10%);
    text-align: center;
    font-weight: bold
  }
  td, th {
	padding: 2px;
	font-size:11px;
	font-family: Tahoma, Arial, sans-serif
	}
}

@mixin left($dist) {
  float: left;
  margin: $margin/2;
  margin-left: $dist;
}

#data {
  @include left(10px);
  @include table-base;
}
and when you compile it with SASS tool, it gives this output:

/* CSS */
#data {
  float: left;
  margin: 5px;
  margin-left: 10px; }
  #data th {
    background-color: #0000cc;
    text-align: center;
    font-weight: bold; }
  #data td, #data th, #data th {
    padding: 2px;
    font-size: 11px;
    font-family: Tahoma, Arial, sans-serif; }

 

In my next post, I’ll explain how to install it on Windows systems. Meanwhile, you could check it’s beautiful website which contains tutorials about SASS language and a detailed documentation.

Bir isim koyma hikayesi: nelm.io

Ortaya bir ├╝r├╝n, bir proje ├ž─▒karmak isteyen ki┼čileri projenin kendisi fazla zorlamam─▒┼čt─▒r ┼čimdiye kadar, genelde en ├žok zorlan─▒lan k─▒s─▒m projeye verilecek isim bulma olmu┼čtur. ├žo─ču projeler iki ├╝├ž defa isim ve tasar─▒m de─či┼čtirmi┼čtir belki bu y├╝zden. isvi├žreli nelm.io firmas─▒n─▒n kurulu┼č hikayesi de buna benzer bir ba┼člang─▒ca sahip ama biraz farkl─▒ bir ├ž├Âz├╝mle sonu├žlanm─▒┼č.

Elemanlar d├╝┼č├╝nm├╝┼č ta┼č─▒nm─▒┼č, ortaya koymak istedikleri isim ile ilgili kriterlerini d├Âkm├╝┼čler ka─č─▒da. Birincisi, “Biz geek’iz”, ikincisi, “yapt─▒─č─▒m─▒z i┼člerde en iyisi biziz”, ├╝├ž├╝nc├╝s├╝ de “bizimle ger├žekten ├žal─▒┼čmak istersiniz” ┼čeklinde m├╝┼čteriye yans─▒tmak ve kendileri de g├Ârmek istedikleri hedefler belirlemi┼čler ve en ba┼čta “inc6” diye bir isim at─▒lm─▒┼č ortaya. Tabi ismin ├Ânemli olmas─▒ yan─▒s─▒ra uygun domain’lerin de bo┼č olmas─▒ gerekiyor e─čer internet i┼čiyle u─čra┼č─▒yorsan─▒z. Bu isim i├žin iki ihtimal de uygunmu┼č asl─▒nda.

ama tabi bir ismi kullanmadan ├Ânce onun daha ├Ânce kullan─▒l─▒p kullan─▒lmad─▒─č─▒n─▒ ara┼čt─▒rman─▒z gerekiyor. Ba┼čka birisinin kulland─▒─č─▒ bir ismi kullanmak demek, en ba┼čta ticari anlamda i┼č yapmak i├žin bir engel, patenti var, lisans─▒ var, izinleri var, vesaire, hadi o k─▒sm─▒ atlatt─▒n─▒z, ayn─▒ ismi veya and─▒ran bir ismi kulland─▒─č─▒n─▒zda isim sahibi e─čer iyi i┼č yap─▒yorsa “taklit, onlar─▒n ismini kullanarak prim yapmaya ├žal─▒┼č─▒yorlar” gibi gereksiz durumlara d├╝┼čebilir, e─čer isim sahibi k├Ât├╝ bir ├╝ne sahipse de ma├ža 2-0 yenik ba┼člamak gibi bir dezavantaja sahip olabilirsiniz.

piyasaya sormu┼č soru┼čturmu┼člar “inc6 isminde bir ┼čirket duydunuz mu?”,”b├Âyle bir marka g├Ârd├╝n├╝z m├╝?” gibilerinden. inc6’n─▒n inc k─▒sm─▒n─▒ tabi geek jargonuna uysun diyerekten “incremental”‘─▒n k─▒saltmas─▒ olarak d├╝┼č├╝nm├╝┼čler. ama piyasaya ara┼čt─▒rmas─▒n─▒ yaparken ┼čunu anlam─▒┼člar, bili┼čimle ilgisi az olan veya olmayan kimseler, bunu “incorporated” olarak d├╝┼č├╝nm├╝┼čler hep. tabi marka olmak isterseniz herhangi bir isim kar─▒┼č─▒kl─▒─č─▒na da mahal vermemeniz ├Ânemli. bu y├╝zden yeni bir isim bulmalar─▒ gerekti─čini anlam─▒┼člar.

ve bu esnada ┼čunu farketmi┼čler. ├žo─ču marka asl─▒nda anlam─▒ olan kelimeler de─čiller. nike, sony, mozilla vesaire kelimeler anlaml─▒ kelimeler olmasalar da, bu isimler i├žin ├žal─▒┼čan y├╝zlerce ki┼činin emekleri sonucu bu kadar ├╝ne sahip kelimeler olmu┼člard─▒r.

nitekim rastgele ve g├╝zel g├Âr├╝nen, kula─ča ho┼č gelen kelimeler ├╝retmekte aram─▒┼člar ├ž├Âz├╝m├╝. Ve rastgele d├╝┼č├╝nmekte kimin ├╝zerine yoktur? tabi ki bilgisayarlar─▒n. bu d├╝┼č├╝nceyle yola ├ž─▒karak bir bilgisayar yaz─▒l─▒m─▒ geli┼čtirmi┼čler. mant─▒─č─▒n─▒ dokuwiki yaz─▒l─▒m─▒n─▒n random ┼čifre ├╝reten auth_pwgen() fonksiyonunda bulmu┼člar ve bu fonksiyonu biraz modifiye ederek 100 tane rastgele isim ├╝reten bir script yazm─▒┼člar. daha sonra bir starbucks’ta bulu┼čmu┼člar. 3 saat s├╝rm├╝┼č bu isimleri bulma ├žal─▒┼čmalar─▒. e tabi kolay de─čil. o kadar random kelimenin aras─▒ndan bir kelime ho┼čunuza gitse bile, onun kula─ča, dile yatk─▒nl─▒─č─▒, google’da ara┼čt─▒rmas─▒, domainlerin uygunlu─ču falan ara┼čt─▒r─▒lmas─▒ gerekiyor.

binlerce kelimeyi ingilizce frans─▒zca almanca aksanlar─▒yla sesli bir bi├žimde okuduktan sonra “nelmio” kelimesinde karar k─▒lm─▒┼člar. “asl─▒nda ilk g├Âr├╝┼čte a┼čk de─čildi bu kelime” diyorlar, ama tabi i├žleri ─▒s─▒nm─▒┼č ve son g├╝nlerin modas─▒ “.io” uzant─▒l─▒ domain de bo┼čta oldu─ču i├žin “nelm.io” onlara pek ├žekici gelmi┼č. bu isim listelerindeki 3. isimmi┼č ama 5 tane daha b├Âyle ho┼člar─▒na giden isim bulmu┼člar ve gelecekteki projeleri i├žin ellerinde tutuyorlarm─▒┼č.

kodu merak edenler i├žin:

<?php 

$c  = 'bcdfghjklmnprstvwz'; //consonants except hard to speak ones
$v  = 'aeiou';              //vowels
$a  = $c.$v;                //both

for ($i = 1; $i <= 100; $i++) {
    $pw = '';

    //use two syllables...
    for($j=0;$j < 2; $j++){
        $pw .= $c[rand(0, strlen($c)-1)];
        $pw .= $v[rand(0, strlen($v)-1)];
        $pw .= $a[rand(0, strlen($a)-1)];
    }

    echo $pw . "\n";
} ?>

Buradan da canl─▒ olarak test edebilirsiniz.

 

Kaynak : http://nelm.io/blog/2011/08/the-algorithm-that-named-us-nelmio/

PHP Animated Gif Resizer

There are many sites that use avatars and sometimes they use animated GIF files. But when it comes to resizing them, it really becomes a pain when your server doesn’t support ImageMagick. So I decided to write an animated GIF resizer based on GD Library (Because GD doesn’t support it directly either.)

It works like this:

  1. Extract frames from GIF animations into a temporary folder.
  2. Resizes all the frames
  3. Combines them into one file

Using this class is really simple. Here is the code

<?php
include_once "gifresizer.php";
$gr = new gifresizer;
$gr->temp_dir = "frames"; //note that it doesn't end with a "/"
$gr->resize("gif/1.gif","resized/1.gif",200,300);

// $gr->temp_dir = {a folder with a write permission (777)}; // The temporary folder which frames will be extracted to.
// $gr->resize({file to be resized}, {new file to be created}, {new width}, {new height});
?>

Here’s an example:

 

Original GIF file :


Resized Image:


Here you can download the class, documentation and examples.

PHPClasses.org class main page

 

Note: I’m expecting some feedback. Here or at phpclasses.org. Doesn’t matter. If you are using it, tell me how it works.

about costabrava hack and some fix.


T├╝rk├že:
Hostunuzdaki b├╝t├╝n php dosyalar─▒n─▒za eval ve base64_decode kodunu kullanan ve google’da sitenizi arat─▒p linkinize t─▒klad─▒─č─▒n─▒z zaman costabrava diye bir siteye y├Ânlendiren bir enfeksiyonunuz varsa altta payla┼čt─▒─č─▒m fixcosta.rar dosyas─▒n─▒ a├ž─▒p i├žindeki PHP dosyas─▒n─▒ hostunuza y├╝kl├╝yorsunuz ve ├žal─▒┼čt─▒r─▒yorsunuz. sitenizdeki zararl─▒ kodlar (e─čer modifikasyona u─čramamam─▒┼čsa) temizleniyor.

Kaynak olarak http://redleg-redleg.blogspot.com/p/simple-script-to-find-base64decode-in.html adresindeki vir├╝s bulucu kodu kulland─▒m ve ├╝zerine temizleyen kodu ekledim.

Daha sonra, e─čer hostunuzda wordpress kurulu ise ve temalar─▒n─▒z aras─▒nda TwentyTen temas─▒ varsa, ve kullanm─▒yorsan─▒z, silin.

 

English: Today I had this on my server and needed to fix like a hundred files which are infected with some nasty redirection script. So I wrote this php file to remove all the injected codes from my php files and I decided to share with you.

You can check if your server is infected or not by googling your web site and then clicking the link. If it opens your site, it’s ok. But if it redirects to “costabrava.bee.pl“, your server is infected. You should do something.

Its based on http://redleg-redleg.blogspot.com/p/simple-script-to-find-base64decode-in.html which finds the infected files, and I added the code to remove the costabrava.bee.pl header.

First, download the code below here and unrar it. there’s one php file named “fixcosta.php” and upload it into your server’s root directory. then run it.

Second, if you’re not using TwentyTen theme, delete the folder from wp-content/themes.

This’ll fix it for now. Then you should search how the hacker got into your ftp and uploaded these files. And find a fix for that too.

Last.fm RPS

Follow me on Twitter

GiottoPress by Enrique Chavez