Livereload ta page gratos!

Classé dans : Web | 0 commentaire(s)

15
02 | 13

Quoi c'est? C'est comment recharger automatiquement un (ou plusieurs) tab(s) de votre navigateur lorsqu'un fichier est modifié. Il s'agit d'un script en ruby (pas de panique, ruby est installé sur votre mac ;-) et d'un service automator qui surveille le dossier depuis le quel vous l'invoquez. Z'allez voir, c'est très simple à installer/utiliser. Yay!

Mini-clip:




Script Ruby:


#!/usr/bin/env ruby
# watch.rb by Brett Terpstra, 2011 
# with credit to Carlo Zottmann 

trap("SIGINT") { exit }

if ARGV.length < 2
  puts "Usage: #{$0} watch_folder keyword"
  puts "Example: #{$0} . mywebproject"
  exit
end

dev_extension = 'dev'
filetypes = ['css','html','htm','php','rb','erb','less','js']
watch_folder = ARGV[0]
keyword = ARGV[1]
puts "Watching #{watch_folder} and subfolders for changes in project files..."

while true do
  files = []
  filetypes.each {|type|
    files += Dir.glob( File.join( watch_folder, "**", "*.#{type}" ) )
  }
  new_hash = files.collect {|f| [ f, File.stat(f).mtime.to_i ] }
  hash ||= new_hash
  diff_hash = new_hash - hash

  unless diff_hash.empty?
    hash = new_hash

    diff_hash.each do |df|
      puts "Detected change in #{df[0]}, refreshing"
      %x{osascript<<ENDGAME
        	tell application "Safari"
          	set windowList to every window
          	repeat with aWindow in windowList
          		set tabList to every tab of aWindow
          		repeat with atab in tabList
          			if (URL of atab contains "#{keyword}") then
          			  tell atab to do javascript "window.location.reload()"
          			end if
          		end repeat
          	end repeat
        	end tell
ENDGAME
}
    end
  end

  sleep 1
end


  • Copiez/collez ce script dans un éditeur de texte et enregistrez le dans un des chemins de votre $PATH (ex: /usr/local/bin/watch.rb).
  • Depuis le terminal, donnez au fichier les droits d'éxécution:
chmod a+x watch.rb

Service:


  • Télécharger ce fichier dans ~/Library/Services
  • Faites un clic droit sur un des dossiers que vous voulez surveiller puis Services->Watcher


Source

Partager cette page :

Identi.ca Twitter Digg Stumble Delicious Technorati Facebook


Ecrire un commentaire



Quelle est la dernière lettre du mot ficli ? :