piayo's blog

はっさみYO! 沖縄でまったりWeb制作

G-calize Version 2 に更新

chrome.google.com

拡張機能、長年ほったらかしにしてました。すいません。
Manifest V3 に更新しないとストアから消えちゃうので修正。

設定画面、
別タブで開くよりその場で色変更できたほうが楽なので、Googleカレンダー画面に挿入する方式に変更。

今日の背景色を無くしました。ごめんなさい。
祝日よりも優先すべきか悩んで、丸いアクセントはあるし、わかるだろうってことで。
ここらへん意見ほしいかも。コメントください。

Version: 2.1.0 背景色の復活、枠線色を追加、をしました。
コメントくださった方ありがとうございます。

祝日カレンダーの選択も動かなくなってたので修正。
自分のカレンダーでやりたい方は、別途カレンダー作成終日でイベント登録カレンダーを一般公開 にし、そのカレンダーIDを入力してください。

言語化・翻訳、
https://dekiru.net/article/18336/ を参考にしてやった。便利だ。

ソース新しく書き直した。
JS読みにくい...(昔の私は頑張ってた。jQuery大好きだった)。

新しく使ったのがこれら。

  • TypeScript: 型あると安心。
  • lit-html: 宣言的に書けて便利。
  • HTMLDialogElement: ダイアログ表示。フォーカスが裏に回らないので便利。
  • Animation API: ダイアログ表示/非表示 で利用
  • CSS Nesting: 設定画面のCSSをネストで。

投げ銭リンクも付けてみた。
少しでも収益あると嬉しい&モチベーション上がるので paypalme リンク付けました。
気に入っていただけたらよろしくお願いいたします

Gメールに「そちらの拡張機能を売りませんか?」のメールがいっぱい来ます。
これまでの最高オファーが $13,000( 約189万円 )です。
売ると大変なことになるので売りません。
https://gigazine.net/news/20210218-open-source-extensions-malware/
https://gigazine.net/news/20220831-google-chrome-extension-steal-data/

Google Feed APIが終了。結果、SpreadSheetにしたよ。

 

