水曜日, 9月 19, 2012

IE でCSS3の display:box を使うには、flexie.js を使えばいい

そうです。IEはまだCSS3の display:box 仕様に対応していません。

このボックス仕様を使うと、横並びのボックスがエレガントに書けます。


外側のDIVに、このように指定します。

    display: -webkit-box;
    display: -moz-box;    
    display: box; 
 
内部のDIV要素がきれいに並んでくれます。
 
ただし、上記のようにIEには対応していません。

そこで、この flexie.js を導入すると、見事に横並びボックスが実現できます。

ダウンロード:http://flexiejs.com/
 
これでページのHTMLタグが整理できそうです。
 
 

土曜日, 9月 08, 2012

シームレスの背景画像をGIMPで作るには

シームレスの背景画像をGIMPで作るには、メニューからFilters|Map|Make Seamlessを選択します。

すると画像を一発でシームレスにできます。

こんな感じです。

http://easai.web.fc2.com/odonata/photoindex/


木曜日, 9月 06, 2012

Excel のマクロを消すマクロ

Excel のマクロを消すマクロを書こうと思ったら、警告が出ました。

マクロはこんな感じです。

こちらのページ「VBAでマクロのソース削除と標準モジュール削除」を参照させていただきました。

Dim objVBCOMPO     As Object
        For Each objVBCOMPO In ActiveWorkbook.VBProject.VBComponents
            With objVBCOMPO.CodeModule
                If .CountOfLines <> 0 Then .DeleteLines 1, .CountOfLines
            End With
            If (objVBCOMPO.Type = vbext_ct_StdModule Or objVBCOMPO.Type = vbext_ct_MSForm) Then
                ActiveWorkbook.VBProject.VBComponents.Remove objVBCOMPO
            End If
        Next objVBCOMPO
        Set objVBCOMPO = Nothing
End Sub


これをデフォルトの設定で走らせると警告が出ます。



これは、マクロセンターの Trust access to the VBA project object model オプションをオンにすると動くようになります。

金曜日, 8月 31, 2012

クリックで表示を切り替える(単位変換など)

米国での長さの単位はきわめていまいましいことにすべてインチ・フィートです。

 ここで、インチ・フィートに要素を変換する jQuery スクリプトを示します。

 $(document).ready(function(){
  $(".millimeters").hide();
  $("#convertIN").click(function(){
   $(".millimeters").hide();
   $(".inches").show();
      });
  $("#convertMM").click(function(){
   $(".millimeters").show();
   $(".inches").hide();
      });
     });

JQuery であると容易に要素の表示を切り替えることができます。

 ... there was a question in the Reddit session to Obama whether the US would ever move to metric system.

リンクをかけたブロックの中に、別のリンク先に飛ぶエレメントを置く

リンクをかけたブロックの中に、別のリンク先に飛ぶエレメントを置きたいとします。

ブロックにはリンクがかかっているので、内部の要素をクリックしてもリンク先に飛んでしまいます。

どのようにリンクを無効にするか。

jQuery には event.preventDefault() というメソッドがあります。

これを呼ぶと、ブロックにかかっているリンクを無効にできます。

     $(document).ready(function(){
         $(".クラス名").click(function (event){
             event.preventDefault();
             document.location="飛ばしたい先のアドレス";
         });
     });


これで、内部要素をクリックすると、ブロックにかかっているリンクを無効にして指定されたアドレスに飛ぶよう指定できます。

(はいはい。ブロックにリンクをかけるというのは推奨されない方法です。)

水曜日, 8月 29, 2012

好みのエディタでオンラインの文章を編集する

ブログ編集画面などで、テキストエリアの文章を好きなエディタで編集可能な Firefox のアドオンがあります。

→ It's All Text!

このアドオンを使うと、テキストエリアにボタンがついて、押すと指定されたエディタが起動します。

ホットキーやエディタの設定は、Firefox のメニューから、Add-ons の Extensions で設定します。

 It's All Text の Options ボタンを押すと、設定画面が表示されます。


このアドオンがあると、オンラインでのテキスト編集の精神的負担が軽くなります。

ブログなどでオススメです。

火曜日, 8月 28, 2012

xampp 1.8 にアップグレードしました。

xamppをアップグレードしました。Ver. 1.8が最新のようです。

MySQLもアップグレードとなるので、データベースも移動することになります。

このあたりは、data以下をすべてまるごとコピーでOK。

phpMyAdminでID/Passwordの設定を行ってデータベースがきちんと移動できたかどうかを確認して一安心。

ファイル: config.inc.php
$cfg['Servers'][$i]['user'] = 'ユーザー名';
$cfg['Servers'][$i]['password'] = 'パスワード';

PHPのデフォルトがすべての警告を表示するとなっているので、まずそいつに黙ってもらって無事にアップグレードを完了。

ファイル: /php/php.ini
;error_reporting = E_ALL | E_STRICT
error_reporting = E_ERROR

を使えるようにして、curlを有効にする。

short_open_tag = On

extension=php_curl.dll
 
コントロールパネルもアップグレードされておりました。

月曜日, 8月 06, 2012

Excelのキャッシュをクリアする

Excelマクロの問題です。

サブルーチンの文字を書き換えるとExcel自体が壊れる。

といういかにもプログラミング環境の不備という問題に直面しました。

プレコンパイルしているとすればキャッシュファイルを消すという手順が必要となるわけですが、ネットに情報がない。

ActiveXのキャッシュがあるとされる場所には.exdファイルは見当たらず。
C:\Users\ユーザー名\AppData\Local\Temp\VBE

...

結局サブルーチン名を書き換えるということで問題を解決。

木曜日, 8月 02, 2012

Windows上でepubを作成する方法

とはいっても、改造したファイルをepub形式に変更する方法の紹介です。

.epubファイルは、.zipファイルそのものです。拡張子を.zipにして 解凍するとファイルが読めます。

基本的にはxhtmlファイルで構成されます。

音声を追加したい場合には、xhtmlファイルにaudioタグを追加します。

<audio autoplay="false" controls="true" src="ファイル名"></audio> 
 
改造したファイルをepub形式に変換するときは、単に圧縮するだけでは.epub形式とはなりません。 

Windows上でepubを作成するには、

memetypeは圧縮しない。まずmimetypeをzipファイルに変換。
次いで他のファイルを追加する。拡張子を.epubに変換する。→完成



月曜日, 7月 16, 2012

cygwin 上でGCC 4.6.3 を導入して range-based-for を使う

range-based-for を使いたくて、g++4.6.3 にアップグレードしました。

cygwin の最新版は 4.5で、range-based-for は実装されていません。

[windows][cygwin]最新のg++コンパイラをCygwin上で導入する

コンパイルには ↑ このページを参照させていただきました。

↓ ソースはここからダウンロードできます。

GCC miror sites

 range-based-for を使ったコードを以下に示します。

#include<iostream>
using namespace std;
int main()
{
  int arraytest[5]={1,2,3,4,5};
  for(int i:arraytest)
    cout<<i;
  cout<<endl;
  for(int &i:arraytest)
    i=0;
  for(int i:arraytest)
    cout<<i;
}
コンパイラオプションは以下の通り。
$> g++ -std=c++0x range.cc

日曜日, 7月 15, 2012

chronoの使い方のメモ。

c++11で定義されているchronoの使い方のメモ。
#include <iostream>
#include <chrono>

int main()
{
  auto tp=std::chrono::system_clock::time_point();
  std::time_t t=std::chrono::system_clock::to_time_t(tp);
  std::cout << std::ctime(&t)<<std::endl;

  std::chrono::seconds sec(10);
  std::chrono::minutes min(3);
  auto result=sec+min;
  std::cout << result.count() << std::endl;
}
コンパイラのオプションは以下の通り。
/usr/bin/g++-4 -std=c++0x chrono.cpp
c++11ではラムダ式も使えます。
std::cout << [](int x, int y){return x+y;}(1,2) << std::endl;

土曜日, 7月 14, 2012

Java 5.0 可変長パラメータとfor-each

メモのために可変長パラメータとfor-eachを使ったコードを載せておきます。

public class VarLen
{
    int sum(int ... list)
    {
 int s=0;
 for(int i:list)
     {
  s+=i;
     }
 return s;
    }

    public static void main(String args[])
    {
 VarLen varLen=new VarLen();
 System.out.println(varLen.sum(1,2,3,4,5,6,7,8,9,10));
    }
}

金曜日, 5月 11, 2012

データベースでレコードを複製したい場合。

既出だとは思いますが、データベースでレコードを複製したい場合。

このテーブルの場合、IDがauto incrementで主要キーに指定されています。

複製したいレコードのIDを指定し、SELECT構文で値を取得。

その値を新規レコードとして登録します。

INSERT INTO pages SELECT '',title,contents,url FROM pages WHERE ID=$id

木曜日, 4月 12, 2012

Firefoxでフロート位置が不可思議な件

HTMLは常にシーケンシャルでコードを読み解きます。

ところが float などを指定すると、位置が自動的に計算され、時には思いもよらない場所に要素が出現します。



  <div style="padding-bottom:0px;">       <div style="float:left;"> Floating block       </div>   </div>
<div style="margin: 20px 0;border:1px solid red;"></div>


フロート要素があって、marginつきのブロック要素が並んでいます。

では、この場合どちらの要素が先に表示されるでしょう。

FirefoxとIEでは結果が違います。

IEではそのまま表示されます。つまり、フロート要素が上に表示されます。

ところが。Firefoxで見てみると分かりますが、Firefoxではブロック要素が上に表示されます。

そして、さらに不思議なことに、paddingを0ピクセルではなく1ピクセル以上に指定するとまた順番が逆になります。

同じコードでブラウザによって見え方が異なる困ったケースのひとつと言えるでしょう。

月曜日, 4月 02, 2012

Javaの内部匿名クラスからローカル変数にアクセス

Javaの内部匿名クラスから、実はローカル変数にアクセスできたわけですね。

finalをつけておくとコンパイルできます。

(finalでなければコンパイルできません。)


 public class Closure
{
    class Test{};
    
    Closure()
    {
    final int i=0;
    (new Test()
    {
        void test()
        {
        System.out.println(i);
        }
        }).test();
    }

    public static void main(String args[])
    {
    Closure closure=new Closure();
    }
}

もちろん値は変更できません。:)


水曜日, 3月 14, 2012

PHP: get relative path expression

The following code calculate the difference of paths given and return a relative path expression.
 

function getCommonPos($s0,$s1) {   $len=strlen($s0);   $len1=strlen($s1);   if($len1<$len)     {       $len=$len1;     }   while($s0[$i]==$s1[$i] && ++$i<$len1);   return $i; } function diffStr($s0, $s1) {   $pos=getCommonPos($s0,$s1);   $end=strrpos(substr($s0,0,$pos),"\\");   return substr($s0,$end); } function countSlashes($str) {   return substr_count($str,"\\"); } function getRelativePath($p0,$p1) {   $p0=realpath($p0);   $p1=realpath($p1);   $dir=diffStr($p0,$p1);   if(!empty($dir))     {       $n=countSlashes($dir);       $path="";       for($i=0;$i<$n;$i++)     {       $path.="..";       if($i<$n-1)         {           $path.="\\";         }     }     }   $newDir=diffStr($p0,$p1);   $newDir=$path.$newDir;     if(empty($newDir))     $newDir=".";   return $newDir; }

日曜日, 3月 11, 2012

Creating bookmarks with Silhouette Cameo

As the Silhouette Cameo is here, I wrote a Java program to draw regular convex polygons and cut out shapes from paper.  The photo shows the final product, a bookmark.  You can put any of your design into 'production'.  With Silhouette Cameo, you get the final products right away. 



The Studio software detects the outline of shapes automatically.  The procedure would be as follows:

  1. Print out shapes with your own software or draw it with Studio.
  2. Select Object|Trace... from the menu. 
          

            
    1. Click the "Select Trace Area" button.
            
    2. Select the area of the figure.
            
    3. Select "Trace Outer Edge".
            
    4. The red line appears surrounding the image.
            
    5. Delete the original image.
            
    6. Edit the outline.  Typically you would want to "Edit Points" from the left column of the window.
            
    7. When the editing is done, click the Silhouette icon from the tool menu.
            
    8. Place the paper on the cutting mat and set it to the machine.
            
    9. Click "Cut" button when everything is ready.
           


Send any shapes to Silhouette and find designs of your choice.  Try cutting shapes and figure out balances and sizes that fit your needs.  

土曜日, 3月 10, 2012

Silhouette Cameo arrived

Silhouette Cameo, the cutting machine arrived yesterday.

Silhouette Cameo

This is the machine of the future. Basically what this machine does is to cut flat and thin materials in any shapes that you specify. It should cut anything paper made that you look at in our lives, including packages, cards, paper craft, etc.

Shamrock

What more, it can detect markings on a printed surface. Any figures that can be printed out on a piece of paper can be cut out. There are a lot of designs for 3D models made out of paper.


A word of caution is that creating cutting pattern can be a little tricky and time consuming. Very thin materials such as copy paper needs extra caution to take it off from the adhesive mat. Heavier thicker paper than copy paper would do a better job.

This paper cutting machine opens up great many fronts in many areas of technologies, sciences, and crafting. This is an excellent tool for education as well. Cut shapes would appeal more to students. The assembled 3D models is much more than the printed images of polygons. Printing out the images of makes 3D modeling not only makes it much more fun but means even more to students of science when it has three dimensions.

Free download of the Silhouette Cameo Studio is here: silhouettestudio

金曜日, 3月 02, 2012

Screen refresh trigger of an input element value or src change

To which extent does a browser redraw the screen?  Would an element's value change trigger refreshing the screen?  

It turns out to be that the Javascript's setting values of an element, actually does not trigger redrawing. 

document.getElementById("test").value="new value";

What puzzled me was, why then the browser redraw the screen in case with setting an img element's src?

document.getElementById("test").src="data:image/png;base64, ...";

This makes it trickier to implement functions that changes value, or src since the behavior will differ when you would want to retain some values for the session.  

I hit upon this problem when I tried to implement a div section that is shown and hidden at a trigger of pressing a button.  The functionality was implemented in the Javascript function and first I implemented it so that it alter the value of an input element.  It worked.  When you press the button, the Javascript function altered the value of the type='button' input element, without refreshing the screen, that is retaining all the variable values.  Then I switched it so that it would alter an image of an type='image' input element.  Now it does not work.  It reset and initialized the screen, namely to a certain initial state and not the state that was specified as. 

日曜日, 2月 19, 2012

Holiday thoughts; high-tech items of the (very near) future

There are four items that I want to purchase.  All of them, I feel the future; with the advancement of technology, or rather, the availability of it.  So much can be accomplished with the right idea, better concepts, and better management. 

One is, Raspberry Pi, a small Linux box that costs $25, or $35 with network connection.  Just at those prices, the full fledged net book equivalent machine power will be offered to so many people in the world.  The 'charitable' organizations offer them 'for educational purposes' -- never a Windows machine.  With its graphics chip that can connect to TV screens, however, this can be a game changer. 

Another is, Craft ROBO, a cutting plotter.  There are numerous other machines that cuts paper, plastic, vinyl sheets, and other materials, but this machine, cuts items that are drawn on your PC.  No cartridges, no nonsense about those black-boxes to set cut patterns.  Its software takes a figure, calculate the outline, and the machine cuts it out for you.  Unfortunately, the latest model is out of stock.  Its manufacturer, Graphtech Inc, says the new model would be coming in March 2012. 

The other is, iPad3 or Windows 8 tablet PC.  App-wise, the share number one is the Android machines, however.  The Windows 8 tablet PC on ARM is yet to come, reportedly in March. 

Lastly, it is the 3D printer.  There are many types of them; stacking shaped plastic lump, cutting out a shape from a resin block, or even binding composite powder layer by layer.  iModela might be the one, but I need more research on these.  Taking out a plastic material, shape them in the way that you like as in printing figures on paper, and use them as in any way that you like, in modeling for fun and for any other useful purposes in research and engineering, replaceable parts of an equipment anywhere, etc.

Flask の Blueprint のテンプレート問題

  Flask の Blueprint は、ルート、静的ファイル、テンプレートをまとめて管理できます。しかし、テンプレートが指定できません。 ここでは、Blueprint の template_folder の問題点と回避策を説明します。 Blueprint のテンプレート問題...