## Posts Tagged ‘html’

### Create a “when I am busy” calendar

Monday, September 12th, 2016

Here’s how to create a public calendar on your website that shows when you are busy. For example, mine

\1. To set up sharing go to your calendar on http://calendar.google.com, select Sharing from the drop down on the left side:

\2. Make sure that it’s public but only showing busy:

\3. Then go to “Calendar Details”, copy the <iframe ... HTML tag:

\4. On your website, create a calendar.html page with the following contents (replacing the <iframe ... tag appropriately):

“

<!DOCTYPE html>
<html>
<title>Alec's Busy</title>
<style>
html {margin: 0;padding 0;}
body { margin: 0;position:fixed; left:0; width:100%; top:0; height:100%; }
iframe { margin: 0;display: block; width:100%; height:100%; }
</style>
<body>
<iframe src="https://www.google.com/calendar/embed?title=Alec&#39;s%20Busy&showCalendars=0&mode=WEEK&src=alecjacobson%40gmail.com&ctz=local" style=" border-width:0 " width="100%" height="95%" frameborder="0" scrolling="no"></iframe>
</body>
</html>


“

Finally, if you’re logged into your google account and you visit your calendar.html page, you might be freaked out because you see all of your events (instead of busy). But to verify that it’s really hidden, use an “incognito”/private window to see that it just shows “busy”.

### Remove prince annotation from pdf

Tuesday, November 10th, 2015

Here’s a little perl script to remove the prince watermark note from a pdf:

perl -p -e '!$x && s:/Annots $[0-9]+ 0 R [0-9]+ 0 R ?([^$]+)\]:/Annots [\1]: && ($x=1)' input.pdf > output.pdf


Update:

So, unfortunately the simple perl hack will “damage” the pdf. It seems that most viewers will ignore this, but I was alerted that a popular ipad reader “GoodReader” produces an ominous “This file is damaged” warning (though it then renders OK).

I couldn’t quite reverse engineer why, but here’s a temporary albeit heavy-handed fix. After running the perl script, also repair the pdf with ghostscript:

gs -o output.pdf  -sDEVICE=pdfwrite -dPDFSETTINGS=/prepress input.pdf


Note that output.pdf cannot be the same as input.pdf or it quietly creates an empty pdf instead.

Update:

Even better you can directly remove the specific Annotation from prince:

perl -i -p -e 's:/(Rect $572\.0000 716\.0000 597\.0000 741\.0000$|Contents $$This document was created with Prince, a great way of getting web content onto paper.$$)::' input-and-output.pdf


Update:

Or even even better better:

  perl -i -pe 'BEGIN{undef $/;} s:/Rect.*?Contents $$This document was created with Prince, a great way of getting web content onto paper.$$::smg' input-and-output.pdf  ### Drop-in replacement header for switching from MathJax to KaTeX in markdown Friday, November 7th, 2014 I wanted to try out switching to KaTeX from MathJax for our libigl tutorial. KaTeX needs a little bit of javascript besides the including the script to know to iterate over all class=math tags and render the latex code. Also, it seems that markdown translates \$$x+y\$$ into <span class=math>$$x+y$$</span> and the \( parenthesis throw off the KaTeX. You get an error like: ParseError: KaTeX parse error: Expected 'EOF', got '\(' at position 2: \(x+y  So my header to switch from mathjax simply iterates over all math tags on document load using jquery and strips these parenthesis (which I expect on all tags): <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.1.1/katex.min.css"> <script src="http://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.1.1/katex.min.js"></script> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script>$(function(){
$(".math").each(function() { var texTxt =$(this).text();
texTxt =  texTxt.slice(2,-2);
el = $(this).get(0); if(el.tagName == "DIV"){ addDisp = "\\displaystyle"; } else { addDisp = ""; } try { katex.render(addDisp+texTxt, el); } catch(err) {$(this).html("<span class='err'>"+err);
}
});
});
</script>


I didn’t invest much more into bulletproofing this because it seems like KaTeX is still in its infancy in terms of LaTeX support. It doesn’t support unicode characters (e.g. ∑, ∆, π) or common tags like \mathbf or \begin{cases}. Hopefully it will eventually, it is much faster than MathJax for the simple equations.

### Continuously refresh markdown output

Tuesday, June 17th, 2014

I had a hard time finding a chrome plugin for a rendering markdown which supported LaTeX equations. Instead I’m using multimarkdown which supports equations with mathjax. However, to render the html output I need to open it in Chrome and refresh it when anything changes. So my pipeline looks like:

repeat
edit .md files
run multimarkdown command
open/refresh .html file in chrome
end


I found this nice ruby/applescript script.
I’ve modified it to support markdown files and to run a command when a file changes:

#!/usr/bin/env ruby
# watch.rb by Brett Terpstra, 2011 <http://brettterpstra.com>
# with credit to Carlo Zottmann <https://github.com/carlo/haml-sass-file-watcher>

trap("SIGINT") { exit }

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

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

while true do
first = true
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
if not diff_hash.empty?
if first and not command.empty?
val=#{command}
first = false
else
break
end
else
sleep 1
end
end

unless diff_hash.empty?
hash = new_hash

diff_hash.each do |df|
puts "Detected change in #{df[0]}, refreshing"
%x{osascript<<ENDGAME
tell application "Google Chrome"
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 reload
end if
end repeat
end repeat
end tell
ENDGAME
}
end
sleep 1
end

end


Save this in a file watch.rb and then call with something like:

watch.rb . readme "multimarkdown readme.md -o readme.html"


### Open IEEE pdf without banner

Tuesday, February 11th, 2014