Google Feed APIが終了っぽくて騒いでますね。
朝、お客様から電話で「ブログのリンクが出てませんけど〜」って。
調べたら廃止予定だったらしい(知らんかった

とりあえず、早急に直さねば。ってことで、
http://rss2json.com/
を見つけて対応。
でもなぁ、いつ終わるかわからないサービスだし心配だなぁと。
まぁその時で別の手考えるか。で終わり。

夕方、twitterで話題になってるかなーって検索すると、みんな困ってる様子。

https://twitter.com/search?f=tweets&q=google%20feed%20api


その中に、おもしろいのを発見。

crocro.com

 Spreadsheetを使う手!なるほど!

日付とかも取得したいし、rdfrssだったので、いろいろいじってみました。
いろいろ参考にし、試行錯誤のが以下になります。

function scraiping(url) {
    var myActiveSpreadSheet = SpreadsheetApp.getActiveSpreadsheet();
    var myActiveSheet = myActiveSpreadSheet.getSheets()[0];
    //ここでkey宣言
    //この部分が後のJSで「gsx$****.$t」で簡単取得できる
    myActiveSheet.getRange(myActiveSheet.getLastRow()+1, 1).setValue("date");
    myActiveSheet.getRange(myActiveSheet.getLastRow(), 2).setValue("title");
    myActiveSheet.getRange(myActiveSheet.getLastRow(), 3).setValue("url");
    var response = UrlFetchApp.fetch(url);
    var myRegexp = /<item [^>]+>([\s\S]*?)<\/item>/gi;
    var match = response.getContentText().match(myRegexp);
    for (var i in match) {
        var txt = match[i];
        var ttl = txt.match(/<title>(.+?)<\/title>/)[1];
        var date = txt.match(/<dc:date>(.+?)<\/dc:date>/)[1];
        var url = txt.match(/rdf:about="(.+?)"/)[1];
        myActiveSheet.getRange(myActiveSheet.getLastRow()+1, 1).setValue(date);
        myActiveSheet.getRange(myActiveSheet.getLastRow(), 2).setValue(ttl);
        myActiveSheet.getRange(myActiveSheet.getLastRow(), 3).setValue(url);
    }
}

※AppScripytはよくわからないもっと簡単にできるかも 

jsonのURLは

https://spreadsheets.google.com/feeds/list/ *** key *** /od6/public/values?alt=json

※注意:[feeds/cells]ではなく[feeds/list]にしています

$.ajax({
    type: "GET",
    dataType: 'json',
    url: [spreadsheetsのURL]
}).done(function(json){
    for(var i=0;i<json.feed.entry.length;i++){
         var entry = json.feed.entry[i];
         //ここで簡単取得
         var date = entry.gsx$date.$t;
         var title = entry.gsx$title.$t;
         var url = entry.gsx$url.$t;
        //ここからごにょごにょ
    }
});

以上。

やるせない

Streamusって拡張が人気みたい。

音楽再生に特化したChrome拡張「Streamus」が便利すぎてiTunesから曲を消した : Blog @narumi

んまぁ、すこし前から知ってましたがブックマーク数がすごいのでやっぱこんな拡張が人気というか需要多いんだなぁーって思った。

 

でもね、俺も2年前に作ってます。

とりあえず公開&様子見。 - piayo's blog

(忙しくてupdateできてないけど

 

一時期は2万ユーザーいたけどさ、今は1万未満。

今はあっちの方が人気みたいで、多分ユーザーが向こうへ流れてる。

嫉妬とゆうか、なんか、やるせない気持ち。

。。。よければ使ってね。

for内DOM構築

DOM操作の最適化によるJavaScriptチューニング(前編)
http://html5experts.jp/yoshikawa_t/1888/

innerHTML += ... な書き方について
http://d.hatena.ne.jp/teramako/20130905/p1

insertAdjacentHTMLってのがあるのか...。使ったことない。

DOM構築パフォーマンスと脆弱性に気を使うので、人によって手法や好みが違うと思うので気になる話題ですね。

新米の俺がforでDOM構築時は(セキュリティ考慮順で)、

  1. 簡単なhtml構造の時はcreateElement, appendChildを使う。
  2. 少々複雑な時はarray.push(str)、最後にinnterHTML=array.join();
  3. 複雑な時はstr+=htmlで最後にinnterHTML=str

かなぁ。ケースバイケース。参考:http://jsfiddle.net/piayo/PjPzK/

次回の記事が気になる。

RSS画面からfeedlyへ登録のやつの

RSS Subscription Extension(by Google

でFeedlyに登録するためのURLを↓で楽になった。

http://cloud.feedly.com/#subscription%2Ffeed%2F%s

f:id:piayo:20130704100911g:plain

Googleリーダーが終わって、FeedlyやらAOL Readerやらdigg Readerやら、の3つを使ってます。どれも物足りなくて・・・。

あっぷでーと

G-calizeをアップデートしました。1.2.0。

https://chrome.google.com/webstore/detail/g-calize/peconnficnlajdpgfcjfmhjibkoijlbp

▼変更点

  • Event pages化(エコ)
  • 設定ページをリデザイン
  • 色選択をjQueryのプラグインからinput type="color"に変更
  • 「年ビュー」に対応
  • 祝日「カレンダーID」を指定してのインポートの不具合修正

実は祝日は「カレンダーID」からも設定できる機能がありまして、多分使ってる人はいないかもなぁ~需要なさそう。と思い、消そうと思ってました。しかし「任意の日」を祝日として色をつけたいとのコメントがあった。やっぱいるんだなー。ってことでこの機能は継続。

参考:http://d.hatena.ne.jp/piayo/20110928/1317225945#c1361071256

インポート、アナログな方法でやってるので、色の反映はリアルタイムではありません。祝日が増えたらその都度、設定ページから再インポートしないといけません。もともと公休日を想定してたので。。。プログラムの腕が上がればいろいろできそうなんだけど、今はこれが限界。

そこのところゆたしくです。

・Event pages化で参考になったページ

http://yonchu.hatenablog.com/entry/2013/05/09/221030