Saturngod

What's on my mind

Custom Wintersmith Helper

Today , I was trying to add twitter card in my blog. It have a problem for twitter card description. Wintersmith didn’t support plain text for blog post. Blog intro already using the HTML code. So, I need to remove.

So, I create the custom helper like following.

Create a wintersmith-custom-helper folder under node_modules

In the wintersmith-custom-helper , it have 2 file. index.js and package.json .

In the package.json

{
  "name": "wintersmith-customhelper",
  "version": "1.0.0",
  "description": "Custom Helper For My Blog",
  "author": "saturngod",
  "license": "MIT",
  "keywords": [
    "wintersmith",
    "wintersmith-custom-helper"
  ],
  "main": "index.js",
  "dependencies": {
  },
  "devDependencies": {
    "vows": "0.7.x",
    "wintersmith": "2.x"
  },
  "peerDependencies": {
    "wintersmith": "2.x"
  }
}

I gave the module name is wintersmith-customhelper.

In the index.html

module.exports = function(env, callback) {
  env.helpers.getDescription = function(htmlcode) {
    var code;
    code = htmlcode.replace(/(<([^>]+)>)/g, "");
    code = code.substring(0, 255);
    code = code.replace("\n", " ");
    code = code.replace("\"", "");
    return code = code + " ... ";
  };
  return callback();
};

I create the getDescription helper for description.

After finish that, need to update the config.json

In the config.json , we need to put the plugin. So, it will be like

"plugins": [
    "wintersmith-tag",
    "./node_modules/wintersmith-custom-helper"
  ],

Done. So, we can call env.helpers.getDescription in our template.

- var plain = env.helpers.getDescription(page.intro)
meta(name='twitter:description', content="#{plain}")

It easy to create helper and you can also use .coffce instead of .js file for plugin.

Fixed Disqus For WinterSmit

I am using disqus for my blog. However, it has a problem. If the URL is include query string , comments can’t show and it’s showing new one. I found a solution JavaScript configuration variables of disqus.

We need to put correct URL at disqus_url variable. So, I put

var disqus_url = document.location.origin + document.location.pathname;

For jade template , it will look like

#disqus_thread
  script(type='text/javascript')
      |/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
      |var disqus_shortname = 'myblogname'; // required: replace example with your forum shortname
      |var disqus_url = document.location.origin + document.location.pathname;
      |/* * * DON'T EDIT BELOW THIS LINE * * */
      |(function() {
      |var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
      |dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
      |(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
      |})();
    noscript
      | Please enable JavaScript to view the
      a(href='http://disqus.com/?ref_noscript') comments powered by Disqus.
    a.dsq-brlink(href='http://disqus.com')
      | comments powered by
      span.logo-disqus Disqus

After that , there is no more problem about query string URL problem.

Wordpress To Wintersmith

After moving to the wintersmith from wordpress, I have two problem.

  1. need to redirect old url to new url
  2. re-import old comments to new url
  3. re-import old images
[...]

Wintersmith

Today, I moved to the wintersmith from the wordpress. Wordpress is amazing blog platform. However, I want to try a static generated blog instead of dyanmic. Actually there is no reason for changing to static page. After testing wintersmith , it is really fast. It is easy to use.

Pros : support markdown. Static pages. Really fast. Can use with github pages.

Cons : no full text search and use with google custom search. Need to use jade for creating template. Only few templates. You need computer to write blog.

I prefer wintersmith than jekyll because of node.js. I can customize if it’s require to change.

[...]

Vbulletin login with Curl

Today I try with vbulletin login with curl. I have a trouble problem and can’t login because there is no vbulletin cookie for login. I found soultion from vbulletin forum. Here it’s my code

`$posturl=$blog_live_site.”forum/login.php?do=login”; $postdata=”do=login&amp;url=%2Findex.php&amp;vb_login_md5password=”.$forum_pwd.”&amp;vb_login_username=”.$username.”&amp;cookieuser=1”; $user_agent = “Mozilla/5.0 (compatible; MSIE 5.01; Windows NT 5.0)”;

$ch = curl_init();

curl_setopt($ch, CURLOPT_POST,1); curl_setopt($ch, CURLOPT_POSTFIELDS,$postdata); curl_setopt($ch, CURLOPT_URL,$posturl); curl_setopt ($ch, CURLOPT_COOKIEJAR, “mydomain.com”); curl_setopt($ch, CURLOPT_REFERER, “http://www.mydomain.com/login.php“); curl_setopt($ch, CURLOPT_USERAGENT, $user_agent); curl_setopt($ch, CURLOPT_RETURNTRANSFER,1); $result=curl_exec ($ch); curl_close ($ch);

`

 

You also need to change cookie name from vbulletin admin panel. In admin panel , VB Option > Cookies and Header Options > Cookie Domain Add your domain name without www in Custom Setting. Domain name should be same like CURLOPT_COOKIEJAR value.

xib can't load Resource

Today, I have a trouble error. When I click Reload All class in Interface Builder, my xib is not loaded resource. But it's working. 

Soultion

r-click on xib > Get Info and then you will see Info dialog. Please choose your Path again. It will work smooth again.

If it’s not working, remove your xib from your project. Copy your xib from your project and paste in other place. Delete your xib in your project folder. Add your xib from xcode, it will work again.

I take a long time for searching solution and I can’t find in goolging too :(

WebM file size

<div class='p_embed p_image_embed'>

Media_httpensaturngod_zakjb

HTML5 audio with javascript

Create audioElement

var audioElement = document.createElement('audio');

want to use with current audio tag

var audioElement = document.getElementById('myaudio');

Play

audioElement.play();

Pause

audioElement.pause();

Stop

audioElement.pause();
audioElement.currentTime = 0;

Duration (show with seconds)

audioElement.duration

Current Time (seconds)

audioElement.currentTime

Go to 35 secons

audioElement.currentTime = 35;

Change music

audioElement.setAttribute('src', 'music/Track01.mp3'); audioElement.load();

Ogg for firefox and opera. Mp3 for safari and chrome.

html audio with jquery UI

I need to implement , next , previous and change to another music when music has been stop.

Source http://github.com/saturngod/html5audio-jquery_ui

Demo http://www.saturngod.net/project/html5audio/

MAMP 1.9 Upgrade

That a crazy thing. I lost my some data. If you upgrade the system, you need to backup all data first. Best thing is give MAMP folder to MAMP_old and then Install MAMP. After that, just copy htdocs and db folder to MAMP. After you can change the default port. Mysql may not work. So, try this

$lsof -i | grep mysql

mysqld 11714 saturngod 10u IPv4 0x0c108a8c 0t0 TCP *:mysql (LISTEN)

you will see PID number and kill it.

$ kill -9 11714

Restart MAMP again.