The IEEE Xplore library has a very annoying way of serving up PDFs. The page has two frames, one’s a small banner at the top and the bother is the PDF. Both Safari and Chrome keep the banner in focus so when I try to zoom I’m just zooming the banner. Here’s a javascript bookmarklet to open that second frame as a proper page:

javascript:(function(){window.location.href=document.getElementsByTagName("frame")[1].src;})()


### Flushing php output on Safari with php scripts (hosted by Bluehost)

Thursday, June 13th, 2013

There are many, many posts about getting php to flush its output while a script is executing. No one solution worked for me, but I finally found a combination of things that did.

First of all my default php.ini shows these two relevant lines:


output_buffering = On
zlib.output_compression = Off


Then I put an .htaccess file in the directory that I’d like to have my buffering script with the following line:


SetEnv no-gzip dont-vary


Finally here was my small test php file:


<?php  // not in table tags for IE
@ini_set('zlib.output_compression', 0);
@ini_set('implicit_flush', 1);
//for ($i = 0;$i < ob_get_level(); $i++) { ob_end_flush(); } ob_end_flush(); ob_implicit_flush(1); ?> <html> <body> <?php echo str_pad('',1024); // minimum start for Safari for ($i=10; $i>0;$i--) {
echo str_pad("$i<br>\n",8); // tag after text for Safari & Firefox // 8 char minimum for Firefox usleep(100000); } ?> </body> </html>  ### Php generate html select options from array Tuesday, November 8th, 2011 Here’s a super obvious php snippet that generates a list of options for a “select” html form tag on the fly:  <select id="tf_select" name="tf_select" onchange="update(this,document.getElementById('tf'));"> <option value="">Select...</option> <?php$a = array("New Haven","Rochester","New York","Washington D.C.","Seattle","Zurich");
foreach($a as$e)
{
echo "<option value='".$e."'>".$e."</option>";
}
?>
<option value="Other...">Other...</option>
</select>


Combined with the javascript from an earlier post, it should be very easy to generate selectors for php based forms.

### Set up virtual host on mac os x

Tuesday, September 6th, 2011

We’re using SVN to version control our group’s webpage which is all php scripts. If everything were html files then making edits on a locally checked out copy would be easy since I can just open the files in a browser and check my edits. But, being PHP scripts, to properly see the sites I need a php server running which can host the local copy of the site and I can see the edits I make live. Then finally when I’m sure everything looks and executes correctly I can check in the edited version and update the version on the real server. Here’s how I constructed my local setup.

Check out svn to some directory, from now on referred to as “path/to/htdocs-igl”:


svn co https://private.svn.server.com/trunk/htdocs-igl path/to/htdocs-igl


Be sure that no apache servers are not running. The following in order should to do that:


sudo apachectl stop


Use ps and grep to determine if they really stopped. This should return nothing:


ps -ef | grep httpd | grep -v grep


If it returns some lines, then kill each replacing [PID] with each row’s process ID:


sudo kill [PID]


If the process didn’t really die then try:


sudo kill -9 [PID]


And after you think you’ve done enough killing, issuing this again for good measure:


sudo apachectl stop


Now that we’re sure no apache servers are running. Start one:


sudo apachectl start


To check that it’s working browse to http://localhost/. You should see something fully load other than “Not found, blah blah”.

Now, add the following as a new line at the bottom of the file /etc/hosts:


127.0.0.1       localigl


Now you should be able to go to http://localigl/ and see the same thing as you did with http://localhost/.

To have http://localigl/ point to your checked out version of the website, you need to edit the file /etc/apache2/users/[your mac username].conf:


NameVirtualHost *:80

Options Indexes MultiViews Includes
AllowOverride All
Order allow,deny
Allow from all
</Directory>

<VirtualHost *:80>
ServerName localhost
</VirtualHost>

<Directory "/absolute/path/to/htdocs-igl/">
Options Indexes MultiViews Includes
AllowOverride All
Order allow,deny
Allow from all
</Directory>

<VirtualHost *:80>
ServerName localigl
DocumentRoot /absolute/path/to/htdocs-igl
</VirtualHost>


Replacing, in the file name and the file contents, [your mac username] with, uh, your mac username.

You must give execute access to parent directory and the root directory of the checked out website:


chmod 755 path/to/htdocs-igl/..
chmod 755 path/to/htdocs-igl


Finally, restart the server with:


sudo apachectl graceful


If you now go to http://localigl/ you should see a listing of the checked out website’s root directory contents (or if you’re using index.html, you’ll see that rendered file). Since we’re using PHP for everything we must enable php scripts.

Uncomment the following line in  /etc/apache2/httpd.conf to look like this:




And again restart the server:


sudo apachectl graceful


Now when you go to http://localigl/ you should see your php scripts executed and rendered.

Source This document is well written but did not enough stress that you must stop all servers (that you may have accidentally started when fooling around) before starting the steps. And it’s nice to repeat his steps with exact names closer to my current set up.

### Fullscreen, blank homepage

Saturday, September 3rd, 2011

I usually use a blank or empty page as my homepage. This makes for quick browser start up and minimal waiting when making new tabs/windows.

I find myself often opening a new browser window resizing it to fill the whole screen and then browsing. This goes against how apple wants me to use my mac. The little green plus sign button on the top left corner of the screen is supposed to be smart enough to always maximize the current window only as much as it needs to/should. But what is the correct maximization of a blank page? Apparently its a full height window with some arbitrary width. Why not make it a full height and full width window. To do this for my browsers (Safari, Firefox, Chrom(e|ium)) I made a little html file that displays a blank, fullscreen-able page. Save the following in a file on your computer called fullscreen-homepage.html:


<html>

Open the file with your browser and copy the address at the top (starting with file:// to your browser’s preferences as your homepage for new tabs and windows. Here’s what to change in the Safari preferences: